/******/ (() => { // webpackBootstrap
/*!****************************************!*\
  !*** ./src/scroll-story-block/view.js ***!
  \****************************************/
const cards = gsap.utils.toArray(".scroll-story-block .narrative-card");

// Ajouter des classes alternées pour le styling
cards.forEach((card, index) => {
  if (index % 2 === 0) {
    card.classList.add("narrative-card--even");
  } else {
    card.classList.add("narrative-card--odd");
  }
});

// Définir le breakpoint pour mobile/desktop (vous pouvez l'ajuster selon vos besoins)
const MOBILE_BREAKPOINT = 768;
let scrollTriggers = [];
let stickDistance = 0;

// Fonction pour initialiser les ScrollTriggers (desktop)
function initScrollTriggers() {
  // Nettoyer d'abord les ScrollTriggers existants
  killScrollTriggers();
  if (cards.length === 0) return;
  let firstCardST = ScrollTrigger.create({
    trigger: cards[0],
    start: "top 10%"
  });
  scrollTriggers.push(firstCardST);
  let lastCardST = ScrollTrigger.create({
    trigger: cards[cards.length - 1],
    start: "top 10%"
  });
  scrollTriggers.push(lastCardST);
  cards.forEach((card, index) => {
    var scale = 1 - (cards.length - index) * 0.025;
    let scaleDown = gsap.to(card, {
      scale: scale,
      "transform-origin": '"50% ' + (lastCardST.start + stickDistance) + '"'
    });
    let cardST = ScrollTrigger.create({
      trigger: card,
      start: "top 10%",
      end: () => lastCardST.start + stickDistance,
      pin: true,
      // markers: true,
      pinSpacing: false,
      ease: "none",
      animation: scaleDown,
      toggleActions: "restart none none reverse"
    });
    scrollTriggers.push(cardST);
  });
}

// Fonction pour détruire tous les ScrollTriggers
function killScrollTriggers() {
  scrollTriggers.forEach(st => st.kill());
  scrollTriggers = [];

  // Réinitialiser les styles inline des cartes
  cards.forEach(card => {
    gsap.set(card, {
      clearProps: "all"
    });
  });
}

// Fonction pour gérer le responsive
function handleResize() {
  const isMobile = window.innerWidth < MOBILE_BREAKPOINT;
  if (isMobile) {
    // Sur mobile : détruire les ScrollTriggers
    killScrollTriggers();
  } else {
    // Sur desktop : créer les ScrollTriggers s'ils n'existent pas
    if (scrollTriggers.length === 0) {
      initScrollTriggers();
    }
  }
}

// Initialisation au chargement
handleResize();

// Écouter les événements de resize avec debounce pour optimiser les performances
let resizeTimer;
window.addEventListener("resize", () => {
  clearTimeout(resizeTimer);
  resizeTimer = setTimeout(() => {
    handleResize();
  }, 250);
});
/******/ })()
;
//# sourceMappingURL=view.js.map