{"version":3,"file":"Src_Scripts_components_slider-section-slider_js.bf1d7bc3b371d1ca06c7.js","sources":["webpack://HKKF/./Src/Scripts/components/slider-section-slider.js"],"sourcesContent":["import Swiper, { Navigation, Scrollbar } from 'swiper/core';\r\nSwiper.use([Navigation, Scrollbar]);\r\n\r\nexport default class SliderSectionSlider {\r\n    constructor(elm, args) {\r\n\r\n        if (elm.querySelectorAll('.swiper-slide').length === 0) return;\r\n\r\n        // var breakpoint = 768;\r\n        // let mobile = window.matchMedia('(min-width: 0px) and (max-width: ' + breakpoint + 'px)');\r\n        // let desktop = window.matchMedia('(min-width: ' + breakpoint + 'px)');\r\n        let firstSlide = elm.querySelector('.list-view-section__first-slide');\r\n        let nextArrow = elm.parentNode.querySelector('.swiper-button-next');\r\n        let prevArrow = elm.parentNode.querySelector('.swiper-button-prev');\r\n\r\n        let options = {\r\n            slidesPerView: 1.2,\r\n            spaceBetween: 40,\r\n            loop: false,\r\n            watchSlidesProgress: true,\r\n            breakpoints: {\r\n                768: {\r\n                    slidesPerView: 3,\r\n                    spaceBetween: 40,\r\n                },\r\n\r\n            },\r\n            navigation: {\r\n                nextEl: nextArrow,\r\n                prevEl: prevArrow,\r\n            },\r\n            on: {\r\n                init: function () {\r\n                    const event = new Event('swiper init');\r\n                    window.dispatchEvent(event);\r\n                }\r\n            }\r\n        };\r\n\r\n        function updateBreakpoint() {\r\n            if (mobile.matches) {\r\n                firstSlide.classList.remove('list-view-section__first-slide--hidden')\r\n            }\r\n            else if (desktop.matches) {\r\n                firstSlide.classList.add('list-view-section__first-slide--hidden')\r\n            }\r\n\r\n            if (swiper) {\r\n                swiper.destroy();\r\n            }\r\n\r\n            swiper = new Swiper(elm, options);\r\n        }\r\n\r\n        function repositionArrrows() {\r\n            var firstImage = elm.querySelector('.swiper-slide:not(.list-view-section__first-slide--hidden) img');\r\n            var imageHeight = 210;\r\n            if (firstImage) {\r\n                imageHeight = firstImage.getBoundingClientRect().height;\r\n            }\r\n            // nextArrow.style.top = 0.5 * imageHeight + 'px';\r\n            // prevArrow.style.top = 0.5 * imageHeight + 'px';\r\n        }\r\n\r\n        let swiper = new Swiper(elm, options);\r\n\r\n        if (firstSlide) {\r\n            updateBreakpoint();\r\n        }\r\n\r\n        repositionArrrows();\r\n\r\n        window.addEventListener('resize', repositionArrrows);\r\n\r\n        if (firstSlide) {\r\n            mobile.addEventListener('change', updateBreakpoint);\r\n        }\r\n    }\r\n\r\n    update() {\r\n        this.swiper.update();\r\n    }\r\n\r\n    destroy() {\r\n        this.swiper.destroy();\r\n    }\r\n}\r\n\r\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;AACA;;;;;AAAA;AACA;AACA;AACA;AAEA;AAGA;AACA;AACA;AAAA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAFA;AADA;AAOA;AACA;AACA;AAFA;AAIA;AACA;AACA;AACA;AACA;AAJA;AAhBA;AACA;AAuBA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAnFA;AACA;A;;A;;A","sourceRoot":""}