/* Scoped to: history-template-dawn-across-slide */
(function() {
  'use strict';
  var componentRoots = document.querySelectorAll('[data-component-slug="history-template-dawn-across-slide"]');
  componentRoots.forEach(function(componentRoot) {
    // Helper to query within component, with fallback to document for sibling elements
    var $ = function(sel) { 
      return componentRoot.querySelector(sel) || document.querySelector('[data-component-slug="history-template-dawn-across-slide"] ~ ' + sel) || document.querySelector(sel);
    };
    var $$ = function(sel) { 
      var results = componentRoot.querySelectorAll(sel);
      return results.length ? results : document.querySelectorAll(sel);
    };
    // Original component JS runs in this scope
    (function () { const slider = document.getElementById("dawnSlider"); const track = slider.querySelector(".dawn-track"); let slides = Array.from(track.children); let slidesPerView = getSlidesPerView(); let index; let slideWidth; let isDragging = false; let startX = 0; let currentTranslate = 0; let prevTranslate = 0; let autoTimer; function getSlidesPerView() { if (window.innerWidth < 768) return 1; if (window.innerWidth < 1280) return 2; return 3; } function setSlideWidth() { slideWidth = slides[0].getBoundingClientRect().width + 12; } function updateClasses() { slides.forEach((s) => s.classList.remove("prev", "active", "next")); slides[index]?.classList.add("active"); slides[index - 1]?.classList.add("prev"); slides[index + 1]?.classList.add("next"); } function setPosition(animate = true) { track.style.transition = animate ? "transform 0.6s ease" : "none"; currentTranslate = -index * slideWidth; track.style.transform = `translateX(${currentTranslate}px)`; prevTranslate = currentTranslate; updateClasses(); } function cloneSlides() { const before = slides.slice(-slidesPerView); const after = slides.slice(0, slidesPerView); before.forEach((s) => track.prepend(s.cloneNode(true))); after.forEach((s) => track.append(s.cloneNode(true))); slides = Array.from(track.children); index = slidesPerView; } function startAutoplay() { stopAutoplay(); autoTimer = setInterval(() => { index++; setPosition(); if (index >= slides.length - slidesPerView) { setTimeout(() => { index = slidesPerView; setPosition(false); }, 600); } }, 3500); } function stopAutoplay() { if (autoTimer) clearInterval(autoTimer); } slider.addEventListener("mousedown", (e) => { isDragging = true; startX = e.clientX; stopAutoplay(); track.style.transition = "none"; slider.style.cursor = "grabbing"; }); window.addEventListener("mousemove", (e) => { if (!isDragging) return; const delta = e.clientX - startX; track.style.transform = `translateX(${prevTranslate + delta}px)`; }); window.addEventListener("mouseup", (e) => { if (!isDragging) return; isDragging = false; slider.style.cursor = "grab"; const delta = e.clientX - startX; const movedSlides = Math.round(delta / slideWidth); index -= movedSlides; setPosition(); if (index <= 0) { setTimeout(() => { index = slides.length - slidesPerView * 2; setPosition(false); }, 600); } if (index >= slides.length - slidesPerView) { setTimeout(() => { index = slidesPerView; setPosition(false); }, 600); } startAutoplay(); }); slider.addEventListener("mouseleave", () => { if (!isDragging) return; isDragging = false; slider.style.cursor = "grab"; setPosition(); startAutoplay(); }); function init() { slidesPerView = getSlidesPerView(); cloneSlides(); setSlideWidth(); setPosition(false); startAutoplay(); } let loaded = 0; slides.forEach((slide) => { const img = slide.querySelector("img"); if (img.complete) { loaded++; } else { img.onload = () => { loaded++; if (loaded === slides.length) init(); }; } }); if (loaded === slides.length) init(); window.addEventListener("resize", () => { slidesPerView = getSlidesPerView(); setSlideWidth(); setPosition(false); }); })();
  });
})();