https://www.healthdatasummit.ca/wp-content/themes/charlotte-theme/assets/js/sliders.js

1(function () {
2    function initSliders() {
3        const speakerSlider = new Swiper('.speaker-slider', {
4            slidesPerView: 1.3,
5            spaceBetween: 15,
6            loop: true,
7            centeredSlides: false,
8            breakpoints: {
9                768: { centeredSlides: true, slidesPerView: 3 },
10                1024: { centeredSlides: true, slidesPerView: 4 }
11            },
12            navigation: {
13                nextEl: ".swiper-control-next",
14                prevEl: ".swiper-control-prev"
15            }
16        });
17
18        const testimonialSlider = new Swiper('.swiper-container', {
19            slidesPerView: 1.3,
20            spaceBetween: 15,
21            parallax: true,
22            speed: 1000,
23            loop: true,
24            navigation: {
25                nextEl: ".slider-control-prev",
26                prevEl: ".slider-control-next"
27            },
28            breakpoints: {
29                768: { slidesPerView: 1.3, spaceBetween: 15 },
30                850: { slidesPerView: 1.5, spaceBetween: 30 }
31            }
32        });
33
34        const imageSlider = new Swiper('.image-slider', {
35            draggable: false,
36            speed: 500,
37            on: { slideChange: slidesChange },
38            navigation: {
39                nextEl: ".action-slider--next",
40                prevEl: ".action-slider--prev"
41            }
42        });
43
44        Array.from(document.getElementsByClassName('testimonial-nav-prev')).forEac

44h(nav => {
45            nav.addEventListener('click', () => testimonialSlider.slidePrev());
46        });
47
48        Array.from(document.getElementsByClassName('testimonial-nav-next')).forEach(nav => {
49            nav.addEventListener('click', () => testimonialSlider.slideNext());
50        });
51
52        testimonialSlider.on('onSlideNextStart', () => {
53            $('.swiper-slide .parallax-bg').attr('data-swiper-parallax-duration', '');
54            $('.swiper-slide-prev .parallax-bg').attr('data-swiper-parallax-duration', '3000');
55        });
56    }
57
58    function reasons() {
59        var $reasonsCarousel = jQuery('.reasons-carousel');
60
61        if (!$reasonsCarousel.length || typeof $reasonsCarousel.flickity !== 'function') {
62            console.warn('Flickity not loaded or element not found.');
63            return;
64        }
65
66        $reasonsCarousel.flickity({
67			adaptiveHeight: true,
68            wrapAround: true,
69            selectedAttraction: 0.05,
70            pageDots: false,
71            fade: true
72        });
73
74        $reasonsCarousel.on('dragStart.flickity', function () {
75            document.ontouchmove = function (e) {
76                e.preventDefault();
77            };
78        });
79
80        $reasonsCarousel.on('dragEnd.flickity', function () {
81            document.ontouchmove = function (e) {
82                return true;
83            };
84        });
85    }
86
87    function location() {
88        var $locationCarousel = jQuery('.location-carousel');
89
90        $locationCarousel.flickity({
91            wrapAround: true,
92            selectedAttraction: 0.05,
93            pageDots: false,
94            fade: true
95        });
96
97        $locationCarousel.on('dragStart.flickity', function (e, pointer) {
98            document.ontouchmove = function (e) {
99                e.preventDefault();
100            };
101        });
102
103        $locationCarousel.on('dragEnd.flickity', function (e, pointer) {
104            document.ontouchmove = function (e) {
105                return true;
106            };
107        });
108    }
109
110    function swiperMarquee() {
111        let initSwiper = false;

112        if (!initSwiper) {
113            initSwiper = true;
114            new Swiper('.marquee-text', {
115                spaceBetween: 5,
116                centeredSlides: true,
117                speed: 4000,
118                autoplay: { delay: 0 },
119                loop: true,
120                pauseOnMouseEnter: true,
121                slidesPerView: 1.4,
122                allowTouchMove: false,
123                breakpoints: {
124                    600: { slidesPerView: 3.5, spaceBetween: 5 },
125                    1280: { slidesPerView: 5, spaceBetween: 5, centeredSlides: false }
126                },
127                navigation: {
128                    nextEl: ".slider-control-next",
129                    prevEl: ".slider-control-prev"
130                }
131            });
132        }
133        window.addEventListener("resize", swiperMarquee);
134    }
135
136    function slidesChange(swiper) {
137        const index = swiper.realIndex * -1;
138        const counterItems = document.querySelectorAll('.counter');
139        const contentItems = document.querySelectorAll('.content-slider--item');
140        const wrapperWidth = document.querySelector('.content-slider').offsetWidth;
141        counterItems.forEach(item => {
142            item.style.transform = `translateY(${item.offsetHeight * index}px)`;
143        });
144        contentItems.forEach(item => {
145            item.style.transform = `translateX(${wrapperWidth * index}px)`;
146        });
147    }
148
149    // Initialize
150    function initialize() {
151        initSliders();
152        reasons();
153        location();
154        swiperMarquee();
155    }
156
157    initialize();
158})();