hugosoucycc

commit d7b98086d1123cbf38db638b4731e8ed1c5f8f85
parent ca79efe4de5ef2b30467e5f47c199f7548594e91
Author: Hugo Soucy <hugo@soucy.cc>
Date:   Wed, 27 Sep 2017 10:47:44 -0400

Script the focus traps behaviours

Diffstat:
M
static/dev/js/custom/init.js
 | 
22
++++++++++++++++++++--

1 file changed, 20 insertions(+), 2 deletions(-)
diff --git a/static/dev/js/custom/init.js b/static/dev/js/custom/init.js
@@ -16,9 +16,17 @@ function setNavigation() {
         );
 
         $nav_panel.insertAdjacentHTML(
-            'beforeend', document.querySelector('#navCloseTpl').innerHTML
+            'afterbegin', document.querySelector('#navCloseTpl').innerHTML
         );
-        
+
+        $nav_panel.insertAdjacentHTML(
+            'afterbegin', document.querySelector('#navTrapTpl').innerHTML
+        );
+
+        $nav_panel.insertAdjacentHTML(
+            'beforeend', document.querySelector('#navTrapTpl').innerHTML
+        );
+
         $nav_button = document.querySelector('.nav-button');
         $nav_close = $nav_panel.querySelector('.nav__close');
 
@@ -29,6 +37,8 @@ function setNavigation() {
 
             du.toggleClass($nav_panel, hidden);
             du.toggleClass($nav_panel, visible);
+
+            $nav_close.focus();
         });
 
         du.setEvent($nav_close, 'click', function(thatEvt) {
@@ -36,7 +46,15 @@ function setNavigation() {
 
             du.toggleClass($nav_panel, hidden);
             du.toggleClass($nav_panel, visible);
+
+            $nav_button.focus();
         });
+
+        du.setEventList(
+            $nav_panel.querySelectorAll('.nav__trap'), 'focus', function() {
+                $nav_close.focus();
+            }
+        );
     }
 }