{"version":3,"file":"./modules/Parallax-Parallax.xxxxxxxx.js","mappings":"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","sources":["webpack:///./modules/Parallax/Parallax.ts"],"sourcesContent":["import { addClass, removeClass } from \"../../helpers/DOMHelpers\";\r\n\r\nconst moduleSelector = '[data-module=\"Parallax\"]';\r\n\r\nexport default class Parallax {\r\n    private desktopNavElement: Element;\r\n    private mobileBurgerNavElement: Element;\r\n    private breadcrumbElement: Element;\r\n    private stage: HTMLElement;\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 Parallax(element);\r\n            element.dataset.moduleInitialized = 'true';\r\n        });\r\n    }\r\n\r\n    constructor(public element: HTMLElement) {\r\n        const contentZones = Array.from(this.element.querySelectorAll('.nx-content-zone-container'));\r\n        this.getHeaderElements();\r\n        this.initParallax(contentZones[0] as HTMLElement, contentZones[1] as HTMLElement);\r\n    }\r\n    \r\n    private getHeaderElements() {\r\n        this.desktopNavElement = document.querySelector('.nx-nav-desktop__wrapper');\r\n        this.mobileBurgerNavElement = document.querySelector('.nx-mob-burger-nav__wrapper');\r\n        this.breadcrumbElement = document.querySelector('.nx-breadcrumb');\r\n    }\r\n\r\n    private initParallax(contentZone1: HTMLElement, contentZone2: HTMLElement) {\r\n        this.stage = this.element.querySelector('.nx-stage');\r\n        this.addParallaxEffectToStage();\r\n        this.addParallaxEffectToContentZones(contentZone1, contentZone2);\r\n        window.addEventListener('scroll', (e) => this.onScroll(e, contentZone1, contentZone2))\r\n    }\r\n        \r\n    private onScroll(e: Event, contentZone1: HTMLElement, contentZone2: HTMLElement) {\r\n        const headerHeight = this.getHeaderHeight();\r\n        this.stage ? this.stage.style.top = `${headerHeight}px` : \"\";\r\n        if(!contentZone1) return;\r\n            contentZone1.style.top = `${headerHeight}px`;\r\n\r\n        const zone1Height = contentZone1?.getBoundingClientRect().height,\r\n          isHeightLargerViewport = window.innerHeight < zone1Height,\r\n          isStickyOnTop = contentZone1?.getBoundingClientRect().top <= headerHeight;\r\n        \r\n        if(isStickyOnTop && isHeightLargerViewport) {\r\n            contentZone1.style.top =  -(zone1Height - window.innerHeight) + 'px';\r\n        }\r\n\r\n        const zone1Offset = this.getZone1Offset(contentZone1, headerHeight);\r\n        const zone2Offset = contentZone2?.offsetTop;\r\n        this.updateContentZones(zone1Offset, zone2Offset, contentZone1, contentZone2);\r\n    }\r\n\r\n\r\n    private addParallaxEffectToContentZones(zone1: HTMLElement, zone2: HTMLElement) {\r\n        zone1 ? addClass(zone1, 'nx-parallax-container--first') : \"\";\r\n        zone2 ? addClass(zone2, 'nx-parallax-container--second') : \"\";\r\n    }\r\n\r\n    private addParallaxEffectToStage(): void {\r\n        this.stage ? addClass(this.stage, 'nx-parallax-container--stage') : \"\";\r\n    }\r\n\r\n    private getZone1Offset(contentZone1: HTMLElement, headerHeight: number): number {\r\n        return contentZone1.offsetTop - headerHeight;\r\n    }\r\n\r\n    private getHeaderHeight(): number {\r\n        let height: number = 0;\r\n        height += this.getCurrentNavigationHeight();\r\n        height += this.getCurrentBreadcrumbHeight();\r\n\r\n        return height;\r\n    }\r\n\r\n    private getCurrentBreadcrumbHeight() {\r\n        let height = 0;\r\n        const breadcrumbStyle = getComputedStyle(this.breadcrumbElement);\r\n        if (this.breadcrumbElement && breadcrumbStyle.maxHeight) {\r\n            height = parseInt(breadcrumbStyle.height);  // if visible the breadcrumb always has a max-height\r\n        }\r\n\r\n        return height;\r\n    }\r\n\r\n    private getCurrentNavigationHeight() {\r\n        let height = 0;\r\n        if (!window.NiveaX.deviceType.isDesktop && this.mobileBurgerNavElement) {\r\n            height += this.mobileBurgerNavElement.clientHeight;\r\n        } else if (this.desktopNavElement && this.isDesktopNaviVisibleInViewport()) {\r\n            height += this.desktopNavElement.clientHeight;\r\n        }\r\n\r\n        return height;\r\n    }\r\n\r\n    private updateContentZones(zone1Offset: number, zone2Offset: number, contentZone1: HTMLElement, contentZone2: HTMLElement) {\r\n        const scrollY = window.scrollY;\r\n        \r\n        if (scrollY >= zone1Offset && scrollY < zone2Offset) {\r\n            this.addParallaxEffectToContentZones(contentZone1, contentZone2);\r\n        } else if (scrollY >= zone2Offset) {\r\n            this.removeParallaxEffectFromContentZones(contentZone1, contentZone2);\r\n        }\r\n    }\r\n\r\n    private removeParallaxEffectFromContentZones(zone1: HTMLElement, zone2: HTMLElement) {\r\n        removeClass(zone1, 'parallax-container--first');\r\n        removeClass(zone2, 'parallax-container--second');\r\n    }\r\n\r\n    private isDesktopNaviVisibleInViewport(): boolean {\r\n        if (!this.desktopNavElement) return false;\r\n\r\n        const rect = this.desktopNavElement.getBoundingClientRect();\r\n        return (\r\n            rect.top >= 0 &&\r\n            rect.left >= 0 &&\r\n            rect.bottom <= (window.innerHeight || document.documentElement.clientHeight) &&\r\n            rect.right <= (window.innerWidth || document.documentElement.clientWidth)\r\n        );\r\n    }\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    Parallax.setup(moduleSelector);\r\n\r\n    module.hot.accept(() => {\r\n        Parallax.setup(moduleSelector);\r\n    });\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    Parallax.setup(moduleSelector);\r\n}"],"names":["moduleSelector","Parallax","setup","selector","Array","from","document","querySelectorAll","filter","node","dataset","moduleInitialized","forEach","element","constructor","contentZones","this","getHeaderElements","initParallax","desktopNavElement","querySelector","mobileBurgerNavElement","breadcrumbElement","contentZone1","contentZone2","stage","addParallaxEffectToStage","addParallaxEffectToContentZones","window","addEventListener","e","onScroll","headerHeight","getHeaderHeight","style","top","zone1Height","getBoundingClientRect","height","isHeightLargerViewport","innerHeight","zone1Offset","getZone1Offset","zone2Offset","offsetTop","updateContentZones","zone1","zone2","getCurrentNavigationHeight","getCurrentBreadcrumbHeight","breadcrumbStyle","getComputedStyle","maxHeight","parseInt","NiveaX","deviceType","isDesktop","clientHeight","isDesktopNaviVisibleInViewport","scrollY","removeParallaxEffectFromContentZones","rect","left","bottom","documentElement","right","innerWidth","clientWidth"],"sourceRoot":""}