When reloading, current pane is kept

client/assets/css/main.css

@@ -23,10 +23,6 @@
     display: none;
 }
 
-#pane-keyboard {
-    display: block;
-}
-
 #pointer {
     height: 80vh;
     width: 95%;

client/assets/js/main.js

@@ -9,10 +9,19 @@ $(function() {
     var scrollLastTimestamp = null;
     var scrollLastValue = null;
 
+    var hash = window.location.hash;
+
+    if (hash) {
+        $(hash).show();
+        $('a[href="' + hash + '"]').addClass('active');
+    } else {
+        $('#panel-keyboard').show();
+        $('#nav a').first().addClass('active');
+    }
+
     $('.select2').select2();
 
     $('#nav a').click(function(e) {
-        e.preventDefault();
         $('.pane').hide();
 
         var target = $(this).attr('href');

client/index.html

@@ -15,7 +15,7 @@
         <div class="col-12">
             <ul class="nav nav-pills nav-fill" id="nav">
                 <li class="nav-item">
-                    <a class="nav-link active" href="#pane-keyboard">KEYBOARD</a>
+                    <a class="nav-link" href="#pane-keyboard">KEYBOARD</a>
                 </li>
                 <li class="nav-item">
                     <a class="nav-link" href="#pane-i3">I3</a>
@@ -184,7 +184,7 @@
 </div>
 
 <div id="disconneced">
-    You are not connected. <a href="?">Refresh</a>
+    You are not connected. <a href="#" onclick="location.reload(); return false;">Refresh</a>
 </div>
 
 <script src="vendor/components/jquery/jquery.min.js"></script>