hugo.soucy.cc

The personnal website source code of Hugo Soucy. Creates from an homebrewed static website generator (Ferron).
Log | Files | Refs

commit 49816796f75d0e60558d32140c31426c26c71c6b
parent 14549717ea55823282e482274611e57a91858feb
Author: Hugo Soucy <hugo@soucy.cc>
Date:   Sun, 31 Dec 2017 10:47:32 -0500

Hide navigation panel when the escape key is clicked.

Diffstat:
Mstatic/dst/js/script.js | 9+++++++++
Mstatic/dst/js/script.min.js | 2+-
Mstatic/src/js/custom/init.js | 9+++++++++
3 files changed, 19 insertions(+), 1 deletion(-)

diff --git a/static/dst/js/script.js b/static/dst/js/script.js @@ -451,6 +451,15 @@ function setNavigation() { $nav_button.focus(); } ); + + // Close the panel whith the Escape key + du.setEvent(document, 'keydown', function(thatEvt) { + if (thatEvt.keyCode == '27') { + thatEvt.preventDefault(); + + du.triggerEvent($nav_close, 'click'); + } + }); } } diff --git a/static/dst/js/script.min.js b/static/dst/js/script.min.js @@ -28,6 +28,6 @@ function triggerEvent(el,eventType){if(document.createEvent){var event=document. function triggerCustomEvent(el,eventType,eventData){var customEvent;if(window.CustomEvent){customEvent=new CustomEvent(eventType,{detail:eventData});}else{customEvent=document.createEvent('CustomEvent');customEvent.initCustomEvent(eventType,true,true,eventData);} el.dispatchEvent(customEvent);} function isElementInViewport(el){var elRect=el.getBoundingClientRect();return(elRect.top>=0&&elRect.left>=0&&elRect.bottom<=(window.innerHeight||document.documentElement.clientHeight)&&elRect.right<=(window.innerWidth||document.documentElement.clientWidth));} -return{doExtend:doExtend,queryAll:queryAll,setAttrs:setAttrs,setEvent:setEvent,setEventList:setEventList,getIndex:getIndex,getClosest:getClosest,getHeight:getHeight,setClass:setClass,unsetClass:unsetClass,hasClass:hasClass,toggleClass:toggleClass,setDebounce:setDebounce,setThrottle:setThrottle,isElement:isElement,isObject:isObject,triggerEvent:triggerEvent,triggerCustomEvent:triggerCustomEvent,isElementInViewport:isElementInViewport};})(window);function setNavigation(){'use strict';var $nav=document.querySelector('.nav');var visible='state--visible';var hidden='state--hidden';var $nav_panel;var $nav_button;var $nav_close;if(du.isElement($nav)){$nav_panel=$nav.querySelector('.nav__panel');document.body.insertAdjacentHTML('afterbegin',document.querySelector('#navButtonTpl').innerHTML);$nav_panel.insertAdjacentHTML('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');du.setClass($nav_panel,hidden);du.setEvent($nav_button,'click',function(thatEvt){thatEvt.preventDefault();du.toggleClass($nav_panel,hidden);du.toggleClass($nav_panel,visible);$nav_close.focus();});du.setEvent($nav_close,'click',function(thatEvt){thatEvt.preventDefault();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();});du.setEvent($nav_panel,'focus',function(){$nav_button.focus();});}} +return{doExtend:doExtend,queryAll:queryAll,setAttrs:setAttrs,setEvent:setEvent,setEventList:setEventList,getIndex:getIndex,getClosest:getClosest,getHeight:getHeight,setClass:setClass,unsetClass:unsetClass,hasClass:hasClass,toggleClass:toggleClass,setDebounce:setDebounce,setThrottle:setThrottle,isElement:isElement,isObject:isObject,triggerEvent:triggerEvent,triggerCustomEvent:triggerCustomEvent,isElementInViewport:isElementInViewport};})(window);function setNavigation(){'use strict';var $nav=document.querySelector('.nav');var visible='state--visible';var hidden='state--hidden';var $nav_panel;var $nav_button;var $nav_close;if(du.isElement($nav)){$nav_panel=$nav.querySelector('.nav__panel');document.body.insertAdjacentHTML('afterbegin',document.querySelector('#navButtonTpl').innerHTML);$nav_panel.insertAdjacentHTML('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');du.setClass($nav_panel,hidden);du.setEvent($nav_button,'click',function(thatEvt){thatEvt.preventDefault();du.toggleClass($nav_panel,hidden);du.toggleClass($nav_panel,visible);$nav_close.focus();});du.setEvent($nav_close,'click',function(thatEvt){thatEvt.preventDefault();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();});du.setEvent($nav_panel,'focus',function(){$nav_button.focus();});du.setEvent(document,'keydown',function(thatEvt){if(thatEvt.keyCode=='27'){thatEvt.preventDefault();du.triggerEvent($nav_close,'click');}});}} function setCurrentPage(){'use strict';var navLinks=document.querySelectorAll('.nav__link');var lengthOf;var pathname;if(navLinks.item(0)){pathname=window.location.pathname;lengthOf=navLinks.length;while(lengthOf--){var navLinkHref=navLinks[lengthOf].getAttribute('href');if(navLinkHref.indexOf(pathname.split('/')[1])>0){navLinks[lengthOf].removeAttribute('href');}}}} setNavigation(); \ No newline at end of file diff --git a/static/src/js/custom/init.js b/static/src/js/custom/init.js @@ -61,6 +61,15 @@ function setNavigation() { $nav_button.focus(); } ); + + // Close the panel whith the Escape key + du.setEvent(document, 'keydown', function(thatEvt) { + if (thatEvt.keyCode == '27') { + thatEvt.preventDefault(); + + du.triggerEvent($nav_close, 'click'); + } + }); } }