{"version":3,"sources":["webpack:///./modules/Tooltip.ts"],"names":["__webpack_require__","r","__webpack_exports__","Tooltip","element","this","tooltipContent","querySelector","tooltipBtn","tooltipToggle","tooltipClose","setPositionOnResize","preventLink","Eucerin","isMobile","closest","setTeaserWidth","setup","selector","Array","from","document","querySelectorAll","filter","node","dataset","moduleInitialized","forEach","prototype","addEventListener","e","target","HTMLAnchorElement","preventDefault","teaser","teaserWidth","clientWidth","style","width","teaserLeft","getBoundingClientRect","left","tootlipIconLeft","leftDifference","setProperty","isDesktop","tooltipOnHover","tooltipOnClick","_this","event","stopPropagation","isOpen","classList","contains","isActive","add","setPostition","remove","closeNotActiveTooltips","toggle","findPosition","windowWidth","window","innerWidth","rectTooltip","rectTooltipContent","tooltipLeft","findPositionOnSlider","slider","sliderWidth","viewportMiddle","tooltipRight","right","parentNode"],"mappings":"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","file":"./modules/Tooltip.6a003d53.js","sourcesContent":["const moduleSelector = '[data-module=\"Tooltip\"]';\r\n\r\nexport default class Tooltip {\r\n    tooltipContent: HTMLElement;\r\n    tooltipBtn: 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 Tooltip(element);\r\n            element.dataset.moduleInitialized = 'true';\r\n        });\r\n    }\r\n\r\n    constructor(public element: HTMLElement) {\r\n        this.tooltipContent = this.element.querySelector(\".tooltip-content\");\r\n        this.tooltipBtn = this.element.querySelector(\".tooltip-info-icon\");\r\n        this.tooltipToggle();\r\n        this.tooltipClose();\r\n        this.setPositionOnResize();\r\n        this.preventLink();\r\n        Eucerin.isMobile && this.element.closest(\".teaser\") ? this.setTeaserWidth() : \"\";\r\n    }\r\n    private preventLink() {\r\n        this.element.addEventListener(\"click\", (e: Event) => {\r\n            const target = e.target as HTMLElement;\r\n            if (!(target instanceof HTMLAnchorElement)) {\r\n                e.preventDefault();\r\n            }\r\n        })\r\n    }\r\n\r\n    private setTeaserWidth() {\r\n        const teaser = this.element.closest(\".teaser a\");\r\n        const teaserWidth = teaser.clientWidth;\r\n        this.tooltipContent.style.width = (teaserWidth + 'px');\r\n        const teaserLeft = (teaser.getBoundingClientRect()).left;\r\n        const tootlipIconLeft = ((this.element.querySelector(\".tooltip-info-icon\")).getBoundingClientRect()).left;\r\n        const leftDifference = teaserLeft - tootlipIconLeft;\r\n        this.tooltipContent.style.left = (leftDifference + 'px');\r\n        this.tooltipContent.style.setProperty('--tooltipIconLeft', `${(tootlipIconLeft - teaserLeft) - 2}px`)\r\n    }\r\n\r\n    private tooltipToggle() {\r\n        this.element.closest(\".teaser\") && Eucerin.isDesktop ? this.tooltipOnHover() : this.tooltipOnClick();\r\n    }\r\n\r\n    private tooltipOnHover() {\r\n        this.element.addEventListener('mouseenter', (event) => {\r\n            event.preventDefault();\r\n            event.stopPropagation();\r\n            let isOpen = this.tooltipContent.classList.contains(\"uk-open\"),\r\n                isActive = this.element.classList.contains(\"active\");\r\n            if (!isOpen) this.tooltipContent.classList.add(\"uk-open\");\r\n            if (!isActive) this.element.classList.add(\"active\");\r\n            this.setPostition();\r\n        })\r\n\r\n        this.element.addEventListener('mouseleave', (event) => {\r\n            event.preventDefault();\r\n            event.stopPropagation();\r\n            let isOpen = this.tooltipContent.classList.contains(\"uk-open\"),\r\n                isActive = this.element.classList.contains(\"active\");\r\n            if (isOpen) this.tooltipContent.classList.remove(\"uk-open\");\r\n            if (isActive) this.element.classList.remove(\"active\");\r\n        })\r\n    }\r\n\r\n    private tooltipOnClick() {\r\n        this.tooltipBtn.addEventListener('click', (event) => {\r\n            event.preventDefault();\r\n            event.stopPropagation();\r\n            let isOpen = this.tooltipContent.classList.contains(\"uk-open\"),\r\n                isActive = this.element.classList.contains(\"active\");\r\n            this.closeNotActiveTooltips();\r\n            if (!isOpen) this.tooltipContent.classList.toggle(\"uk-open\");\r\n            if (!isActive) this.element.classList.toggle(\"active\");\r\n            this.setPostition();\r\n        })\r\n    }\r\n\r\n    findPosition() {\r\n        const windowWidth = window.innerWidth,\r\n            rectTooltip = this.element.getBoundingClientRect(),\r\n            rectTooltipContent = this.element.querySelector('.tooltip-content').getBoundingClientRect(),\r\n            tooltipLeft = rectTooltip.left,\r\n            tooltipRight = windowWidth - (tooltipLeft + ((rectTooltipContent.width) / 2));\r\n        if (tooltipRight - (rectTooltipContent.width / 2) < 0) {\r\n            return \"left\";\r\n        } else if (tooltipLeft - (rectTooltipContent.width / 2) < 0) {\r\n            return \"right\";\r\n        } else {\r\n            return \"middle\";\r\n        }\r\n    }\r\n\r\n    findPositionOnSlider() {\r\n        const slider = this.element.closest(\".tns-inner\");\r\n        const sliderWidth = slider.clientWidth,\r\n            rectTooltip = this.element.getBoundingClientRect(),\r\n            rectTooltipContent = this.element.querySelector('.tooltip-content').getBoundingClientRect(),\r\n            viewportMiddle = (slider.clientWidth / 2),\r\n            tolerance = 100,\r\n            tooltipLeft = rectTooltip.left,\r\n            tooltipRight = rectTooltip.right,\r\n            lessSpaceRight = tooltipRight >= viewportMiddle && (tooltipRight <= (viewportMiddle + tolerance)),\r\n            lessSpaceLeft = tooltipLeft <= viewportMiddle && (tooltipLeft >= (viewportMiddle - tolerance));\r\n        if (lessSpaceRight || lessSpaceLeft) {\r\n            return \"middle\";\r\n        } else if (sliderWidth - rectTooltip.left - rectTooltipContent.width < 0) {\r\n            return \"left\";\r\n        } else {\r\n            return \"right\";\r\n        }\r\n    }\r\n\r\n    setPostition() {\r\n        if (!this.element) {\r\n            return;\r\n        }\r\n        if (!this.element.classList.contains(`tooltip-price-${this.findPosition()}`)) {\r\n            this.element.classList.remove(\"tooltip-left\");\r\n            this.element.classList.remove(\"tooltip-right\");\r\n            this.element.classList.remove(\"tooltip-middle\");\r\n            if (this.element.closest(\".tns-slider\")) {\r\n                this.element.classList.toggle(`tooltip-${this.findPositionOnSlider()}`);\r\n            } else {\r\n                this.element.classList.toggle(`tooltip-${this.findPosition()}`);\r\n            }\r\n        }\r\n    }\r\n\r\n    setPositionOnResize() {\r\n        window.addEventListener(\"resize\", () => this.setPostition());\r\n    }\r\n\r\n    private tooltipClose() {\r\n        window.addEventListener(\"click\", (e: Event) => {\r\n            const target = e.target as HTMLElement;\r\n\r\n            if (target !== this.tooltipContent && target.parentNode !== this.tooltipContent && this.tooltipContent.classList.contains(\"uk-open\")) {\r\n                e.stopPropagation();\r\n                this.closeNotActiveTooltips();\r\n            }\r\n        })\r\n    }\r\n\r\n    closeNotActiveTooltips() {\r\n        document.querySelectorAll(\".tooltip-content\").forEach((element) => {\r\n            element.classList.remove(\"uk-open\");\r\n            element.closest(\".tootlip-price\") && element.closest(\".tootlip-price\").classList.remove(\"active\");\r\n        })\r\n    }\r\n}\r\n\r\nnew Tooltip.setup();"],"sourceRoot":""}