https://playthebazaar.com/js/carousel.js?v=1.1

1const intervalMap = {};
2const eventHandlerMap = {};
3
4function initCarousel(dotNetObj, carouselId = null) {
5    const currentSlideIndex = { carouselId: 0 };
6    goToSlide(dotNetObj, 0, carouselId, currentSlideIndex);
7}
8
9function initPassiveCarousel(dotNetObj, carouselId = null, interval = 2000, totalSlides = 1, transitionStyle = "slide") {
10    const currentSlideIndex = { carouselId: 0 };
11    const intervalId = startSlideInterval(dotNetObj, carouselId, interval, totalSlides, transitionStyle, currentSlideIndex);
12    intervalMap[carouselId] = intervalId;
13    return carouselId;
14}
15
16function startSlideInterval(dotNetObj, carouselId = null, interval = 2000, totalSlides = 1, transitionStyle = "slide", currentSlideIndex) {
17    const intervalId = setInterval(() => {
18        let nextIndex = currentSlideIndex.carouselId + 1;
19        if (nextIndex >= totalSlides) nextIndex = 0;
20        currentSlideIndex.carouselId = nextIndex;
21        goToSlide(dotNetObj, nextIndex, carouselId, transitionStyle, currentSlideIndex);
22    }, interval);
23
24    return intervalId;
25}
26
27function stopSlideInterval(carouselId) {
28    clearInterval(intervalMap[carouselId]);
29    delete intervalMap[carouselId];
30}
31
32function goToSlide(dotNetObj, _slideIndex, carouselId = null, transitionStyle = "slide", currentSlideIndex) {
33    let targetEl;
34    if (carouselId != null) {
35        targetEl = document.getElementById(carouselId);
36    } else {
37        targetEl = document.querySelector('.carousel-item.carousel-active');
38    }
39
40    if (!targetEl) return;
41
42    let slides = targetEl.querySelectorAll('.carousel-item');
43    let activeSlide = targetEl.querySelector('.carousel-item.carousel-active');
44
45    if (!slides || slides.length === 0) return;
46
47    const currentSlide = slides[_slideIndex];
48
49    if (activeSlide) {
50        activeSlide.classList.remove('carousel-active');
51    }
52    if (currentSlide) {
53        currentSlide.classList.add('carousel-active');
54    }
55
56    if (transitionStyle == "slide") {
57        shiftSlides(slides, _slideIndex);
58    } else {
59        fadeSlides(slides, _slideIndex);
60    }
61
62    dotNetObj.invokeMethodAsync('OnSlideChanged');
63}
64
65function getCurrentSlide(carouselId = null) {
66    let activeSlide;
67
68    if (carouselId != null) {
69        const targetEl = document.getElementById(carouselId);
70        activeSlide = targetEl.querySelector('.carousel-item.carousel-active');
71    } else {
72        activeSlide = document.querySelector('.carousel-item.carousel-active');
73    }
74    if (activeSlide) return activeSlide.dataset.slideIndex;
75}
76
77function shiftSlides(slideElements, currIndex) {
78    slideElements.forEach((slide, i) => {
79        slide.style.transform = `translateX(${100 * (i - currIndex)}%)`;
80        if (i === currIndex) {
81            slide.style.opacity = 1;
82        } else {
83            slide.style.opacity = 0;
84        }
85    });
86};
87
88function fadeSlides(slideElements, currIndex) {
89    slideElements.forEach((slide, i) => {
90        if (i === currIndex) {
91            slide.style.opacity = 1;
92        } else {
93            slide.style.opacity = 0;
94        }
95    });
96}