import { g as _sfc_main$1, a as _export_sfc } from "../server.mjs";
import { _ as __nuxt_component_1 } from "./VideoButton-B4IDmAbs.js";
import { _ as __nuxt_component_2, a as __nuxt_component_1$1 } from "./GradientFullArrowRight-B3gaunpf.js";
import { defineComponent, ref, watch, mergeProps, unref, useSSRContext } from "vue";
import { ssrRenderAttrs, ssrRenderList, ssrRenderClass, ssrRenderComponent, ssrRenderAttr, ssrIncludeBooleanAttr } from "vue/server-renderer";
import { publicAssetsURL } from "#internal/nuxt/paths";
const _sfc_main = /* @__PURE__ */ defineComponent({
  __name: "ReelsSlider",
  __ssrInlineRender: true,
  props: {
    projects: {}
  },
  setup(__props) {
    const currentIndex = ref(0);
    const videoRefs = ref([]);
    const playingVideoIndex = ref(null);
    const youtubeEmbedUrls = ref(/* @__PURE__ */ new Map());
    const YOUTUBE_REGEX = /(?:youtube\.com\/(?:watch\?v=|shorts\/)|youtu\.be\/)([a-zA-Z0-9_-]{11})/;
    const isYouTubeVideo = (url) => {
      return url.includes("youtube") || url.includes("youtu.be");
    };
    const getYouTubeVideoId = (url) => {
      const match = url.match(YOUTUBE_REGEX);
      return match ? match[1] : null;
    };
    const getYouTubeThumbnail = (url) => {
      const videoId = getYouTubeVideoId(url);
      return videoId ? `https://img.youtube.com/vi/${videoId}/maxresdefault.jpg` : "";
    };
    const getSlidePosition = (index) => {
      const total = __props.projects.length;
      if (total === 0) return "hidden";
      const prev = (currentIndex.value - 1 + total) % total;
      const next = (currentIndex.value + 1) % total;
      const secondPrev = (currentIndex.value - 2 + total) % total;
      const secondNext = (currentIndex.value + 2) % total;
      if (index === prev) return "left";
      if (index === currentIndex.value) return "center";
      if (index === next) return "right";
      if (index === secondPrev || index === secondNext) return "preload";
      return "hidden";
    };
    watch(currentIndex, () => {
      if (playingVideoIndex.value !== null) {
        const video = videoRefs.value[playingVideoIndex.value];
        if (video instanceof HTMLVideoElement) {
          video.pause();
        }
        playingVideoIndex.value = null;
      }
    });
    return (_ctx, _push, _parent, _attrs) => {
      var _a;
      const _component_NuxtImg = _sfc_main$1;
      const _component_SvgVideoButton = __nuxt_component_1;
      const _component_SvgGradientFullArrowLeft = __nuxt_component_2;
      const _component_SvgGradientFullArrowRight = __nuxt_component_1$1;
      if (((_a = _ctx.projects) == null ? void 0 : _a.length) > 0) {
        _push(`<div${ssrRenderAttrs(mergeProps({
          dir: "rtl",
          class: "relative w-full overflow-hidden",
          role: "region",
          "aria-label": "Video gallery"
        }, _attrs))} data-v-121ff1ce><div class="gallery-container" data-v-121ff1ce><!--[-->`);
        ssrRenderList(_ctx.projects, (project, index) => {
          _push(`<div class="${ssrRenderClass(["gallery-slide", getSlidePosition(index)])}" data-v-121ff1ce><div class="relative z-10 h-full w-full overflow-hidden rounded-2xl" data-v-121ff1ce>`);
          if (isYouTubeVideo(project.url)) {
            _push(`<!--[-->`);
            if (unref(playingVideoIndex) !== index) {
              _push(ssrRenderComponent(_component_NuxtImg, {
                src: getYouTubeThumbnail(project.url),
                class: "gallery-media",
                alt: project.title
              }, null, _parent));
            } else {
              _push(`<iframe class="gallery-media"${ssrRenderAttr("src", unref(youtubeEmbedUrls).get(index) || "")} frameborder="0" allowfullscreen allow="autoplay; encrypted-media" data-v-121ff1ce></iframe>`);
            }
            _push(`<!--]-->`);
          } else {
            _push(`<video${ssrRenderAttr("src", project.url)} class="gallery-media" controls muted loop data-v-121ff1ce></video>`);
          }
          if (unref(playingVideoIndex) !== index) {
            _push(`<div class="absolute inset-0 flex cursor-pointer items-center justify-center rounded-2xl bg-[rgba(0,0,0,0.5)]" data-v-121ff1ce>`);
            _push(ssrRenderComponent(_component_SvgVideoButton, { class: "h-[40px] w-[40px]" }, null, _parent));
            _push(`</div>`);
          } else {
            _push(`<!---->`);
          }
          _push(`</div></div>`);
        });
        _push(`<!--]--></div><div class="relative z-[10] mt-6 flex items-center justify-center gap-6" data-v-121ff1ce><button class="bg-surface-background border-surface-border rounded-ws-rounded flex-shrink-0 cursor-pointer border p-3"${ssrIncludeBooleanAttr(_ctx.projects.length === 0) ? " disabled" : ""} aria-label="Previous video" data-v-121ff1ce>`);
        _push(ssrRenderComponent(_component_SvgGradientFullArrowLeft, { class: "rtl:scale-x-[-1]" }, null, _parent));
        _push(`</button><div class="custom-pagination-container" data-v-121ff1ce><!--[-->`);
        ssrRenderList(_ctx.projects, (project, index) => {
          _push(`<div class="${ssrRenderClass([{ active: unref(currentIndex) === index }, "pagination-dot"])}" data-v-121ff1ce></div>`);
        });
        _push(`<!--]--></div><button class="bg-surface-background border-surface-border rounded-ws-rounded flex-shrink-0 cursor-pointer border p-3"${ssrIncludeBooleanAttr(_ctx.projects.length === 0) ? " disabled" : ""} aria-label="Next video" data-v-121ff1ce>`);
        _push(ssrRenderComponent(_component_SvgGradientFullArrowRight, { class: "rtl:scale-x-[-1]" }, null, _parent));
        _push(`</button></div></div>`);
      } else {
        _push(`<!---->`);
      }
    };
  }
});
const _sfc_setup = _sfc_main.setup;
_sfc_main.setup = (props, ctx) => {
  const ssrContext = useSSRContext();
  (ssrContext.modules || (ssrContext.modules = /* @__PURE__ */ new Set())).add("components/campaign/ReelsSlider.vue");
  return _sfc_setup ? _sfc_setup(props, ctx) : void 0;
};
const __nuxt_component_0 = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-121ff1ce"]]);
const _imports_0 = publicAssetsURL("/videos/mobile-application.mp4");
export {
  _imports_0 as _,
  __nuxt_component_0 as a
};
//# sourceMappingURL=virtual_public-CJpdAW74.js.map
