{"version":3,"file":"responsiveNavigation.01f19daf.js","sources":["../../../src/js/modules/responsive-navigation.js"],"sourcesContent":["\"use strict\";\n\n// NOTE TO SELF\n// Found better example code to reference for improved a11y on drop menus...\n// https://www.w3.org/TR/wai-aria-practices/examples/menubar/menubar-1/menubar-1.html\n//\n// More at\n// https://www.w3.org/TR/wai-aria-practices/\n// https://www.w3.org/TR/wai-aria-practices/examples/\n\nfunction doMobileNavigation() {\n\tdocument.querySelector('html').classList.add('mobile-nav');\n\n\t// create the navigation toggle button\n\t\tlet templateToggleNav = `\n\t\t\t<button id='mainNavToggle' aria-label=\"Main Menu\">\n\t\t\t\t<span class='text'>Menu</span>\n\t\t\t\t<span class='burger'>\n\t\t\t\t\t<span class='line'></span>\n\t\t\t\t</span>\n\t\t\t</button>\n\t\t`;\n\t\tdocument.querySelector('.menuTrigger').insertAdjacentHTML('afterbegin', templateToggleNav);\n\t\tlet navToggle = document.querySelector('#mainNavToggle');\n\n\t// Accessability enhancements for the dynamic toggling control\n\t\tlet theMenu = document.querySelector('#site_navigation');\n\t\ttheMenu.setAttribute(\"aria-labelledby\", \"mainNavToggle\");\n\n\t// handle clicks on the menu toggle button\n\t\tnavToggle.addEventListener(\"click\", function (e) {\n\t\t\tlet newNavStatus;\n\t\t\tlet navIsOpen = document.querySelector('html').classList.contains(\"nav-active\"); // returns true|false\n\n\t\t\tconsole.log(`navIsOpen ${navIsOpen}`);\n\t\t\tconsole.log(navToggle);\n\t\t\tconsole.log(theMenu);\n\n\t\t\tnewNavStatus  = !navIsOpen; // inverts the value\n\n\t\t\tnavToggle.setAttribute(\"aria-expanded\", newNavStatus); // applies new value\n\n\t\t\tdocument.querySelector('html').classList.toggle(\"nav-active\");\n\t\t});\n\n\t// handle keyboard focussing inside the nav\n\t// NOTE: this could be done in CSS with :focus-within, but then you lose ARIA status updates\n\t\tdocument.querySelector('#site_navigation').addEventListener('focusin', function(e){\n\t\t\tnavToggle.setAttribute(\"aria-expanded\", 'true');\n\t\t\tdocument.querySelector('html').classList.add(\"nav-active\");\n\t\t});\n\t\tdocument.querySelector('#site_navigation').addEventListener('focusout', function(e){\n\t\t\tnavToggle.setAttribute(\"aria-expanded\", 'false');\n\t\t\tdocument.querySelector('html').classList.remove(\"nav-active\");\n\t\t});\n}\n\nfunction undoMobileNavigation() {\n\tdocument.querySelector('html').classList.remove('mobile-nav');\n\n\tlet navMenuToggle = document.querySelector('#mainNavToggle');\n\tif( navMenuToggle ) {\n\t\tdocument.querySelector('html').classList.remove(\"nav-active\");\n\t\tdocument.querySelector('#mainNavToggle').remove();\n\t\tdocument.querySelector('#site_navigation').removeAttribute('aria-labelledby');\n\t}\n}\n\n// let screenWidth = window.matchMedia('(max-width: 680px)');\ndoMobileNavigation();\n// // initial load\n// if( screenWidth.matches ) {\n// \tdoMobileNavigation();\n// } else {\n// \tundoMobileNavigation();\n// }\n\n// // watch for changes in window size\n// screenWidth.addEventListener(\"change\", (e) => {\n// \tif( e.matches ) {\n// \t\tdoMobileNavigation();\n// \t} else {\n// \t\tundoMobileNavigation();\n// \t}\n// });"],"names":["doMobileNavigation","templateToggleNav","navToggle","theMenu","e","newNavStatus","navIsOpen"],"mappings":"AAUA,SAASA,GAAqB,CAC7B,SAAS,cAAc,MAAM,EAAE,UAAU,IAAI,YAAY,EAGxD,IAAIC,EAAoB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAQxB,SAAS,cAAc,cAAc,EAAE,mBAAmB,aAAcA,CAAiB,EACzF,IAAIC,EAAY,SAAS,cAAc,gBAAgB,EAGnDC,EAAU,SAAS,cAAc,kBAAkB,EACvDA,EAAQ,aAAa,kBAAmB,eAAe,EAGvDD,EAAU,iBAAiB,QAAS,SAAUE,EAAG,CAChD,IAAIC,EACAC,EAAY,SAAS,cAAc,MAAM,EAAE,UAAU,SAAS,YAAY,EAE9E,QAAQ,IAAI,aAAaA,GAAW,EACpC,QAAQ,IAAIJ,CAAS,EACrB,QAAQ,IAAIC,CAAO,EAEnBE,EAAgB,CAACC,EAEjBJ,EAAU,aAAa,gBAAiBG,CAAY,EAEpD,SAAS,cAAc,MAAM,EAAE,UAAU,OAAO,YAAY,CAC/D,CAAG,EAID,SAAS,cAAc,kBAAkB,EAAE,iBAAiB,UAAW,SAASD,EAAE,CACjFF,EAAU,aAAa,gBAAiB,MAAM,EAC9C,SAAS,cAAc,MAAM,EAAE,UAAU,IAAI,YAAY,CAC5D,CAAG,EACD,SAAS,cAAc,kBAAkB,EAAE,iBAAiB,WAAY,SAASE,EAAE,CAClFF,EAAU,aAAa,gBAAiB,OAAO,EAC/C,SAAS,cAAc,MAAM,EAAE,UAAU,OAAO,YAAY,CAC/D,CAAG,CACH,CAcAF"}