{"version":3,"file":"./modules/TeaserScrollSlider.xxxxxxxx.js","mappings":"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","sources":["webpack:///./modules/TeaserScrollSlider/TeaserScrollSlider.ts","webpack:///./modules/TeaserScrollSlider/TeaserScrollSliderWithT.ts","webpack:///./modules/TeaserScrollSlider/index.ts"],"sourcesContent":["// import { getOptions } from '../../helpers/helperFunctions';\r\nimport { Swiper } from 'swiper';\r\nimport { Scrollbar, Mousewheel } from 'swiper/modules';\r\nimport { addClass, createDiv, removeClass, removeClasses } from '../../helpers/DOMHelpers';\r\nimport { SwiperOptions } from 'swiper/types'; \r\n\r\nconst moduleSelector = '[data-module=\"TeaserScrollSlider\"]';\r\n\r\nexport default class TeaserScrollSlider {\r\n slider: Swiper;\r\n sliderWrapperHorizontal: HTMLElement;\r\n sliderWrapperVertical: HTMLElement;\r\n productItems: 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 TeaserScrollSlider(element);\r\n element.dataset.moduleInitialized = 'true';\r\n });\r\n }\r\n\r\n constructor(public element: HTMLElement) {\r\n this.init()\r\n }\r\n\r\n init() {\r\n this.sliderWrapperHorizontal = this.element.querySelector('.nx-product-stage__grid--horizontal');\r\n this.sliderWrapperVertical = this.element.querySelector('.nx-product-stage__grid--vertical');\r\n this.productItems = Array.from(this.element.querySelectorAll('.nx-product-stage__grid--item'));\r\n\r\n\r\n if (this.sliderWrapperVertical) {\r\n this.initProductStageVertical();\r\n }\r\n\r\n if (this.sliderWrapperHorizontal) {\r\n this.initProductStageHorizontal();\r\n }\r\n }\r\n\r\n private initProductStageVertical(): void {\r\n const swiper = this.element.querySelector('.swiper') as HTMLElement;\r\n \r\n document.addEventListener('niveax:breakpointchange', (e) => {\r\n const deviceType = (e).detail.deviceType;\r\n console.log(deviceType);\r\n\r\n if (deviceType === \"isMobile\" || deviceType === \"isTablet\") {\r\n this.destroySlider();\r\n this.slider = new Swiper(swiper, this.getSwiperOptions());\r\n }\r\n else {\r\n this.destroySlider();\r\n }\r\n });\r\n\r\n if (window.NiveaX.deviceType.isDesktop) {\r\n removeClasses(this.element, ...['nx-u-spinner', 'nx-u-spinner--medium']);\r\n return;\r\n }\r\n\r\n if (!window.NiveaX.deviceType.isDesktop) {\r\n this.slider = new Swiper(swiper, this.getSwiperOptions())\r\n }\r\n }\r\n\r\n private initProductStageHorizontal() {\r\n const swiper = this.element.querySelector('.swiper') as HTMLElement;\r\n\r\n if (window.NiveaX.deviceType.isDesktop) {\r\n this.sliderWrapperHorizontal.innerHTML = \"\";\r\n this.sliderWrapperHorizontal.append(...this.getDesktopMarkup());\r\n }\r\n\r\n if (window.NiveaX.deviceType.isMobile || window.NiveaX.deviceType.isTablet) {\r\n this.productItems.forEach(item => addClass(item, 'swiper-slide'))\r\n }\r\n\r\n this.slider = new Swiper(swiper, this.getSwiperOptions());\r\n\r\n document.addEventListener('niveax:breakpointchange', (e) => {\r\n const deviceType = (e).detail.deviceType;\r\n console.log(window.NiveaX.deviceType);\r\n\r\n if (deviceType == \"isMobile\" || deviceType == \"isTablet\") {\r\n this.destroySlider();\r\n this.updateMarkup(this.getMobileMarkup());\r\n this.slider = new Swiper(swiper, this.getSwiperOptions());\r\n }\r\n else {\r\n this.destroySlider();\r\n this.updateMarkup(this.getDesktopMarkup());\r\n this.productItems.forEach(item => removeClass(item, 'swiper-slide'));\r\n this.slider = new Swiper(swiper, this.getSwiperOptions());\r\n }\r\n });\r\n }\r\n\r\n private getDesktopMarkup(): HTMLElement[] {\r\n const items = [...this.productItems],\r\n slidesNeeded = Math.round(this.productItems.length / 2);\r\n\r\n const slides = Array.from({ length: slidesNeeded }).map((_, i) => {\r\n const index = i == 0 ? i = 1 : i = 2,\r\n productItem = items.splice(0, index),\r\n slide = createDiv('swiper-slide')\r\n slide.append(...productItem);\r\n\r\n return slide\r\n });\r\n\r\n return slides\r\n }\r\n\r\n private getMobileMarkup(): HTMLElement[] {\r\n const slides = [...this.productItems];\r\n slides.forEach(item => addClass(item, 'swiper-slide'));\r\n\r\n return slides\r\n }\r\n\r\n private getSwiperOptions(): SwiperOptions {\r\n return {\r\n modules: [Scrollbar, Mousewheel],\r\n slidesPerView: \"auto\",\r\n lazyPreloadPrevNext: 2,\r\n spaceBetween: 8,\r\n direction: 'horizontal',\r\n on: {\r\n init: () => {\r\n removeClasses(this.element, ...['nx-u-spinner', 'nx-u-spinner--medium'])\r\n },\r\n },\r\n scrollbar: {\r\n el: '.swiper-scrollbar',\r\n hide: false,\r\n draggable: true,\r\n snapOnRelease: true,\r\n dragSize: 'auto',\r\n },\r\n mousewheel: {\r\n enabled: true,\r\n sensitivity: 4,\r\n },\r\n breakpoints: {\r\n 320: {\r\n autoHeight: true,\r\n },\r\n 1024: {\r\n spaceBetween: 16,\r\n autoHeight: false,\r\n },\r\n }\r\n }\r\n }\r\n\r\n private updateMarkup(slidesMarkup: HTMLElement[]): void {\r\n this.sliderWrapperHorizontal.innerHTML = \"\";\r\n this.sliderWrapperHorizontal.append(...slidesMarkup);\r\n }\r\n\r\n private destroySlider() {\r\n this.slider?.destroy(true, true);\r\n }\r\n}\r\n\r\n// // Hot Module Replacement\r\n// if (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// TeaserScrollSlider.setup(moduleSelector);\r\n\r\n// module.hot.accept(() => {\r\n// TeaserScrollSlider.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// TeaserScrollSlider.setup(moduleSelector);\r\n// }\r\n","// import { getOptions } from '../../helpers/helperFunctions';\r\nimport { Swiper } from 'swiper';\r\nimport ClassWithTracking from '../../ClassWithTracking';\r\nimport TeaserScrollSlider from './TeaserScrollSlider';\r\nimport { addLayer } from '../../ClassWithTracking/helpers';\r\nimport { parseJSONSafe } from '../../helpers/helperFunctions';\r\n\r\nconst moduleSelector = '[data-module=\"TeaserScrollSlider\"]';\r\n\r\nexport default class TeaserScrollSliderWithT extends ClassWithTracking(TeaserScrollSlider) {\r\n slider: Swiper;\r\n trackingData: TrackingData[];\r\n eventParams: { photo_size?: string; navigation?: 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 TeaserScrollSliderWithT(element);\r\n element.dataset.moduleInitialized = 'true';\r\n });\r\n }\r\n\r\n constructor(public element: HTMLElement) {\r\n super(element); \r\n this.eventParams = {\r\n photo_size: '[[GalleryAndSliderIneraction|{{media_size}}]]',\r\n\t\t\tnavigation: '[[GalleryAndSliderIneraction|{{event_type}}]]',\r\n }\r\n\r\n this.initTracking();\r\n \r\n document.addEventListener('niveax:breakpointchange', () => {\r\n this.initTracking();\r\n })\r\n }\r\n\r\n private initTracking(): void {\r\n this.trackingData = parseJSONSafe(this.element.dataset.tdata);\r\n\r\n if (!this.trackingData || !this.trackingData.length) {\r\n return;\r\n }\r\n\r\n if (this.slider && window.NiveaX.IsGA4Enabled) {\r\n this.slider.on('slideChange', () => this.onScrollBarMove());\r\n }\r\n }\r\n\r\n private onScrollBarMove(): void {\r\n const { activeIndex, previousIndex } = this.slider;\r\n let eventType = window.NiveaX.deviceType.isDesktop ? \"scroll\" : \"swipe\";\r\n \r\n if (activeIndex > previousIndex) {\r\n this.pushTrackingData(eventType, 'Next')\r\n }\r\n else {\r\n this.pushTrackingData(eventType, 'Prev')\r\n }\r\n }\r\n\r\n private pushTrackingData(eventType: string, direction: string): void { \r\n const trackingData = this.trackingData?.filter(item => item.Rule.includes(direction)).shift(),\r\n eventParams = trackingData?.Tevent.parameters;\r\n \r\n if(Object.keys(eventParams)) {\r\n if(eventParams?.navigation == this.eventParams.navigation) {\r\n eventParams.navigation = eventType\r\n }\r\n\r\n if(eventParams?.photo_size == this.eventParams.photo_size) {\r\n eventParams.photo_size = 'standart'\r\n }\r\n }\r\n \r\n trackingData && addLayer(trackingData.Tevent);\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 TeaserScrollSliderWithT.setup(moduleSelector);\r\n\r\n module.hot.accept(() => {\r\n TeaserScrollSliderWithT.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 TeaserScrollSliderWithT.setup(moduleSelector);\r\n}\r\n","import TeaserScrollSliderWithT from './TeaserScrollSliderWithT';\r\n\r\nexport default TeaserScrollSliderWithT;"],"names":["TeaserScrollSlider","setup","selector","Array","from","document","querySelectorAll","filter","node","dataset","moduleInitialized","forEach","element","constructor","this","init","sliderWrapperHorizontal","querySelector","sliderWrapperVertical","productItems","initProductStageVertical","initProductStageHorizontal","swiper","addEventListener","e","deviceType","detail","console","log","destroySlider","slider","getSwiperOptions","window","NiveaX","isDesktop","innerHTML","append","getDesktopMarkup","isMobile","isTablet","item","updateMarkup","getMobileMarkup","items","slidesNeeded","Math","round","length","map","_","i","index","productItem","splice","slide","slides","modules","slidesPerView","lazyPreloadPrevNext","spaceBetween","direction","on","scrollbar","el","hide","draggable","snapOnRelease","dragSize","mousewheel","enabled","sensitivity","breakpoints","autoHeight","slidesMarkup","destroy","moduleSelector","TeaserScrollSliderWithT","super","eventParams","photo_size","navigation","initTracking","trackingData","tdata","IsGA4Enabled","onScrollBarMove","activeIndex","previousIndex","eventType","pushTrackingData","Rule","includes","shift","Tevent","parameters","Object","keys"],"sourceRoot":""}