{"version":3,"file":"./modules/Expander.xxxxxxxx.js","mappings":"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","sources":["webpack:///./modules/Expandable.ts","webpack:///./modules/Expander/index.ts","webpack:///./modules/Expander/ExpanderWithT.ts","webpack:///./modules/Expander/Expander.ts"],"sourcesContent":["import { getOptions, requestAnimationFrameTimer } from '../helpers/helperFunctions';\r\n\r\nexport default class Expandable {\r\n private height: number;\r\n private active: boolean;\r\n\r\n constructor(private container: HTMLElement, private options: ExpandableOptions = {}) {\r\n this.active = this.container.className.includes('active');\r\n this.options = getOptions(this.container, Object.assign(this.getDefaultOptions(), this.options));\r\n this.init();\r\n }\r\n\r\n private init(): Expandable {\r\n this.setElementHeight(this.container, this.getSuitableHeight());\r\n this.setOnResizeHandler();\r\n return this;\r\n }\r\n\r\n private saveInitialHeight(): Expandable {\r\n this.height = this.getElementHeight(this.container);\r\n return this;\r\n }\r\n\r\n private getElementHeight(element: HTMLElement): number {\r\n return element.offsetHeight;\r\n }\r\n\r\n private getSuitableHeight(): string {\r\n return this.active ? '' : this.options.collapsedHeight + 'px';\r\n }\r\n\r\n private setElementHeight(element: HTMLElement, height?: string): Expandable {\r\n element.style.maxHeight = height != null ? height : ''; \r\n\r\n return this;\r\n }\r\n\r\n private toggleState(): Expandable {\r\n this.active = !this.active;\r\n return this;\r\n }\r\n\r\n private getDefaultOptions(): ExpandableOptions {\r\n return {\r\n collapsedHeight: 115\r\n };\r\n }\r\n\r\n private setOnResizeHandler(): Expandable {\r\n NiveaX.addToEventStore('resize', () => requestAnimationFrameTimer(() => this.onResize(), 300), window)\r\n\r\n return this;\r\n }\r\n\r\n private onResize() {\r\n const height = this.getSuitableHeight();\r\n this.setElementHeight(this.container, height);\r\n }\r\n\r\n setCollapsedHeight(value: number): Expandable {\r\n this.options.collapsedHeight = value;\r\n return this;\r\n }\r\n\r\n toggle(): Expandable {\r\n this.toggleState()\r\n .setElementHeight(this.container, this.getSuitableHeight());\r\n return this;\r\n }\r\n\r\n isActive(): boolean {\r\n return this.active;\r\n }\r\n \r\n needToBeShown(): boolean {\r\n return this.height > this.options.collapsedHeight * 1.25;\r\n }\r\n\r\n\r\n clear(): Expandable {\r\n this.setElementHeight(this.container)\r\n .saveInitialHeight();\r\n return this;\r\n }\r\n\r\n render(): Expandable {\r\n const height = this.getSuitableHeight();\r\n this.setElementHeight(this.container, height);\r\n\r\n return this;\r\n }\r\n\r\n getContainer(): HTMLElement {\r\n return this.container;\r\n }\r\n}","import ExpanderWithT from './ExpanderWithT';\r\nexport default ExpanderWithT;","/// \r\nimport Expander from \"./Expander\";\r\nimport ClassWithTracking from \"../../ClassWithTracking\";\r\n\r\nexport default class ExpanderWithT extends ClassWithTracking(Expander) {\r\n trackingEvent(trackedElement: HTMLElement, isClicked: boolean) {\r\n if (window.NiveaX.deviceType.isDesktop) { \r\n return;\r\n }\r\n\r\n if (!isClicked || !!trackedElement.closest(\".nx-filter-layer\")) {\r\n return;\r\n }\r\n\r\n let buttonType: string = \"Tap minus\",\r\n isActive: boolean = false,\r\n titleContent: string = \"\";\r\n\r\n if (trackedElement.className.search(\"active\") > 0) {\r\n isActive = true;\r\n }\r\n\r\n titleContent = this.setLabel(trackedElement);\r\n\r\n if (document.body.classList.contains(\"nx-pagetype-product\")) {\r\n this.trackPDPSection(trackedElement, buttonType, titleContent);\r\n } else {\r\n this.preventMultipleClicks(isActive, titleContent);\r\n }\r\n\r\n return this;\r\n }\r\n\r\n private setLabel(trackedElement: HTMLElement): string {\r\n let toggleTitleH2: HTMLElement = trackedElement.querySelector(\"h2\"),\r\n toggleTitleH3: HTMLElement = trackedElement.querySelector(\"h3\");\r\n\r\n if (toggleTitleH2) {\r\n return toggleTitleH2.innerText;\r\n } else if (toggleTitleH3) {\r\n return toggleTitleH3.innerText;\r\n }\r\n }\r\n\r\n private trackPDPSection(trackedElement: HTMLElement, buttonType: string, titleContent: string): void {\r\n if (trackedElement.className.search(\"active\") > 0) {\r\n buttonType = \"Tap plus\";\r\n }\r\n this.trackPDPSections(\"Product Detail Page\", buttonType, titleContent);\r\n }\r\n\r\n private preventMultipleClicks(isActive, titleContent): void {\r\n if (isActive) {\r\n if (!this.element.classList.contains(\"nx-trigger-once\")) {\r\n this.trackElementClick(titleContent);\r\n this.element.classList.add(\"nx-trigger-once\");\r\n }\r\n\r\n setTimeout(() => {\r\n this.element.classList.remove(\"nx-trigger-once\");\r\n }, 100);\r\n }\r\n }\r\n\r\n private trackElementClick(eventLabel: string) {\r\n if (window.NiveaX.IsUAEnabled) {\r\n this.dataLayer.push({\r\n event: \"ga_event\",\r\n eventCategory: \"Expand Content\",\r\n eventAction: \"Tap Button\",\r\n eventLabel: eventLabel,\r\n eventNonInteraction: false\r\n });\r\n }\r\n }\r\n\r\n private trackPDPSections(eventCategory: string, eventAction: string, eventLabel: string) {\r\n if (window.NiveaX.IsUAEnabled) {\r\n this.dataLayer.push({\r\n event: \"ga_event\",\r\n eventCategory: eventCategory,\r\n eventAction: eventAction,\r\n eventLabel: eventLabel,\r\n eventNonInteraction: false\r\n });\r\n }\r\n }\r\n\r\n protected toggleExpander(clickedEvent: boolean = true): void {\r\n super.toggleExpander(clickedEvent);\r\n this.trackingEvent(this.element, clickedEvent);\r\n console.log(this.expanderState);\r\n // console.log(this.element, clickedEvent);\r\n }\r\n}\r\n","import Expandable from '../Expandable';\r\nimport { getOptions, requestAnimationFrameTimer } from '../../helpers/helperFunctions';\r\n\r\nconst moduleSelector = '[data-module=\"Expander\"]';\r\n\r\nexport default class Expander {\r\n private container: HTMLElement;\r\n private button: HTMLElement;\r\n private expandable: Expandable;\r\n public expanderState: string;\r\n \r\n static setup(selector: string = moduleSelector): void {\r\n Array.from(document.querySelectorAll(selector)).filter((node: HTMLElement) => !node.dataset.moduleInitialized).forEach((element: HTMLElement) => {\r\n new Expander(element);\r\n element.dataset.moduleInitialized = 'true';\r\n });\r\n }\r\n\r\n constructor(public element: HTMLElement, private options: ExpanderOptions = {}) {\r\n this.options = getOptions(this.element, Object.assign(this.getDefaultOptions(), this.options));\r\n this.container = this.element.querySelector(`.${this.options.containerSelector}`) || this.element;\r\n this.button = this.element.querySelector(`.${this.options.buttonSelector}`);\r\n this.expandable = new Expandable(this.container, this.options.expandableOptions);\r\n \r\n this.init();\r\n }\r\n\r\n protected init(): Expander {\r\n this.showExpanderButton()\r\n .setButtonEventHandler()\r\n .setOnResizeHandler()\r\n .adjustAppearance()\r\n .applyActiveFromOptions()\r\n .applyContentAlignmentFromOptions();\r\n\r\n return this;\r\n }\r\n\r\n protected showExpanderButton(): Expander {\r\n this.button.hidden = false;\r\n return this;\r\n }\r\n\r\n protected setButtonEventHandler(): Expander {\r\n this.button.addEventListener('click', this.toggleExpander.bind(this));\r\n return this;\r\n }\r\n\r\n protected toggleActiveModifier(force?: boolean): Expander {\r\n (force)\r\n ? this.element.classList.add(`${this.options.elementSelector}--active`)\r\n : this.element.classList.remove(`${this.options.elementSelector}--active`);\r\n \r\n return this;\r\n }\r\n \r\n protected showFade(force?: boolean): Expander {\r\n (force)\r\n ? this.options.hasFade && this.container.classList.add(`${this.options.containerSelector}--with-fade`)\r\n : this.options.hasFade && this.container.classList.remove(`${this.options.containerSelector}--with-fade`);\r\n\r\n return this;\r\n }\r\n\r\n protected toggleExpander(clickedEvent:boolean = true): void {\r\n this.expandable.toggle();\r\n this.toggleActiveModifier(this.expandable.isActive());\r\n this.expanderState = this.expandable.isActive() ? 'Expanded' : 'Collapsed';\r\n }\r\n\r\n protected onResize(): void {\r\n this.options.beforeResize();\r\n \r\n if( this.options.isActive ) {\r\n this.adjustAppearance();\r\n }\r\n }\r\n\r\n protected applyActiveFromOptions() {\r\n if( this.options.isActive ) {\r\n this.toggleExpander(false);\r\n }\r\n return this;\r\n }\r\n\r\n protected applyContentAlignmentFromOptions() {\r\n if(this.options.contentAlignment) {\r\n this.container.classList.add(`${this.options.containerSelector}--align-` + this.options.contentAlignment);\r\n }\r\n return this;\r\n }\r\n\r\n protected setOnResizeHandler(): Expander {\r\n NiveaX.addToEventStore('resize', () => requestAnimationFrameTimer(() => this.onResize(), 300), window);\r\n return this;\r\n }\r\n\r\n protected setupExpander(): Expander {\r\n this.expandable.render();\r\n\r\n this.showFade(true)\r\n .hideButton(false);\r\n\r\n return this;\r\n }\r\n\r\n protected destroyExpander(): Expander {\r\n this.expandable.clear();\r\n\r\n this.showFade(false)\r\n .hideButton(true);\r\n\r\n return this;\r\n }\r\n\r\n public hideButton(value: boolean): Expander {\r\n this.button.hidden = value;\r\n return this;\r\n }\r\n\r\n protected getDefaultOptions(): ExpanderOptions {\r\n return {\r\n elementSelector: 'nx-expander',\r\n containerSelector: 'nx-expander__content',\r\n buttonSelector: 'nx-expander__button',\r\n hasFade: true,\r\n beforeResize: () => {}\r\n };\r\n }\r\n\r\n adjustAppearance(): Expander {\r\n this.expandable.clear();\r\n \r\n this.expandable.needToBeShown()\r\n ? this.setupExpander()\r\n : this.destroyExpander();\r\n\r\n return this;\r\n }\r\n\r\n setCollapsedHeight(value: number): Expander {\r\n this.expandable.setCollapsedHeight(value);\r\n return this;\r\n }\r\n\r\n setBeforResizeCB(cb: Callback): Expander {\r\n this.options.beforeResize = cb;\r\n return this;\r\n }\r\n\r\n isActive(): boolean {\r\n return this.expandable.isActive();\r\n }\r\n\r\n toggle(): Expander {\r\n this.toggleExpander();\r\n return this;\r\n }\r\n}\r\n\r\n// Hot Module Replacement\r\nif (module.hot) {\r\n let nodesCache: HMRNodes[] = Array.from(document.querySelectorAll(moduleSelector)).map((element: Node) => ({ nodeToReplace: element, nodeOrigin: element.cloneNode(true) }));\r\n\r\n Expander.setup(moduleSelector);\r\n\r\n module.hot.accept(() => {\r\n Expander.setup(moduleSelector);\r\n });\r\n module.hot.dispose(() => {\r\n nodesCache.forEach(({nodeToReplace, nodeOrigin}) => { nodeToReplace = nodeToReplace.parentElement.replaceChild(nodeOrigin.cloneNode(true), nodeToReplace)});\r\n });\r\n} else {\r\n Expander.setup(moduleSelector);\r\n}"],"names":["Expandable","constructor","container","options","this","active","className","includes","Object","assign","getDefaultOptions","init","setElementHeight","getSuitableHeight","setOnResizeHandler","saveInitialHeight","height","getElementHeight","element","offsetHeight","collapsedHeight","style","maxHeight","toggleState","NiveaX","addToEventStore","onResize","window","setCollapsedHeight","value","toggle","isActive","needToBeShown","clear","render","getContainer","ExpanderWithT","trackingEvent","trackedElement","isClicked","deviceType","isDesktop","closest","titleContent","search","setLabel","document","body","classList","contains","trackPDPSection","preventMultipleClicks","toggleTitleH2","querySelector","toggleTitleH3","innerText","buttonType","trackPDPSections","trackElementClick","add","setTimeout","remove","eventLabel","IsUAEnabled","dataLayer","push","event","eventCategory","eventAction","eventNonInteraction","toggleExpander","clickedEvent","super","console","log","expanderState","moduleSelector","Expander","setup","selector","Array","from","querySelectorAll","filter","node","dataset","moduleInitialized","forEach","containerSelector","button","buttonSelector","expandable","expandableOptions","showExpanderButton","setButtonEventHandler","adjustAppearance","applyActiveFromOptions","applyContentAlignmentFromOptions","hidden","addEventListener","bind","toggleActiveModifier","force","elementSelector","showFade","hasFade","beforeResize","contentAlignment","setupExpander","hideButton","destroyExpander","setBeforResizeCB","cb"],"sourceRoot":""}