{"version":3,"file":"panel-resources.6f4252.js","mappings":"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","sources":["webpack://cloroxpro-ca/./js/src/views/panel-resources.js"],"sourcesContent":["export default class ResourcesPanel {\n    constructor() {\n        $(document).ready(() => {\n            this.tabbed = document.querySelector('.accordion-to-tab');\n            this.tablist = this.tabbed.querySelector('.accordion-toc');\n            this.tabs = this.tabbed.querySelectorAll('.accordion-trigger');\n            this.panels = this.tabbed.querySelectorAll('.content-area');\n\n            // If there are no tabs added in the CMS, don't do anything else\n            if (this.tabs.length > 0) {\n                this.initListeners();\n            }\n        });\n    }\n\n    initListeners() {\n        // Add tablist role to the first .accordion-toc in the tabbed container\n        this.tablist.setAttribute('role', 'tablist');\n\n        Array.prototype.forEach.call(this.tabs, (tab, i) => {\n            // Add semantics are remove user focusability for each tab\n            tab.setAttribute('role', 'tab');\n            tab.setAttribute('id', `tab${i + 1}`);\n            tab.setAttribute('tabindex', '-1');\n            tab.parentNode.setAttribute('role', 'presentation');\n\n            const handleClick = (e) => {\n                // Don't allow click to follow link for mobile view\n                if (window.innerWidth < 1025) e.preventDefault();\n\n                const currentTab = this.tablist.querySelector('[aria-selected]');\n                if (e.currentTarget === currentTab) {\n                    this.toggleTab(e.currentTarget);\n                } else {\n                    this.switchTab(currentTab, e.currentTarget);\n                }\n            };\n\n            const handleHover = (e) => {\n                const currentTab = this.tablist.querySelector('[aria-selected]');\n\n                if (e.currentTarget !== currentTab && window.innerWidth > 1024) {\n                    this.switchTab(currentTab, e.currentTarget);\n                }\n            };\n\n            tab.addEventListener('click', handleClick);\n            tab.addEventListener('mouseenter', handleHover);\n\n            // Handle keydown events for keyboard users\n            tab.addEventListener('keydown', (e) => {\n                // Get the index of the current tab in the this.tabs node list\n                const index = Array.prototype.indexOf.call(this.tabs, e.currentTarget);\n\n                // Work out which key the user is pressing and\n                // Calculate the new tab's index where appropriate\n                let direction;\n                switch (e.which) {\n                    case 38:\n                        // up\n                        direction = index - 1;\n                        break;\n                    case 40:\n                        // down\n                        direction = index + 1;\n                        break;\n                    case 39:\n                        // right\n                        direction = 'content';\n                        break;\n                    default:\n                        direction = null;\n                        break;\n                }\n\n                if (direction !== null) {\n                    e.preventDefault();\n\n                    // If the down key is pressed, move focus to the open panel,\n                    // otherwise switch to the adjacent tab\n                    if (direction === 'content') {\n                        this.panels[i].focus();\n                    } else if (this.tabs[direction]) {\n                        this.switchTab(e.currentTarget, this.tabs[direction]);\n                    }\n                }\n            });\n        });\n\n        // Add tab panel semantics and hide them all\n        Array.prototype.forEach.call(this.panels, (panel, i) => {\n            panel.setAttribute('role', 'tabpanel');\n            panel.setAttribute('tabindex', '0');\n            panel.setAttribute('aria-labelledby', this.tabs[i].id);\n            panel.hidden = true;\n\n            panel.addEventListener('keydown', (e) => {\n                if (e.which === 37) {\n                    // If left is pressed from a panel, go back to current tab\n                    document.querySelector('.accordion-header.active a').focus();\n                }\n            });\n        });\n\n        // Initially activate the first tab and reveal the first tab panel\n        this.tabs[0].removeAttribute('tabindex');\n        this.tabs[0].setAttribute('aria-selected', 'true');\n        this.panels[0].hidden = false;\n    }\n\n    // The tab switching function\n    switchTab(oldTab, newTab) {\n        // Switch classes of list items\n        if (oldTab) {\n            oldTab.parentNode.classList.remove('active');\n            oldTab.removeAttribute('aria-selected');\n            oldTab.setAttribute('tabindex', '-1');\n\n            const oldIndex = Array.prototype.indexOf.call(this.tabs, oldTab);\n            this.panels[oldIndex].hidden = true;\n        }\n        newTab.parentNode.classList.add('active');\n        newTab.focus();\n        newTab.removeAttribute('tabindex');\n        newTab.setAttribute('aria-selected', 'true');\n        const index = Array.prototype.indexOf.call(this.tabs, newTab);\n        this.panels[index].hidden = false;\n\n        // Force lazy loaded images\n        $(this.panels[index]).find('.lazy').Lazy({ effect: 'fadeIn', effectTime: 200 });\n    }\n\n    toggleTab(tab) {\n        const header = tab.parentNode;\n        const isActive = header.classList.contains('active');\n        const content = tab.parentNode.querySelector('.content-area');\n\n        // Toggle state, similar to switchTab()\n        if (isActive) {\n            header.classList.remove('active');\n            tab.removeAttribute('aria-selected');\n            content.hidden = true;\n        } else {\n            header.classList.add('active');\n            tab.setAttribute('aria-selected', 'true');\n            content.hidden = false;\n        }\n    }\n}\n"],"names":["ResourcesPanel","_this","_classCallCheck","$","document","ready","tabbed","querySelector","tablist","tabs","querySelectorAll","panels","length","initListeners","key","value","_this2","this","setAttribute","Array","prototype","forEach","call","tab","i","concat","parentNode","addEventListener","e","window","innerWidth","preventDefault","currentTab","currentTarget","toggleTab","switchTab","direction","index","indexOf","which","focus","panel","id","hidden","removeAttribute","oldTab","newTab","classList","remove","oldIndex","add","find","Lazy","effect","effectTime","header","isActive","contains","content"],"sourceRoot":""}