document.addEventListener("DOMContentLoaded", () => {
  //(() => {
  if (document.querySelector(".ex-a-1548087") /* || document.querySelector(".ex-a-2350490")*/) return;

  const initialThreshold = [
    {
      tier: 199,
      gift: "£10 Lifestyle Voucher",
      showGreet: true,
      voucher: "VOUCHER10",
      image: "https://eu.evocdn.io/dealer/1411/content/media/My_Theme/assets/images/lifestyle-10-v1.webp",
    },
    {
      tier: 399,
      gift: "£20 Lifestyle Voucher",
      showGreet: true,
      voucher: "VOUCHER20",
      image: "https://eu.evocdn.io/dealer/1411/content/media/My_Theme/assets/images/lifestyle-20-v1.webp",
    },
    {
      tier: 999,
      gift: "£50 Lifestyle Voucher",
      showGreet: true,
      voucher: "VOUCHER50",
      image: "https://eu.evocdn.io/dealer/1411/content/media/My_Theme/assets/images/lifestyle-50-v1.webp",
    },
  ];
  const popupMessages = {
    congrat_1: "Congratulations! Use code <strong>",
    congrat_2: "</strong> to claim your",
    spend_more_1: "Spend another",
    spend_more_vat: "ex Vat",
    spend_more_2: "to claim your",
    title: "",
  };

  if (document.querySelector(".ex-a-2350490")) {
    initialThreshold.length = 0;
    initialThreshold.push({
      tier: 50,
      gift: "",
      showGreet: true,
      voucher: "",
      image: "",
    });
    popupMessages.congrat_1 = "🌿Your order now qualifies for carbon-neutral shipping!";
    popupMessages.congrat_2 = " Your larger order means fewer delivery trips!";
    popupMessages.spend_more_1 = "You’re just <strong>";
    popupMessages.spend_more_vat = " away</strong>";
    popupMessages.spend_more_2 = ` from our suggested minimum order value of <strong>${$globalCurrency}50</strong>`;
    popupMessages.title = "<h4>🌱 Let’s make a difference together!</h4>";
  }

  let reminderTimeout;
  let additionalTimeout;
  let cartUpdateTimeout;
  let popupVersion = 0;
  const isInCart = document.querySelector(".ex-cart");

  if (!isInCart) {
    const giftReminderContainer = document.createElement("div");
    giftReminderContainer.classList.add("gift-reminder", "inactive");
    giftReminderContainer.innerHTML = `
      ${popupMessages.title ? popupMessages.title : ""}
      <div class="gift-reminder__message">
        <img class="gift-image" src="" />
        <p>
          <span class="gift-message"></span>
          <span class="amount-needed"></span>
          <span class="gift-message-end"></span>
        </p>
      </div>`;

    document.body.append(giftReminderContainer);
  }

  const findTier = (cartSubTotal) => {
    const found = initialThreshold.find((t) => cartSubTotal < t.tier);
    if (found) {
      return initialThreshold.indexOf(found);
    } else {
      return initialThreshold.length;
    }
  };
  const giftImageElement = document.querySelector(".gift-image");
  const giftReminderElement = document.querySelector(".gift-reminder");
  const moneyToSpendSpan = document.querySelector(".amount-needed");
  const giftMessageElement = document.querySelector(".gift-message");
  const giftMessageEndElement = document.querySelector(".gift-message-end");

  const updatePopupMessage = (message_1, message_2 = "", image = "", amount = 0, hideAfter = 5000) => {
    clearTimeout(reminderTimeout);
    giftReminderElement.classList.remove("inactive");
    giftMessageElement.innerHTML = message_1;
    moneyToSpendSpan.innerHTML = amount ? `${$globalCurrency}${amount}` : "";
    giftMessageEndElement.innerHTML = amount ? `${popupMessages.spend_more_2} ${message_2}` : "";
    giftImageElement.src = image ? image : "";

    reminderTimeout = setTimeout(() => {
      giftReminderElement.classList.add("inactive");
    }, hideAfter);
  };

  const showGiftMessage = () => {
    // Update Version On Every Call
    popupVersion++;
    const currentVersion = popupVersion;

    // Get Cart Subtotal
    const cartSubTotal = $mini_cart[0].cart_sub_total;

    // Find index of Tier
    const indexOfTier = findTier(cartSubTotal);

    if (isInCart) {
      //Cart Logic
      const promoDiscount = document.querySelectorAll(".promotion_discount");
      let giftPromotionContainer;
      giftPromotionContainer = document.querySelectorAll(".gift-promotion-container");
      if (!giftPromotionContainer.length) {
        promoDiscount.forEach((e) => {
          const innerRowDiv = document.createElement("div");
          innerRowDiv.classList.add("row");
          const innerColDiv = document.createElement("div");
          innerColDiv.classList.add("col-xs-12", "gift-promotion-container");
          innerRowDiv.append(innerColDiv);
          e.append(innerRowDiv);
        });
        giftPromotionContainer = document.querySelectorAll(".gift-promotion-container");
      } else {
        giftPromotionContainer.forEach((e) => {
          e.replaceChildren();
        });
      }

      if (indexOfTier < initialThreshold.length) {
        const amountRemaining = (initialThreshold[indexOfTier].tier - cartSubTotal).toFixed(2);
        if (indexOfTier) {
          //dual
          giftPromotionContainer.forEach((e) => {
            const innerGiftDiv_1 = document.createElement("div");
            innerGiftDiv_1.classList.add("gift-promotion-1");
            innerGiftDiv_1.innerHTML = `<p class="bg-info">${popupMessages.congrat_1}${initialThreshold[indexOfTier - 1].voucher}${
              popupMessages.congrat_2
            } ${initialThreshold[indexOfTier - 1].gift} </p>`;
            const innerGiftDiv_2 = document.createElement("div");
            innerGiftDiv_2.classList.add("gift-promotion-2");
            innerGiftDiv_2.innerHTML = `<p class="bg-warning">${popupMessages.spend_more_1}${$globalCurrency}${amountRemaining}${popupMessages.spend_more_vat}${popupMessages.spend_more_2} ${initialThreshold[indexOfTier].gift}</p>`;
            e.append(innerGiftDiv_1, innerGiftDiv_2);
          });
        } else {
          //single
          giftPromotionContainer.forEach((e) => {
            const innerGiftDiv_1 = document.createElement("div");
            innerGiftDiv_1.classList.add("gift-promotion-1");
            innerGiftDiv_1.innerHTML = `<p class="bg-warning">${popupMessages.spend_more_1}${$globalCurrency}${amountRemaining}${popupMessages.spend_more_vat}${popupMessages.spend_more_2} ${initialThreshold[indexOfTier].gift}</p>`;
            e.append(innerGiftDiv_1);
          });
        }
      } else {
        giftPromotionContainer.forEach((e) => {
          const innerGiftDiv_s1 = document.createElement("div");
          innerGiftDiv_s1.classList.add("gift-promotion-1");
          innerGiftDiv_s1.innerHTML = `<p class="bg-info">${popupMessages.congrat_1}${initialThreshold[indexOfTier - 1].voucher}${
            popupMessages.congrat_2
          } ${initialThreshold[indexOfTier - 1].gift} </p>`;
          e.append(innerGiftDiv_s1);
        });
      }
    } else {
      // If Cart Subtotal don't Excede Max Tier Value
      if (indexOfTier < initialThreshold.length) {
        const amountRemaining = (initialThreshold[indexOfTier].tier - cartSubTotal).toFixed(2);

        if (indexOfTier && initialThreshold[indexOfTier - 1].showGreet) {
          for (let i = 0; i < indexOfTier; i++) {
            initialThreshold[i].showGreet = false;
          }
          updatePopupMessage(
            `${popupMessages.congrat_1}${initialThreshold[indexOfTier - 1].voucher}${popupMessages.congrat_2} ${
              initialThreshold[indexOfTier - 1].gift
            }`,
            "",
            initialThreshold[indexOfTier - 1].image,
            0,
            7000
          );
          clearTimeout(additionalTimeout);
          additionalTimeout = setTimeout(() => {
            if (currentVersion !== popupVersion) return;
            updatePopupMessage(
              `${popupMessages.spend_more_1}`,
              `${initialThreshold[indexOfTier].gift}`,
              `${initialThreshold[indexOfTier].image}`,
              `${amountRemaining}${popupMessages.spend_more_vat}`,
              5000
            );
          }, 7500);
        } else {
          clearTimeout(additionalTimeout);
          updatePopupMessage(
            `${popupMessages.spend_more_1}`,
            `${initialThreshold[indexOfTier].gift}`,
            `${initialThreshold[indexOfTier].image}`,
            `${amountRemaining}${popupMessages.spend_more_vat}`,
            5000
          );
        }
        for (let i = indexOfTier; i < initialThreshold.length; i++) {
          initialThreshold[i].showGreet = true;
        }
      } else {
        if (initialThreshold[indexOfTier - 1].showGreet) {
          initialThreshold.forEach((e) => {
            e.showGreet = false;
          });
          updatePopupMessage(
            `${popupMessages.congrat_1}${initialThreshold[indexOfTier - 1].voucher}${popupMessages.congrat_2} ${
              initialThreshold[indexOfTier - 1].gift
            }`,
            "",
            `${initialThreshold[indexOfTier - 1].image}`
          );
        }
      }
    }
  };

  document.addEventListener("cart-total-update", function () {
    clearTimeout(cartUpdateTimeout);
    cartUpdateTimeout = setTimeout(() => showGiftMessage(), 50);
  });
  if (isInCart) setTimeout(showGiftMessage(), 200);

  (() => {
    if (isInCart) return;
    const header = document.querySelector(".header-full");
    const observer = new MutationObserver(() => {
      const tt = document.querySelector(".gift-reminder");
      tt.classList.toggle("has-sticky", header.classList.contains("new-sticky"));
      tt.classList.toggle("has-scrollup", header.classList.contains("scrollup"));
    });
    observer.observe(header, {
      attributes: true,
      attributeFilter: ["class"],
    });
  })();
  //})();
});