{"version":3,"file":"responsiveNavigation-a5665b07.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\n/**\n * @typedef {('beforebegin'|'afterbegin'|'beforeend'|'afterend')} insertAdjacentHTMLPosition\n */\n\n/**\n * Manipulates the DOM to provide a toggle for showing and hiding navigation\n *\n * @param attachButtonTo {string} - A selector string to identify which unique node to place a toggle switch into\n * @param buttonPosition {insertAdjacentHTMLPosition} - Where in relation to the node to insert the toggle <button>\n * @param navigationContainer {string} - A selector string to identify the unique node whose visibility will be toggled by this function\n */\nfunction doMobileNavigation(\n\tattachButtonTo,\n\tbuttonPosition,\n\tnavigationContainer\n) {\n\tconst html = document.querySelector('html');\n\tconst templateToggleNav = `\n\t\t<button id='mainNavToggle' aria-label=\"Main Menu\">\n\t\t\t<span class='uc_hide-visually'>Open </span>menu\n\t\t</button>\n\t`;\n\n\t// initialise everything\n\t\thtml.dataset.mobileNavigation = 'closed';\n\n\t\tdocument.querySelector(attachButtonTo)\n\t\t\t.insertAdjacentHTML(\n\t\t\t\tbuttonPosition,\n\t\t\t\ttemplateToggleNav\n\t\t\t);\n\n\t\tconst navToggle = document.querySelector('#mainNavToggle');\n\n\t\t// Accessibility enhancements for the dynamic toggling control\n\t\t\tconst theMenu = document.querySelector( navigationContainer );\n\t\t\ttheMenu.setAttribute(\"aria-labelledby\", \"mainNavToggle\");\n\n\t// handle clicks on the menu toggle button\n\t\tnavToggle.addEventListener(\"click\",(e) => {\n\t\t\tlet newNavStatus;\n\t\t\tlet currentNavStatus = html.dataset.mobileNavigation;\n\n\t\t\tif (currentNavStatus == 'open') {\n\t\t\t\t// is open now, so the click is to close it\n\t\t\t\tnavToggle.setAttribute(\"aria-expanded\", false); // applies new value\n\t\t\t\tnavToggle.innerHTML = \"<span class='uc_hide-visually'>Open </span>menu\";\n\t\t\t\thtml.dataset.mobileNavigation = \"closed\";\n\t\t\t} else {\n\t\t\t\t// is closed now, so the click is to open it\n\t\t\t\tnavToggle.setAttribute(\"aria-expanded\", true); // applies new value\n\t\t\t\tnavToggle.innerHTML = \"<span class='uc_hide-visually'>Close </span>menu\";\n\t\t\t\thtml.dataset.mobileNavigation = \"open\";\n\t\t\t}\n\t\t});\n\n\t// ensure the search toggle is where it needs to be\n\t\tlet searchToggle = document.querySelector('.site_context .searchButtonWrapper');\n\t\tdocument.querySelector('.site_context .left').appendChild( searchToggle );\n}\n\n/**\n * Removes all the DOM changes implemented by the doMobileNavigation function\n *\n * @param navigationContainer {string} - A selector string to identify the unique node whose visibility will be toggled by this function\n */\nfunction undoMobileNavigation(navigationContainer) {\n\tconst html = document.querySelector('html');\n\thtml.removeAttribute('data-mobile-navigation');\n\n\tlet navMenuToggle = document.querySelector('#mainNavToggle');\n\tif( navMenuToggle ) {\n\t\tdocument.querySelector('#mainNavToggle').remove();\n\t\tdocument.querySelector(navigationContainer).removeAttribute('aria-labelledby');\n\t}\n\n\t// ensure the search toggle is where it needs to be\n\t\tlet searchToggle = document.querySelector('.site_context .searchButtonWrapper');\n\t\tdocument.querySelector('#site_navigation').appendChild( searchToggle );\n}\n\nlet screenWidth = window.matchMedia('(max-width: 1199px)'); /* 879 */\n\n// initial load\nif( screenWidth.matches ) {\n\tdoMobileNavigation(\n\t\t'.site_title',\n\t\t'afterend',\n\t\t'.nav_main');\n} else {\n\tundoMobileNavigation('.nav_main');\n}\n\n// watch for changes in window size\nscreenWidth.addEventListener(\"change\", (e) => {\n\tif( e.matches ) {\n\t\tdoMobileNavigation(\n\t\t\t'.site_title',\n\t\t\t'afterend',\n\t\t\t'.nav_main'\n\t\t);\n\t} else {\n\t\tundoMobileNavigation('.nav_main');\n\t}\n});\n"],"names":["doMobileNavigation","attachButtonTo","buttonPosition","navigationContainer","html","templateToggleNav","navToggle","e","searchToggle","undoMobileNavigation","screenWidth"],"mappings":"AAqBA,SAASA,EACRC,EACAC,EACAC,EACC,CACD,MAAMC,EAAO,SAAS,cAAc,MAAM,EACpCC,EAAoB;AAAA;AAAA;AAAA;AAAA,GAOzBD,EAAK,QAAQ,iBAAmB,SAEhC,SAAS,cAAcH,CAAc,EACnC,mBACAC,EACAG,CACJ,EAEE,MAAMC,EAAY,SAAS,cAAc,gBAAgB,EAGxC,SAAS,cAAeH,CAAmB,EACnD,aAAa,kBAAmB,eAAe,EAGxDG,EAAU,iBAAiB,QAASC,GAAM,CAElBH,EAAK,QAAQ,kBAEZ,QAEvBE,EAAU,aAAa,gBAAiB,EAAK,EAC7CA,EAAU,UAAY,kDACtBF,EAAK,QAAQ,iBAAmB,WAGhCE,EAAU,aAAa,gBAAiB,EAAI,EAC5CA,EAAU,UAAY,mDACtBF,EAAK,QAAQ,iBAAmB,OAEpC,CAAG,EAGD,IAAII,EAAe,SAAS,cAAc,oCAAoC,EAC9E,SAAS,cAAc,qBAAqB,EAAE,YAAaA,CAAY,CACzE,CAOA,SAASC,EAAqBN,EAAqB,CACrC,SAAS,cAAc,MAAM,EACrC,gBAAgB,wBAAwB,EAEzB,SAAS,cAAc,gBAAgB,IAE1D,SAAS,cAAc,gBAAgB,EAAE,OAAM,EAC/C,SAAS,cAAcA,CAAmB,EAAE,gBAAgB,iBAAiB,GAI7E,IAAIK,EAAe,SAAS,cAAc,oCAAoC,EAC9E,SAAS,cAAc,kBAAkB,EAAE,YAAaA,CAAY,CACtE,CAEA,IAAIE,EAAc,OAAO,WAAW,qBAAqB,EAGrDA,EAAY,QACfV,EACC,cACA,WACA,WAAW,EAEZS,EAAqB,WAAW,EAIjCC,EAAY,iBAAiB,SAAWH,GAAM,CACzCA,EAAE,QACLP,EACC,cACA,WACA,WACH,EAEES,EAAqB,WAAW,CAElC,CAAC"}