https://www.defencesystem.it/wp-content/plugins/open-user-map/src/js/frontend-carousel.js?ver=1.4.51

1/**
2 * Carousel Module - Handles carousel functionality for location images
3 */
4const OUMCarousel = (function () {
5  function initializeCarousel() {
6    // Initialize carousels that are added later, including lazy-loaded popup content.
7    const observer = new MutationObserver((mutations) => {
8      mutations.forEach((mutation) => {
9        if (mutation.addedNodes.length) {
10          mutation.addedNodes.forEach((node) => {
11            setupCarouselsInNode(node);
12          });
13        }
14
15        setupCarouselsInNode(mutation.target);
16      });
17    });
18
19    // Start observing the document body for popup changes
20    observer.observe(document.body, {
21      childList: true,
22      subtree: true,
23      characterData: true
24    });
25
26    // Initialize carousels in list view
27    document.querySelectorAll('.open-user-map-locations-list .oum-carousel').forEach(carousel => {
28      setupCarousel(carousel);
29    });
30
31    // Initialize carousels in location value
32    document.querySelectorAll('.oum-location-value .oum-carousel').forEach(carousel => {
33      setupCarousel(carousel);
34    });
35  }
36
37  function setupCarouselsInNode(node) {
38    if (!node || node.nodeType !== 1) return;
39
40    if (node.classList && node.classList.contains("oum-carousel")) {
41      setupCarousel(node);
42    }
43
44    node.querySelectorAll(".oum-carousel").forEach((carousel) => {
45      setupCarousel(carousel);
46    });
47  }
48
49  function setupCarousel(carouselEl) {
50    if (!carouselEl) return;
51    if (carouselEl.dataset.oumCarouselInitialized === "1") return;
52
53    const items = carouselEl.querySelectorAll(".oum-carousel-item");
54    if (items.length <= 1) return;
55
56    carouselEl.dataset.oumCarouselInitialized = "1";
57
58    let currentIndex = 0;
59
60    // Create navigation elements
61    const { prevBtn, nextBtn, counter } = createCarouselControls();
62    
63    carouselEl.appendChild(prevBtn);
64    carouselEl.appendChild(nextBtn);
65    carouselEl.appendChild(counter);
66
67    // Setup navigation
68    setupCarouselNavigation(items, prevBtn, nextBtn, counter, currentIndex);
69
70    // Initialize first slide
71    items[0].classList.add("active");
72    updateCounter();
73
74    function updateCounter() {
75      counter.textContent = `${currentIndex + 1}/${items.length}`;
76    }
77  }
78
79  function createCarouselControls() {
80    const prevBtn = document.createElement("button");
81    prevBtn.className = "oum-carousel-prev";
82    prevBtn.setAttribute("aria-label", "Previous image");
83
84    const nextBtn = document.createElement("button");
85    nextBtn.className = "oum-carousel-next";
86    nextBtn.setAttribute("aria-label", "Next image");
87
88    const counter = document.createElement("div");
89    counter.className = "oum-carousel-counter";
90
91    return { prevBtn, nextBtn, counter };
92  }
93
94  function setupCarouselNavigation(items, prevBtn, nextBtn, counter, currentIndex) {
95    function goToSlide(index) {
96      items[currentIndex].classList.remove("active");
97      currentIndex = index;
98      if (currentIndex < 0) currentIndex = items.length - 1;
99      if (currentIndex >= items.length) currentIndex = 0;
100      items[currentIndex].classList.add("active");
101      counter.textContent = `${currentIndex + 1}/${items.length}`;
102    }
103
104    prevBtn.addEventListener("click", () => goToSlide(currentIndex - 1));
105    nextBtn.addEventListener("click", () => goToSlide(currentIndex + 1));
106
107    // Add keyboard navigation
108    document.addEventListener("keydown", (e) => {
109      if (!items[currentIndex].closest(".leaflet-popup-content-wrapper")) return;
110
111      if (e.key === "ArrowLeft") goToSlide(currentIndex - 1);
112      if (e.key === "ArrowRight") goToSlide(currentIndex + 1);
113    });
114
115    // Add touch support
116    let touchStartX = 0;
117    items[0].parentElement.addEventListener("touchstart", (e) => {
118      touchStartX = e.changedTouches[0].screenX;
119    }, false);
120
121    items[0].parentElement.addEventListener("touchend", (e) => {
122      const touchEndX = e.changedTouches[0].screenX;
123      const diff = touchStartX - touchEndX;
124      if (Math.abs(diff) > 50) {
125        if (diff > 0) goToSlide(currentIndex + 1);
126        else goToSlide(currentIndex - 1);
127      }
128    }, false);
129  }
130
131  // Public interface
132  return {
133    init: function () {
134      initializeCarousel();
135    }
136  };
137})();
138
139// Initialize when DOM is ready
140jQuery(document).ready(function($) {

141  OUMCarousel.init();
142});