theme: add keyboard shortcuts for all header navigations #268

static/css/theme.css

@@ -378,6 +378,11 @@ th {
     }
 }
 
+#body-inner:focus-visible{
+    /* remove focus indicator for programatically set focus */
+    outline: none;
+}
+
 #body h1 + hr {
     margin-bottom: 2rem;
     margin-top: -1rem;

static/js/theme.js

@@ -345,7 +345,7 @@ function initMenuScrollbar(){
     // PSC removed for #242 #243 #244
     // psc = new PerfectScrollbar('#body-inner');
     psm = new PerfectScrollbar('#content-wrapper');
-    pst = new PerfectScrollbar('#TableOfContents');
+    pst = document.querySelector('#TableOfContents') ? new PerfectScrollbar('#TableOfContents') : null;
     document.addEventListener('keydown', function(){
         // if we facked initial scrolling, we want to
         // remove the focus to not leave visual markers on
@@ -448,8 +448,35 @@ function tocEscapeHandler( event ){
     }
 }
 
-function initToc(){
+function sidebarShortcutHandler( event ){
-    function showNav(){
+    if( event.altKey && event.ctrlKey && event.which == 77 /* m */ ){
+        showNav();
+    }
+}
+
+function tocShortcutHandler( event ){
+    if( event.altKey && event.ctrlKey && event.which == 84 /* t */ ){
+        showToc();
+    }
+}
+
+function editShortcutHandler( event ){
+    if( event.altKey && event.ctrlKey && event.which == 69 /* e */ ){
+        showEdit();
+    }
+}
+
+function printShortcutHandler( event ){
+    if( event.altKey && event.ctrlKey && event.which == 80 /* p */ ){
+        showPrint();
+    }
+}
+
+function showNav(){
+    if( !document.querySelector( '#sidebar-overlay' ) ){
+        // we may not have a flyout
+        return;
+    }
     var b = document.querySelector( 'body' );
     b.classList.toggle( 'sidebar-flyout' );
     if( b.classList.contains( 'sidebar-flyout' ) ){
@@ -462,8 +489,14 @@ function initToc(){
         document.querySelector( '#body-inner' ).focus();
         psc && psc.scrollbarY.focus();
     }
+}
+
+function showToc(){
+    var t = document.querySelector( '#toc-menu' );
+    if( !t ){
+        // we may not have a toc
+        return;
     }
-    function showToc(){
     var b = document.querySelector( 'body' );
     b.classList.toggle( 'toc-flyout' );
     if( b.classList.contains( 'toc-flyout' ) ){
@@ -475,7 +508,39 @@ function initToc(){
         document.querySelector( '#body-inner' ).focus();
         psc && psc.scrollbarY.focus();
     }
+}
+
+function showEdit(){
+    var l = document.querySelector( '#top-github-link a' );
+    if( l ){
+        l.click();
     }
+}
+
+function showPrint(){
+    var l = document.querySelector( '#top-print-link a' );
+    if( l ){
+        l.click();
+    }
+}
+
+function initToc(){
+    if( isPrint ){
+        return;
+    }
+
+    document.addEventListener( 'keydown', editShortcutHandler );
+    document.addEventListener( 'keydown', printShortcutHandler );
+    document.addEventListener( 'keydown', sidebarShortcutHandler );
+    document.addEventListener( 'keydown', tocShortcutHandler );
+    // avoid keyboard navigation for input fields
+    jQuery(formelements).keydown(function (e) {
+        if( e.altKey && event.ctrlKey ){
+            if( e.which == 77 /* m */ || e.which == 84 /* t */ || e.which == 69 /* e */ || e.which == 80 /* p */ ){
+                e.stopPropagation();
+            }
+        }
+    });
 
     document.querySelector( '#sidebar-overlay' ).addEventListener( 'click', showNav );
     document.querySelector( '#sidebar-toggle' ).addEventListener( 'click', showNav );