From 202c614849f676001df124f320c1c501288eecd8 Mon Sep 17 00:00:00 2001
From: Agate Berriot <aberriot@entrouvert.com>
Date: Tue, 30 Aug 2022 11:49:28 +0200
Subject: [PATCH] accessibility: support hiding menus through escape keys
 (#40930)

---
 combo/public/static/js/combo.public.js | 16 ++++++++++++++++
 combo/public/templates/combo/menu.html |  4 ++--
 2 files changed, 18 insertions(+), 2 deletions(-)

diff --git a/combo/public/static/js/combo.public.js b/combo/public/static/js/combo.public.js
index 0a4952db..c047d61b 100644
--- a/combo/public/static/js/combo.public.js
+++ b/combo/public/static/js/combo.public.js
@@ -422,4 +422,20 @@ $(function() {
       paginate_cards($(elem));
     }
   });
+  // accessibililty enhancements:
+  // support for hiding some elements (such as submenus)
+  // when the escape key is pressed
+  $(document).keydown(function(e) {
+    if (e.key === "Escape") { 
+      $(".hide-on-escape:visible").hide()
+    }
+  });
+  // and ensure the elements can be viewed again
+  // on subsequent hover/focus
+  function reset_hidden_elements(event) {
+    var root_element = $(event.target).closest('.contains-hidden-elements')
+    $(root_element).find('.hide-on-escape').css({display: ''})
+  }
+  $('.contains-hidden-elements').mouseenter(reset_hidden_elements, null)
+  $('.contains-hidden-elements').focusin(reset_hidden_elements)
 });
diff --git a/combo/public/templates/combo/menu.html b/combo/public/templates/combo/menu.html
index 8a922723..db71a32c 100644
--- a/combo/public/templates/combo/menu.html
+++ b/combo/public/templates/combo/menu.html
@@ -1,9 +1,9 @@
 {% load i18n %}
 {% if menuitems %}
-<ul class="{{ is_submenu|yesno:"submenu,menu" }}">
+<ul class="{{ is_submenu|yesno:"submenu,menu" }} {% if is_submenu %}hide-on-escape{% endif %}">
 {% spaceless %}
 {% for menuitem in menuitems %}
-<li data-menu-page-id="{{ menuitem.page.id }}" class="{{ is_submenu|yesno:"submenu,menu" }}--item menu-{{ menuitem.page.slug }} {% if menuitem.selected %}selected{% endif %}">
+<li data-menu-page-id="{{ menuitem.page.id }}" class="{% if depth > 1 %}contains-hidden-elements{% endif %} {{ is_submenu|yesno:"submenu,menu" }}--item menu-{{ menuitem.page.slug }} {% if menuitem.selected %}selected{% endif %}">
   <a
     {% if menuitem.selected %}title="{{ menuitem.page.title }} - {% trans "active page" %}"{% endif %}
     href="{% page_absolute_url menuitem.page %}"
-- 
2.37.2