{"version":3,"file":"elements-our-stories-js-DEM13YX8.js","sources":["../src/entries/elements/our-stories.js"],"sourcesContent":["import Swiper from \"swiper\";\nimport { A11y, Autoplay, Navigation } from \"swiper/modules\";\nimport \"@/styles/components/slider.css\";\nimport { isTouchDevice } from \"@/scripts/common/util\";\nimport { gsap } from \"gsap\";\n\ndocument.querySelectorAll(\".element-ourstories\").forEach((el) => {\n  const container = el.querySelector(\".swiper\");\n  const slides = el.querySelectorAll(\".swiper-slide\");\n  const expandFactor = 2;\n\n  let activeSlide = null;\n\n  const swiper = new Swiper(container, {\n    modules: [A11y, Autoplay, Navigation],\n    autoplay: {\n      delay: 4000,\n      pauseOnMouseEnter: true,\n    },\n    slidesPerView: \"auto\",\n    spaceBetween: 16,\n    speed: 500,\n    slideToClickedSlide: true,\n    navigation: {\n      nextEl: el.querySelector(\".slider-button-next\"),\n      prevEl: el.querySelector(\".slider-button-prev\"),\n    },\n    breakpoints: {\n      768: {\n        spaceBetween: 16,\n      },\n      1024: {\n        spaceBetween: 0,\n      },\n    },\n  });\n\n  swiper.autoplay.stop();\n\n  const observer = new IntersectionObserver(\n    ([e]) => {\n      if (e.isIntersecting) {\n        swiper.autoplay.start();\n        observer.disconnect();\n      }\n    },\n    {\n      threshold: [0.7],\n    },\n  );\n\n  observer.observe(el);\n\n  if (window.matchMedia(\"(min-width: 1024px)\").matches && !isTouchDevice) {\n    const settleContainer = (activeSlide) => {\n      gsap.to(container, {\n        x: () => {\n          if (activeSlide === null) {\n            return 0;\n          }\n\n          const rect = activeSlide.getBoundingClientRect();\n          const offset = rect.width / expandFactor;\n\n          if (rect.x + rect.width > window.innerWidth) {\n            return offset * -1;\n          }\n\n          if (rect.x + 1.25 * rect.width > window.innerWidth) {\n            return offset / -3;\n          }\n\n          return 0;\n        },\n        duration: 2,\n      });\n    };\n\n    slides.forEach((slide) => {\n      const overlay = slide.querySelector(\".item-overlay\");\n      const screen = slide.querySelector(\".item-screen\");\n      const image = slide.querySelector(\".item-image\");\n\n      const timeline = gsap.timeline({\n        paused: true,\n        onComplete: () => {\n          settleContainer(activeSlide);\n        },\n        onReverseComplete: () => {\n          slide.style.height = null;\n          settleContainer(activeSlide);\n        },\n      });\n\n      timeline.to(slide, { boxShadow: \"-10px 2px 23px rgba(0, 0, 0, 0.05)\", duration: 0 });\n      timeline.to(overlay, { opacity: 0, duration: 0 }, \"<\");\n      timeline.to(slide, { width: `${parseFloat(slide.offsetWidth) * expandFactor}px`, duration: 0.5 }, \"<\");\n      timeline.to(\n        image,\n        {\n          width: image.offsetWidth,\n          scale: 1,\n          zIndex: 100,\n          duration: 0,\n        },\n        \"<\",\n      );\n      timeline.fromTo(\n        screen,\n        { opacity: 0, visibility: \"invisible\" },\n        {\n          opacity: 1,\n          visibility: \"visible\",\n          pointerEvents: \"auto\",\n          duration: 0.3,\n        },\n      );\n      timeline.fromTo(\n        Array.from(screen.children),\n        { opacity: 0, y: \"20%\" },\n        { opacity: 1, duration: 0.4, y: 0, stagger: 0.2 },\n        \"<\",\n      );\n\n      slide.addEventListener(\"mouseenter\", () => {\n        activeSlide = slide;\n        slide.style.height = `${slide.dataset.height}px`;\n        timeline.play();\n      });\n\n      slide.addEventListener(\"mouseleave\", async () => {\n        activeSlide = null;\n        timeline.timeScale(1.25).reverse();\n      });\n    });\n  }\n});\n\ndocument.addEventListener(\"DOMContentLoaded\", () => {\n  const init = () => {\n    document.querySelectorAll(\".element-ourstories .swiper-slide\").forEach((slide) => {\n      slide.setAttribute(\"data-height\", slide.offsetHeight);\n    });\n  };\n\n  const resizeObserver = new ResizeObserver(init);\n  resizeObserver.observe(document.body);\n});\n"],"names":["el","container","slides","expandFactor","activeSlide","swiper","Swiper","A11y","Autoplay","Navigation","observer","e","isTouchDevice","settleContainer","gsap","rect","offset","slide","overlay","screen","image","timeline","init"],"mappings":"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"}