{"version":3,"file":"7005.284b0c520416e4c6e59a.js","mappings":"iWAIO,IAAMA,EAAe,CACxBC,QAAQ,GAGNC,EAAAA,WAEF,WAAYC,EAASC,EAASC,EAAUC,GAAa,Y,4FAAA,SACjDC,KAAKJ,QAAUA,EACfI,KAAKH,QAAUA,EACfG,KAAKF,SAAWA,EAChBE,KAAKD,YAAcA,EACnBC,KAAKN,QAAS,EAEdM,KAAKH,QAAQI,gBAAgB,UAE7BD,KAAKJ,QAAQM,QAAU,WACf,EAAKR,QAAQ,EAAKS,MACzB,EACDH,KAAKF,SAASI,QAAU,WACjB,EAAKR,QAAQ,EAAKU,MACxB,EAEDJ,KAAKH,QAAQQ,iBAAiB,WAAW,SAACC,GACtC,GAES,WAFDA,EAAEC,IAGC,EAAKb,SACJY,EAAEE,iBACF,EAAKJ,MAAK,GAIzB,IAEDJ,KAAKF,SAASO,iBAAiB,WAAW,SAACC,GACvC,GAES,QAFDA,EAAEC,IAGC,EAAKb,SACJY,EAAEE,iBACF,EAAKT,YAAYU,QAIhC,GACJ,C,0CAED,WAAO,WACHT,KAAKH,QAAQa,gBAAkB,KAC/BV,KAAKH,QAAQc,aAAa,eAAe,GACzCX,KAAKJ,QAAQe,aAAa,iBAAiB,GAC3CX,KAAKN,QAAS,EACdD,EAAaC,QAAS,EACtBkB,OAAOC,uBAAsB,WACzB,EAAKhB,QAAQiB,UAAUC,IAAI,uBAC3B,EAAKhB,YAAYU,OACpB,GACJ,G,kBAED,WAAsB,WAAjBO,EAAiB,wDAClBhB,KAAKJ,QAAQe,aAAa,iBAAiB,GAC3CX,KAAKN,QAAS,EACdD,EAAaC,QAAS,EACtBM,KAAKH,QAAQiB,UAAUG,OAAO,uBAC9BjB,KAAKH,QAAQa,gBAAkB,SAACJ,GACzBA,EAAEY,QAAU,EAAKrB,SAAS,EAAKsB,cAAcH,EACnD,CACJ,G,2BAED,WAA+B,IAAjBA,EAAiB,wDAC3BhB,KAAKH,QAAQc,aAAa,eAAe,GACzCX,KAAKH,QAAQa,gBAAkB,KAC5BM,GAAShB,KAAKJ,QAAQa,OAC5B,I,mFArECd,GAwEAyB,EAAuBC,SAASC,cAAc,gDAChDC,EAAsBF,SAASC,cAAc,2BAC7CE,EAAuBH,SAASC,cAAc,6BAC9CG,EAA4C,OAAxBF,EAA+BA,EAAoBD,cAAc,wBAA0B,KAExF,MAAxBF,GAAuD,MAAvBG,GAAuD,MAAxBC,GAAqD,MAArBC,GAC9F,IAAI9B,EAAmByB,EAAsBG,EAAqBC,EAAsBC,E","sources":["webpack://nationalspacecentre.web/./wwwroot/app/src/js/header-search.js"],"sourcesContent":["// ***************************\r\n// *****  Header search  *****\r\n// ***************************\r\n\r\nexport const headerSearch = {\r\n    active: false\r\n};\r\n\r\nclass HeaderSearchSystem {\r\n\r\n    constructor(showBtn, wrapper, closeBtn, searchField) {\r\n        this.showBtn = showBtn;\r\n        this.wrapper = wrapper;\r\n        this.closeBtn = closeBtn;\r\n        this.searchField = searchField;\r\n        this.active = false;\r\n        // remove 'hidden' attribute\r\n        this.wrapper.removeAttribute('hidden');\r\n        // triggers\r\n        this.showBtn.onclick = () => {\r\n            if(!this.active) this.show();\r\n        };\r\n        this.closeBtn.onclick = () => {\r\n            if(this.active) this.hide();\r\n        };\r\n        // ESC key closes search\r\n        this.wrapper.addEventListener('keydown', (e) => {\r\n            switch (e.key) {\r\n                // ESCAPE jumps out a level\r\n                case 'Escape':\r\n                    if(this.active) {\r\n                        e.preventDefault();\r\n                        this.hide(true);\r\n                    }\r\n                    break;\r\n            }\r\n        });\r\n        // loop the tabbing if search area is active\r\n        this.closeBtn.addEventListener('keydown', (e) => {\r\n            switch (e.key) {\r\n                // TAB\r\n                case 'Tab':\r\n                    if(this.active) {\r\n                        e.preventDefault();\r\n                        this.searchField.focus();\r\n                    }\r\n                    break;\r\n            }\r\n        });\r\n    }\r\n\r\n    show() {\r\n        this.wrapper.ontransitionend = null;\r\n        this.wrapper.setAttribute('aria-hidden', false);\r\n        this.showBtn.setAttribute('aria-expanded', true);\r\n        this.active = true;\r\n        headerSearch.active = true;\r\n        window.requestAnimationFrame(() => {\r\n            this.wrapper.classList.add('search-form--active');\r\n            this.searchField.focus();\r\n        });\r\n    }\r\n\r\n    hide(doFocus = false) {\r\n        this.showBtn.setAttribute('aria-expanded', false);\r\n        this.active = false;\r\n        headerSearch.active = false;\r\n        this.wrapper.classList.remove('search-form--active');\r\n        this.wrapper.ontransitionend = (e) => {\r\n            if(e.target == this.wrapper) this.transitionEnd(doFocus);\r\n        };\r\n    }\r\n\r\n    transitionEnd(doFocus = false) {\r\n        this.wrapper.setAttribute('aria-hidden', true);\r\n        this.wrapper.ontransitionend = null;\r\n        if(doFocus) this.showBtn.focus();\r\n    }\r\n}\r\n\r\nconst headerSearchShownBtn = document.querySelector('#header--utility-bar--tools--search-show-btn'),\r\n    headerSearchWrapper = document.querySelector('#header--search-wrapper'),\r\n    headerSearchCloseBtn = document.querySelector('#header--search-close-btn'),\r\n    headerSearchField = headerSearchWrapper !== null ? headerSearchWrapper.querySelector('input[type=\"search\"]') : null;\r\n\r\nif(headerSearchShownBtn != null && headerSearchWrapper != null && headerSearchCloseBtn != null && headerSearchField != null) {\r\n    new HeaderSearchSystem(headerSearchShownBtn, headerSearchWrapper, headerSearchCloseBtn, headerSearchField);\r\n}"],"names":["headerSearch","active","HeaderSearchSystem","showBtn","wrapper","closeBtn","searchField","this","removeAttribute","onclick","show","hide","addEventListener","e","key","preventDefault","focus","ontransitionend","setAttribute","window","requestAnimationFrame","classList","add","doFocus","remove","target","transitionEnd","headerSearchShownBtn","document","querySelector","headerSearchWrapper","headerSearchCloseBtn","headerSearchField"],"sourceRoot":""}