From: Vincent Vanwaelscappel <vincent@cubedesigners.com>
Date: Fri, 9 May 2025 11:11:58 +0000 (+0200)
Subject: wip #7461 @0.5
X-Git-Url: http://git.cubedesigners.com/?a=commitdiff_plain;h=9dd4b88f16d96cd6f7c4d13c41cc91001a8d21d8;p=fluidbook-html5.git

wip #7461 @0.5
---

diff --git a/js/libs/fluidbook/fluidbook.burger.js b/js/libs/fluidbook/fluidbook.burger.js
index 4a85d2a2..beca1052 100644
--- a/js/libs/fluidbook/fluidbook.burger.js
+++ b/js/libs/fluidbook/fluidbook.burger.js
@@ -2,6 +2,7 @@ function FluidbookBurger(nav) {
     this.nav = nav;
     this.fluidbook = nav.fluidbook;
     this.closeTimeout;
+    this.isOpened = false;
 }
 
 FluidbookBurger.prototype = {
@@ -67,7 +68,7 @@ FluidbookBurger.prototype = {
             navOrder = this.fluidbook.settings.navOrder;
         }
 
-        var menuOpener = '<a href="#" id="menuOpener">' + getSpriteIcon('interface-menu') + '<span class="label">' + this.fluidbook.l10n.__('Menu') + '</span></a>';
+        var menuOpener = '<a href="#" id="menuOpener" aria-expanded="false" aria-controls="menu" aria-keyshortcuts="F10">' + getSpriteIcon('interface-menu') + '<span class="label">' + this.fluidbook.l10n.__('Menu') + '</span></a>';
         $('#main header').append(menuOpener);
 
         // Add holder list element for menu items
@@ -152,7 +153,7 @@ FluidbookBurger.prototype = {
 
         // Close menu when a search result is clicked
         $(document).on(this.fluidbook.input.clickEvent, '#menuSearchResults a', function (e) {
-            $this.closeMenu();
+            $this.close();
         });
 
         // Recalculate available size for menu search results
@@ -169,20 +170,23 @@ FluidbookBurger.prototype = {
         });
 
         $("#menuOverlay").on(this.fluidbook.input.clickEvent, function () {
-            $this.closeMenu();
+            $this.close();
         });
 
         $(this.fluidbook).on('fluidbook.help.show', function () {
-
+            $this.close();
         });
     },
 
     open: function () {
+        this.isOpened = true;
         clearTimeout(this.closeTimeout);
         $("#menu,#menuOverlay").show();
         setTimeout(function () {
             $("#menu").addClass('open');
         }, 10);
+
+        $("#menuOpener").attr('aria-expanded', 'true');
     },
 
     closeAll: function () {
@@ -190,13 +194,22 @@ FluidbookBurger.prototype = {
     },
 
     close: function () {
+        this.isOpened = false;
         clearTimeout(this.closeTimeout);
         $("#menu").removeClass('open');
+        $("#menuOpener").attr('aria-expanded', 'false');
         this.closeTimeout = setTimeout(function () {
             $("#menu,#menuOverlay").hide();
         }, 500);
     },
 
+    toggle: function () {
+        if (this.isOpened) {
+            return this.close();
+        }
+        return this.open();
+    },
+
     openSearch: function (q, cb) {
         if (!this.fluidbook.search.isSearchActive()) {
             if (!this.fluidbook.settings.searchFullBurger) {
@@ -212,7 +225,7 @@ FluidbookBurger.prototype = {
                 this.fluidbook.search.submitForm();
             }
         } else {
-            this.burger.open();
+            this.open();
             $('#q').focus(); // Put cursor in the search field
         }
 
@@ -237,7 +250,7 @@ FluidbookBurger.prototype = {
             if ($this.fluidbook.search.isSearchActive()) {
                 $this.fluidbook.search.closeSearch();
                 if ($("#horizontalNav").is(':visible')) {
-                    $this.closeMenu();
+                    $this.close();
                 }
             } else {
                 // If we're closing the menu but the search was open and nothing
@@ -250,7 +263,7 @@ FluidbookBurger.prototype = {
                     $this.fluidbook.search.closeSearch();
                 }
 
-                $this.burger.close();
+                $this.close();
             }
         });
 
diff --git a/js/libs/fluidbook/fluidbook.keyboard.js b/js/libs/fluidbook/fluidbook.keyboard.js
index 6d6b1a1e..b23f24d8 100644
--- a/js/libs/fluidbook/fluidbook.keyboard.js
+++ b/js/libs/fluidbook/fluidbook.keyboard.js
@@ -46,6 +46,10 @@ FluidbookKeyboard.prototype = {
             this.keyShortcut('ctrl+p', function () {
             });
         }
+
+        this.keyShortcut('f10', function () {
+            $this.fluidbook.nav.burger.toggle();
+        })
     },
 
     _navigate: function (list, dir, actions) {
diff --git a/js/libs/fluidbook/fluidbook.nav.js b/js/libs/fluidbook/fluidbook.nav.js
index e9cf5f99..0b157a98 100644
--- a/js/libs/fluidbook/fluidbook.nav.js
+++ b/js/libs/fluidbook/fluidbook.nav.js
@@ -377,8 +377,8 @@ FluidbookNav.prototype = {
                 // __('switch off the sound')
                 // __('switch on the sound')
                 // __('switch on / switch off the sound')
-                link = this.addLink(navType, 'nav-sound-on', '#', 'sound-on', 'switch off the sound', 'switch on / switch off the sound', 'F10');
-                link2 = this.addLink(navType, 'nav-sound-off', '#', 'sound-off', 'switch on the sound', 'switch on / switch off the sound', 'F10');
+                link = this.addLink(navType, 'nav-sound-on', '#', 'sound-on', 'switch off the sound', 'switch on / switch off the sound', 'Ctrl+M');
+                link2 = this.addLink(navType, 'nav-sound-off', '#', 'sound-off', 'switch on the sound', 'switch on / switch off the sound', 'Ctrl+M');
             } else if (icon === 'search') {
                 // __('search')
                 // Only the horizontal icon menu has the search icon, which opens the main menu