(function () {
  "use strict";

  function isFLLDHomePage() {
    var currentPath =
      window.location.pathname.replace(/\/+$/, "") || "/";

    return currentPath === "/";
  }

  function removeFLLDSpaceOutsideHome() {
    var injectedHero =
      document.getElementById("flld-space-hero");

    if (injectedHero && injectedHero.parentNode) {
      injectedHero.parentNode.removeChild(injectedHero);
    }

    var hiddenHeroes =
      document.querySelectorAll(".flld-old-hero-hidden");

    for (var i = 0; i < hiddenHeroes.length; i++) {
      hiddenHeroes[i].classList.remove(
        "flld-old-hero-hidden"
      );
    }
  }

  function startFLLDSpace() {
    // لا تشغّل واجهة فلذ إلا في الصفحة الرئيسية
    if (!isFLLDHomePage()) {
      removeFLLDSpaceOutsideHome();
      return;
    }

    if (document.getElementById("flld-space-hero")) {
      return;
    }

    addQuoteStyles();

    var oldHeroSelectors = [
      "salla-slider.photos-slider",
      ".main-slider",
      ".home-slider",
      ".hero-slider",
      ".banner-slider",
      "[data-type='main-slider']"
    ];

    var oldHero = null;

    var posterImage =
      "https://cdn.files.salla.network/homepage/149224060/279a4f38-fcc0-44de-b95c-44f31623887d_601x900.webp";

    for (var i = 0; i < oldHeroSelectors.length; i++) {
      oldHero = document.querySelector(oldHeroSelectors[i]);

      if (oldHero) {
        break;
      }
    }

    var hero = document.createElement("section");

    hero.id = "flld-space-hero";

    hero.innerHTML =
      '<div class="flld-space-stars"></div>' +

      '<div class="flld-space-container">' +

        '<div class="flld-space-content">' +

          '<div class="flld-space-tag">' +
            'FLLD / SPACE' +
          '</div>' +

          '<h1 class="flld-space-title">' +
            'جدارك<br>' +
            'خارج <span>المألوف.</span>' +
          '</h1>' +

          '<p class="flld-space-text">' +
            'لوحات فلذ ما تكمّل المكان فقط، بل تفتح داخله عالماً جديداً. اختر المشهد الذي يمثلك وخَلّ جدارك يحكي قصته.' +
          '</p>' +

          '<div class="flld-space-cta-block">' +

            '<div class="flld-space-actions">' +

              '<a href="/products" ' +
                'class="flld-space-btn flld-space-btn-primary">' +
                'استكشف اللوحات' +
              '</a>' +

              '<button type="button" ' +
                'class="flld-space-btn flld-space-btn-secondary" ' +
                'id="flld-scroll-products">' +
                'شاهد المجموعة' +
              '</button>' +

            '</div>' +

            '<div class="flld-space-quote">' +
              '<span>أثر يعيش، مو لحظة وتروح.</span>' +
            '</div>' +

          '</div>' +

        '</div>' +

        '<div class="flld-space-visual">' +

          '<div class="flld-space-stage">' +

            '<div class="flld-space-orbit"></div>' +
            '<div class="flld-space-orbit"></div>' +
            '<div class="flld-space-orbit"></div>' +

            '<div class="flld-space-card flld-space-card-one">' +
              '<small>FLLD / 01</small>' +
              '<strong>مشهد يغيّر المكان</strong>' +
            '</div>' +

            '<div class="flld-space-card flld-space-card-two">' +
              '<small>YOUR WALL</small>' +
              '<strong>اختر عالمك</strong>' +
            '</div>' +

            '<div class="flld-space-poster-wrap">' +

              '<div class="flld-space-poster-frame">' +

                '<div class="flld-space-placeholder">' +
                  '<div>' +
                    '<strong>FLLD</strong>' +
                    'جاري تحميل اللوحة' +
                  '</div>' +
                '</div>' +

                '<img ' +
                  'class="flld-space-poster" ' +
                  'alt="لوحة فلذ" ' +
                  'width="736" ' +
                  'height="1103" ' +
                  'loading="eager" ' +
                  'fetchpriority="high" ' +
                  'decoding="async" ' +
                  'style="display:none">' +

              '</div>' +

            '</div>' +

          '</div>' +

        '</div>' +

      '</div>';

    var main =
      document.querySelector("main") ||
      document.querySelector("#main-content") ||
      document.querySelector(".store-content");

    var header =
      document.querySelector("header") ||
      document.querySelector(".store-header") ||
      document.querySelector(".main-nav-container");

    if (main) {
      main.insertBefore(hero, main.firstChild);
    } else if (header && header.parentNode) {
      header.parentNode.insertBefore(
        hero,
        header.nextSibling
      );
    } else {
      document.body.insertBefore(
        hero,
        document.body.firstChild
      );
    }

    var poster =
      hero.querySelector(".flld-space-poster");

    var placeholder =
      hero.querySelector(".flld-space-placeholder");

    poster.onload = function () {
      poster.style.display = "block";
      placeholder.style.display = "none";
    };

    poster.onerror = function () {
      placeholder.innerHTML =
        '<div>' +
          '<strong>FLLD</strong>' +
          'تعذر تحميل الصورة' +
        '</div>';
    };

    poster.src = posterImage;

    if (oldHero) {
      oldHero.classList.add(
        "flld-old-hero-hidden"
      );
    }

    createStars(hero);
    enableMovement(hero);
    enableScrollButton();
  }

  function addQuoteStyles() {
    if (
      document.getElementById(
        "flld-space-quote-styles"
      )
    ) {
      return;
    }

    var style = document.createElement("style");

    style.id = "flld-space-quote-styles";

    style.textContent =
      ".flld-space-cta-block{" +
        "display:inline-flex;" +
        "flex-direction:column;" +
        "align-items:center;" +
        "max-width:100%;" +
        "margin-top:35px;" +
      "}" +

      ".flld-space-cta-block .flld-space-actions{" +
        "margin-top:0;" +
        "justify-content:center;" +
      "}" +

      ".flld-space-quote{" +
        "display:flex;" +
        "align-items:center;" +
        "justify-content:center;" +
        "width:100%;" +
        "margin-top:17px;" +
        "text-align:center;" +
      "}" +

      ".flld-space-quote span{" +
        "position:relative;" +
        "display:inline-flex;" +
        "align-items:center;" +
        "justify-content:center;" +
        "padding:0 23px;" +
        "color:rgba(255,255,255,.82);" +
        "font-size:clamp(14px,1.25vw,18px);" +
        "font-weight:700;" +
        "line-height:1.7;" +
        "letter-spacing:-.01em;" +
      "}" +

      ".flld-space-quote span:before," +
      ".flld-space-quote span:after{" +
        "content:'';" +
        "width:24px;" +
        "height:1px;" +
        "margin:0 11px;" +
        "background:linear-gradient(" +
          "90deg," +
          "transparent," +
          "rgba(255,255,255,.3)" +
        ");" +
      "}" +

      ".flld-space-quote span:after{" +
        "transform:scaleX(-1);" +
      "}" +

      "@media(max-width:950px){" +
        ".flld-space-cta-block{" +
          "display:flex;" +
          "width:100%;" +
          "align-items:center;" +
        "}" +
      "}" +

      "@media(max-width:600px){" +
        ".flld-space-cta-block{" +
          "width:100%;" +
          "margin-top:30px;" +
        "}" +

        ".flld-space-cta-block .flld-space-actions{" +
          "width:100%;" +
        "}" +

        ".flld-space-quote{" +
          "margin-top:16px;" +
        "}" +

        ".flld-space-quote span{" +
          "padding:0 5px;" +
          "font-size:14px;" +
        "}" +

        ".flld-space-quote span:before," +
        ".flld-space-quote span:after{" +
          "width:18px;" +
          "margin:0 8px;" +
        "}" +
      "}";

    document.head.appendChild(style);
  }

  function createStars(hero) {
    var starsContainer =
      hero.querySelector(".flld-space-stars");

    if (!starsContainer) {
      return;
    }

    for (var i = 0; i < 65; i++) {
      var star = document.createElement("span");

      star.className = "flld-space-star";

      star.style.setProperty(
        "--x",
        Math.random() * 100 + "%"
      );

      star.style.setProperty(
        "--y",
        Math.random() * 100 + "%"
      );

      star.style.setProperty(
        "--size",
        Math.random() * 2.5 + 0.7 + "px"
      );

      star.style.setProperty(
        "--opacity",
        Math.random() * 0.7 + 0.2
      );

      star.style.setProperty(
        "--duration",
        Math.random() * 4 + 2.5 + "s"
      );

      starsContainer.appendChild(star);
    }
  }

  function enableMovement(hero) {
    var stage =
      hero.querySelector(".flld-space-stage");

    if (!stage || window.innerWidth < 800) {
      return;
    }

    var animationFrame = null;

    hero.addEventListener(
      "mousemove",
      function (event) {
        if (animationFrame) {
          cancelAnimationFrame(animationFrame);
        }

        animationFrame =
          requestAnimationFrame(function () {
            var rect =
              hero.getBoundingClientRect();

            var x =
              (event.clientX - rect.left) /
              rect.width -
              0.5;

            var y =
              (event.clientY - rect.top) /
              rect.height -
              0.5;

            stage.style.transform =
              "rotateY(" +
              x * 8 +
              "deg) rotateX(" +
              y * -7 +
              "deg)";
          });
      }
    );

    hero.addEventListener(
      "mouseleave",
      function () {
        stage.style.transform =
          "rotateY(0deg) rotateX(0deg)";
      }
    );
  }

  function enableScrollButton() {
    var button =
      document.getElementById(
        "flld-scroll-products"
      );

    if (!button) {
      return;
    }

    button.addEventListener(
      "click",
      function () {
        var products =
          document.querySelector(
            "salla-products-list"
          ) ||
          document.querySelector(
            ".products-list"
          ) ||
          document.querySelector(
            ".featured-products"
          ) ||
          document.querySelector(
            ".product-grid"
          );

        if (products) {
          products.scrollIntoView({
            behavior: "smooth",
            block: "start"
          });
        } else {
          window.location.href = "/products";
        }
      }
    );
  }

  if (document.readyState === "loading") {
    document.addEventListener(
      "DOMContentLoaded",
      startFLLDSpace,
      { once: true }
    );
  } else {
    startFLLDSpace();
  }
})();