{"version":3,"file":"./modules/BenefitScrollBar.xxxxxxxx.js","mappings":"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","sources":["webpack:///./modules/BenefitScrollBar.ts","webpack:///./modules/ScrollBar.ts"],"sourcesContent":["import ScrollBar from './ScrollBar';\r\n\r\nconst moduleSelector = '[data-module=\"BenefitScrollBar\"]';\r\n\r\nexport default class BenefitScrollBar {\r\n private scrollBarNode: 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 BenefitScrollBar(element);\r\n element.dataset.moduleInitialized = 'true';\r\n });\r\n }\r\n\r\n constructor(public element: HTMLElement) {\r\n this.scrollBarNode = this.element.getElementsByClassName('nx-benefits__scrollbar')[0];\r\n this.init();\r\n }\r\n\r\n private init(): void {\r\n new ScrollBar(this.scrollBarNode);\r\n window.onresize = () => this.addEvent();\r\n }\r\n\r\n private refreshScrollBar(): void {\r\n const scLf = this.scrollBarNode.scrollLeft;\r\n this.scrollBarNode.scrollLeft = scLf + 1;\r\n this.scrollBarNode.scrollLeft = scLf;\r\n }\r\n\r\n // to remove\r\n addEvent() {\r\n window.onresize = () => {\r\n this.refreshScrollBar();\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 BenefitScrollBar.setup(moduleSelector);\r\n\r\n module.hot.accept(() => {\r\n BenefitScrollBar.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 BenefitScrollBar.setup(moduleSelector);\r\n}","import PerfectScrollbar from 'perfect-scrollbar';\r\nimport { getOptions } from '../helpers/helperFunctions';\r\n\r\nconst moduleSelector = '[data-module=\"ScrollBar\"]';\r\n\r\nexport default class ScrollBar {\r\n psb: PerfectScrollbar;\r\n list: HTMLElement;\r\n fadeSide: FadeSide;\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 ScrollBar(element);\r\n element.dataset.moduleInitialized = 'true';\r\n });\r\n }\r\n\r\n constructor(public element: HTMLElement, private options: PSBOptions = {}) {\r\n this.options = getOptions(this.element, Object.assign(this.getDefaultOptions(), this.options));\r\n this.list = this.element.querySelector(`.${this.options.sbListSelector}`);\r\n\r\n this.init();\r\n }\r\n\r\n private init(): ScrollBar {\r\n this.psb = new PerfectScrollbar(this.element, this.options);\r\n this.onPageLoaded()\r\n .onResize();\r\n\r\n return this;\r\n }\r\n\r\n private initFadeSide(): ScrollBar {\r\n this.fadeSide = new FadeSide(this.element, this.options.fadeWidth);\r\n return this;\r\n }\r\n\r\n public updateScrollBar(): ScrollBar {\r\n // REVISIT\r\n if (!!this.element.closest('.nx-advantages')) {\r\n this.adjustScrollBarListWidth();\r\n }\r\n \r\n this.psb && this.psb.update();\r\n return this;\r\n }\r\n\r\n private getScrollBarListWidth(): number {\r\n const benefitItem = this.list.querySelector(`.${this.options.sbListItem}`);\r\n const benefitItemsLength = this.list.querySelectorAll(`.${this.options.sbListItem}`).length;\r\n\r\n return Math.ceil((benefitItemsLength * benefitItem.offsetWidth) + 1);\r\n }\r\n\r\n private adjustScrollBarListWidth(): ScrollBar {\r\n this.clearScrollBarListWidth();\r\n this.list.style.width = this.getScrollBarListWidth() + 'px';\r\n return this;\r\n }\r\n\r\n private clearScrollBarListWidth(): ScrollBar {\r\n this.list.style.width = '';\r\n return this;\r\n }\r\n\r\n private initScrollBarAfterPageLoaded(): ScrollBar {\r\n this.updateScrollBar();\r\n\r\n if (this.options.fadeSide) {\r\n this.initFadeSide();\r\n }\r\n\r\n return this;\r\n }\r\n\r\n private onResize(): ScrollBar {\r\n NiveaX.addToEventStore('resize', this.updateScrollBar.bind(this), window);\r\n return this;\r\n }\r\n\r\n private onPageLoaded(): ScrollBar {\r\n if (document.readyState === 'complete') {\r\n this.initScrollBarAfterPageLoaded();\r\n } else {\r\n NiveaX.addToEventStore('load', this.initScrollBarAfterPageLoaded.bind(this), window);\r\n }\r\n\r\n return this;\r\n }\r\n\r\n private getDefaultOptions(): PSBOptions {\r\n return {\r\n fadeSide: true,\r\n suppressScrollY: true,\r\n sbListSelector: 'nx-benefits__list',\r\n fadeWidth: null,\r\n sbListItem: 'nx-benefit',\r\n useBothWheelAxes: true,\r\n swipeEasing: true\r\n }\r\n }\r\n\r\n destroy(): ScrollBar {\r\n this.psb?.destroy();\r\n this.psb = null;\r\n // this.clearScrollBarListWidth();\r\n return this;\r\n }\r\n\r\n rebuild(): ScrollBar {\r\n this.psb = new PerfectScrollbar(this.element, this.options);\r\n this.updateScrollBar();\r\n return this;\r\n }\r\n}\r\n\r\nclass FadeSide {\r\n private fadeWidth: number;\r\n leftMaskWidth: number = 0;\r\n rightMaskWidth: number = 0;\r\n\r\n constructor(public element: HTMLElement, fadeWidth?: number) {\r\n this.fadeWidth = fadeWidth || this.getFadeWidth();\r\n this.leftMaskWidth = this.fadeWidth;\r\n this.rightMaskWidth = this.fadeWidth;\r\n\r\n this.init();\r\n }\r\n\r\n private init(): void {\r\n this.adjustFadeElements();\r\n this.element.addEventListener('ps-scroll-x', () => {\r\n this.adjustFadeElements()\r\n });\r\n }\r\n\r\n public adjustFadeElements(): void {\r\n let scrollWidth = this.element.scrollWidth,\r\n scrollLeft = Math.abs(this.element.scrollLeft),\r\n scrollRight = Math.abs(scrollWidth - (scrollLeft + this.element.clientWidth)),\r\n fdLeftWidth, fdRightWidth;\r\n\r\n if (scrollLeft <= this.fadeWidth) {\r\n fdLeftWidth = (scrollLeft / this.fadeWidth) * (this.fadeWidth);\r\n }\r\n\r\n if (scrollRight <= this.fadeWidth) {\r\n fdRightWidth = (scrollRight / this.fadeWidth) * (this.fadeWidth);\r\n }\r\n\r\n if(fdLeftWidth == undefined && fdRightWidth == undefined) {\r\n fdLeftWidth = this.fadeWidth;\r\n fdRightWidth = this.fadeWidth;\r\n }\r\n\r\n let leftWidth = (document.dir == 'ltr') ? fdLeftWidth : fdRightWidth;\r\n let rightWidth = (document.dir == 'ltr') ? fdRightWidth : fdLeftWidth;\r\n\r\n this.leftMaskWidth = leftWidth != undefined ? leftWidth : this.leftMaskWidth;\r\n this.rightMaskWidth = rightWidth != undefined ? rightWidth : this.rightMaskWidth;\r\n\r\n this.element.setAttribute('style', `-webkit-mask-image: linear-gradient(to right, transparent 0px, black ${this.leftMaskWidth}px), linear-gradient(to left, transparent 0px, black ${this.rightMaskWidth}px);\r\n mask-image: linear-gradient(to right, transparent 0px, black ${this.leftMaskWidth}px), linear-gradient(to left, transparent 0px, black ${this.rightMaskWidth}px);`)\r\n\r\n }\r\n\r\n public setFadeWith(fadeWidth: number) {\r\n this.fadeWidth = fadeWidth;\r\n }\r\n\r\n private getFadeWidth(): number {\r\n return this.element.querySelector('.nx-benefit')?.clientWidth;\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 ScrollBar.setup(moduleSelector);\r\n\r\n module.hot.accept(() => {\r\n ScrollBar.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 ScrollBar.setup(moduleSelector);\r\n}"],"names":["moduleSelector","BenefitScrollBar","setup","selector","Array","from","document","querySelectorAll","filter","node","dataset","moduleInitialized","forEach","element","constructor","this","scrollBarNode","getElementsByClassName","init","window","onresize","addEvent","refreshScrollBar","scLf","scrollLeft","ScrollBar","options","Object","assign","getDefaultOptions","list","querySelector","sbListSelector","psb","onPageLoaded","onResize","initFadeSide","fadeSide","FadeSide","fadeWidth","updateScrollBar","closest","adjustScrollBarListWidth","update","getScrollBarListWidth","benefitItem","sbListItem","benefitItemsLength","length","Math","ceil","offsetWidth","clearScrollBarListWidth","style","width","initScrollBarAfterPageLoaded","NiveaX","addToEventStore","bind","readyState","suppressScrollY","useBothWheelAxes","swipeEasing","destroy","rebuild","leftMaskWidth","rightMaskWidth","getFadeWidth","adjustFadeElements","addEventListener","fdLeftWidth","fdRightWidth","scrollWidth","abs","scrollRight","clientWidth","undefined","leftWidth","dir","rightWidth","setAttribute","setFadeWith"],"sourceRoot":""}