var fixed_header;
var sticky;
var cart_products = [];

let productsQuestions;
let customer = null;

document.addEventListener("zid-customer-fetched", function (event) {
  var customerDetail = event.detail.customer;
  if (customerDetail) {
    customer = customerDetail;
  }
  handleWishlistState();
  class ProductsQuestions {
    constructor() {
      this.emailRegex = /^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,6}$/;
      this.customer = customer;
      this.customerName = $('#addProductQuestionModal input[name="name"]');
      this.customerEmail = $('#addProductQuestionModal input[name="email"]');
      this.customerQuestion = $(
        '#addProductQuestionModal textarea[name="question"]'
      );
      this.isAnonymous = $(
        '#addProductQuestionModal input[name="is_anonymous"]'
      );
      this.submitButton = $(".btn-submit-new-question");
    }

    isValidEmail() {
      return this.emailRegex.test(this.customerEmail.val());
    }

    showError(inputName) {
      $(`#addProductQuestionModal .input-error-${inputName}`).removeClass(
        "d-none"
      );
      $(
        `#addProductQuestionModal input[name="${inputName}"], textarea[name="${inputName}"]`
      ).addClass("border-danger");
    }

    hideError(inputName) {
      $(`#addProductQuestionModal .input-error-${inputName}`).addClass(
        "d-none"
      );
      $(
        `#addProductQuestionModal input[name="${inputName}"], textarea[name="${inputName}"]`
      ).removeClass("border-danger");
    }

    validateInputs() {
      let isValid = true;

      if (!this.customerQuestion.val().length) {
        this.showError("question");
        isValid = false;
      } else {
        this.hideError("question");
      }

      if (!this.customerEmail.val().length) {
        this.showError("email");
        isValid = false;
      } else {
        this.hideError("email");
      }

      if (this.customerEmail.val().length && !this.isValidEmail()) {
        $("#addProductQuestionModal .input-error-invalid-email").removeClass(
          "d-none"
        );
        $('#addProductQuestionModal input[name="email"]').addClass(
          "border-danger"
        );
        isValid = false;
      } else {
        $("#addProductQuestionModal .input-error-invalid-email").addClass(
          "d-none"
        );
      }

      if (!this.customerName.val().length) {
        this.showError("name");
        isValid = false;
      } else {
        this.hideError("name");
      }

      return isValid;
    }

    fillCustomerData() {
      if (this.customer && this.customer.name && this.customer.email) {
        if (!this.customerName.val()) this.customerName.val(this.customer.name);
        if (!this.customerEmail.val())
          this.customerEmail.val(this.customer.email);
      }
    }

    checkAddQuestionPossibility() {
      $("#addQuestionButton").click(function () {
        if (customer) {
          $("#addProductQuestionModal").modal("show");
          productsQuestions.fillCustomerData();
        } else {
          const currentPathname = location.pathname;
          const params = location.search;
          location.href = `/auth/login?redirect_to=${encodeURIComponent(
            currentPathname + params
          )}`;
          return;
        }
      });
    }

    async submitQuestion(productId) {
      const isValid = this.validateInputs();

      if (isValid) {
        $(".add-review-progress").removeClass("d-none");
        this.submitButton.attr("disabled", true);

        try {
          const response = await zid.store.product.addQuestion(
            productId,
            this.customerQuestion.val(),
            this.customerName.val(),
            this.customerEmail.val(),
            this.isAnonymous.is(":checked")
          );

          if (response.status === "success") {
            toastr.success(
              locales_messages.success,
              locales_messages.success_header
            );

            $('textarea[name="question"]').val("");
          }
        } catch (error) {
          console.log(error);
          toastr.error(error, locales_messages.error);
        } finally {
          $(".add-review-progress").addClass("d-none");

          $("#addProductQuestionModal").modal("hide");
          this.submitButton.removeAttr("disabled");
        }
      }
    }
  }

  productsQuestions = new ProductsQuestions();

  productsQuestions.checkAddQuestionPossibility();
});

window.onscroll = () => fixed_header_to_top();

function menuFiixedHeader() {
  fixed_header = document.getElementById("fixed-header");
  sticky = fixed_header.offsetTop;
}

function fixed_header_to_top() {
  if (window.pageYOffset > sticky) {
    if (fixed_header) {
      fixed_header.classList.add("sticky");
      $(".app-content").addClass("app-content-padded");
    }
  } else {
    if (fixed_header) {
      fixed_header.classList.remove("sticky");
      $(".app-content").removeClass("app-content-padded");
    }
  }
}

function showDropItems() {
  let dropitems = document.getElementById("women-dropitmes");
  dropitems.classList.remove("dropitems");
  dropitems.classList.add("dropitems-shown");
}

function hideDropItems() {
  let dropitems = document.getElementById("women-dropitmes");
  dropitems.classList.remove("dropitems-shown");
  dropitems.classList.add("dropitems");
}

function hideDropDownMenu() {
  elem.classList.remove("dropitems-shown");
  elem.classList.add("dropitems");
}

function rowSlideRight(selector) {
  let container = document.querySelector(selector);
  let width = container.offsetWidth;
  container.scrollLeft = 0;
}

function rowSlideLeft(selector) {
  var container = document.querySelector(selector);
  var width = container.offsetWidth;
  container.scrollLeft = -width;
}

function hideAnnouncementBar() {
  $(".announcement-bar").addClass("d-none");
}

function hideAvailabilityBar() {
  $(".availability-bar").addClass("d-none");
}

/* 
    Cart
*/

function hideElmById(id) {
  document.getElementById(id).style.display = "none";
}

function showShoppingCart() {
  document.getElementById("header-shopping-cart").style.width = "40%";
  document.body.classList.add("disable-scroll");
  addCartItem();
}

function hideShoppingCart() {
  document.getElementById("header-shopping-cart").style.width = "0%";
  document.body.classList.remove("disable-scroll");
  removeCartItems();
  hideElmById("empty-cart");
}

function getCartTotal() {
  return cart_products.reduce(
    (acc, product) => acc + product.price * product.quantity,
    0
  );
}

function getCartItemHTML(product) {
  return `
        <div id="cart-item-${product.id}" class="cart-item d-flex flex-row">
            <div class="cart-item-img"></div>
            <div class="cart-item-name">${product.name}</div>
            <div class="cart-item-price">${product.price_string}</div>
            <div class="cart-item-quantity">${product.quantity}</div>
            <div class="cart-item-total">${
              product.price * product.quantity
            } ${localStorage.getItem("currency")}</div>
        </div>
    `;
}

function addCartItem() {
  let cart = document.getElementById("cart-items");
  cart.innerHTML = "";
  cart.style.display = "flex";

  let empty_cart = document.getElementById("empty-cart");

  if (cart_products.length === 0) {
    empty_cart.style.display = "flex";
    return;
  }

  cart_products.forEach((product) =>
    cart.insertAdjacentHTML("beforeend", getCartItemHTML(product))
  );
}

function removeCartItems() {
  let cart = document.getElementById("cart-items");
  cart.innerHTML = "";
}

function updateCartProducts(res) {
  console.log(res);

  let added_product = res.data.cart.product;
  let i = cart_products.findIndex(
    (item) => item.product_id == added_product.product_id
  );
  i > -1
    ? (cart_products[i] = added_product)
    : cart_products.push(added_product);

  let quantity = cart_products.reduce(
    (acc, product) => acc + product.quantity,
    0
  );
  setCartCount(quantity);
}

function removeFromCartProducts(res, product_id) {
  let i = cart_products.findIndex((item) => item.product_id === product_id);

  if (i > -1) {
    cart_products.splice(i, 1);
  }

  let quantity = cart_products.reduce(
    (acc, product) => acc + product.quantity,
    0
  );
  setCartCount(quantity);
}

function productCartAddToCart(elm, product_id) {
  if (!$(".add-to-cart-progress", elm).hasClass("d-none")) return;

  $(".add-to-cart-progress", elm).removeClass("d-none");

  addToCart(product_id, 1, function () {
    $(".add-to-cart-progress", elm).addClass("d-none");

    if (elm) {
      var getParentDiv = $(elm).parent().parent();

      var image = $("#product-card-img-" + product_id, getParentDiv);
      var cart = $(".a-shopping-cart");

      addToCartAnimation(cart, image);
    }
  });
}

function addToCart(product_id, quantity, onCompleted) {
  zid.store.cart
    .addProduct({ productId: product_id, quantity: quantity })
    .then(function (response) {
      if (response.status === "success") {
        setCartTotalAndBadge(response.data.cart);

        if (onCompleted) {
          onCompleted();
        }
      } else {
        window.loadToasterScriptIfNotLoaded(function () {
          toastr.error(response.data.message);
        });
      }
    });
}

function removeFromCart(product_id) {
  product_id_str = product_id.replaceAll("-", "");
  let i = cart_products.findIndex((item) => item.product_id == product_id_str);

  zid.store.cart
    .removeProduct(cart_products[i].id)
    .then((res) => removeFromCartProducts(res, product_id_str))
    .catch((err) => setCartCount(0, true));
}

/*
    Initialize Cart
*/

/*
    mega-menu
*/
jQuery(document).on("click", ".mega-dropdown", function (e) {
  e.stopPropagation();
});

/*
 slider-filter
 */
$(function () {
  $("#slider-range").slider({
    range: true,
    min: 0,
    max: 500,
    values: [75, 300],
    slide: function (event, ui) {
      $("#amount").val("$" + ui.values[0] + " - $" + ui.values[1]);
    },
  });
  $("#amount").val(
    "$" +
      $("#slider-range").slider("values", 0) +
      " - $" +
      $("#slider-range").slider("values", 1)
  );
});

/*
 product-comment-twig show more show less
 */
$("#show-more-content").hide();

$("#show-more").click(function () {
  $("#show-more-content").show(500);
  $("#show-less").show();
  $("#show-more").hide();
});

$("#show-less").click(function () {
  $("#show-more-content").hide(500);
  $("#show-more").show();
  $(this).hide();
});

function displayActivePaymentSessionBar(cart) {
  if (cart.is_reserved) {
    $(".payment-session-bar").removeClass("d-none");
  }
}

function fetchCart() {
  zid.store.cart.fetch().then(function (response) {
    if (response.status === "success") {
      if (response.data) {
        setCartTotalAndBadge(response.data.cart);
        displayActivePaymentSessionBar(response.data.cart);
      }
    }
  });
}

function updateAndFetchCart() {
  zid.store.cart.fetch().then(function (response) {
    if (response.status === "success") {
      if (response.data) {
        updateCounterUI(response.data.cart?.products_count);
      }
    }
  });
}

function updateCounterUI(counter) {
  if (counter == 1) {
    document.querySelector(".cart-badge")?.classList.add("d-none");
  }
}

function getCartTotal(cart) {
  if (cart && cart.totals && cart.totals.length > 0) {
    var cartTotalItem = cart.totals.filter(function (total) {
      return total.code === "total";
    });

    if (cartTotalItem.length > 0) {
      return cartTotalItem[0].value_string;
    }
  }

  return null;
}

function setCartTotalAndBadge(cart) {
  setCartBadge(cart.products_count);
  var cartTotal = getCartTotal(cart);
  if (cartTotal) {
    setCartIconTotal(cartTotal);
  }
}

function setCartIconTotal(total) {
  $(".cart-header-total").html(total);
}

function setCartBadge(badge) {
  if (badge > 0) {
    $(".cart-badge").removeClass("d-none");
    $(".cart-badge").html(badge);
    showGiftCart();
  } else {
    $(".cart-badge").addClass("d-none");
  }
}

function showGiftCart() {
  if (location.pathname !== "/cart/view") {
    $("#tooltip").removeClass("d-none");
    setTimeout(() => {
      $("#tooltip").addClass("d-none");
    }, 3000);
  }
}

function closeSlidingMenu() {
  window.slidingMenu.close();
}

function clearFilters() {
  $(".form-products-filter input").val("");
  const cleanURL = window.location.origin + window.location.pathname;
  window.location.href = cleanURL;
}

// $('.sm-search-icon').click(function() {
//     $('.sm-search-div').toggleClass('show');
// });

function getPopularProduct() {
  zid.store.product
    .fetchAll(null, { per_page: 4, sort_by: encodeURI("popularity_order") })
    .then(function (response) {
      if (response.status === "success") {
        if (response.data) {
          createSearchResult(response.data.products.data);
        }
      }
    });
}

$(document).ready(function () {
  $(".sm-search-icon, .side-search-btn").click(function (event) {
    event.stopPropagation();
    $(".sm-search-div").toggleClass("show");

    if (!$(".sm-search-div").hasClass("show")) {
      $(".search-input-input").val("");
      getPopularProduct();
    }
  });

  $(document).on("click", function (event) {
    if (
      !$(event.target).closest(".sm-search-div").length &&
      !$(event.target).closest(".sm-search-icon").length &&
      !$(event.target).closest(".side-search-btn").length
    ) {
      $(".sm-search-div").removeClass("show");
      $(".search-input-input").val("");
      getPopularProduct();
    }
  });

  $("#search-close").on("click", function () {
    $(".sm-search-div").removeClass("show");
  });
});

$("#filters-form-collapse-sm").on("hidden.bs.collapse", function () {
  $(".filters_expanded").removeClass("d-none");
  $(".filters_not_expanded").addClass("d-none");
});

$("#filters-form-collapse-sm").on("shown.bs.collapse", function () {
  $(".filters_expanded").addClass("d-none");
  $(".filters_not_expanded").removeClass("d-none");
});

function getMenuPrev(elm) {
  if (!elm) return null;

  var EPrev = $(elm).prev();
  if (EPrev) {
    if (EPrev.hasClass("d-none")) {
      return getMenuPrev(EPrev);
    } else {
      return EPrev;
    }
  }

  return null;
}

function fixMenu(prevLiElm) {
  var listItems = $(".main-nav > li");

  listItems.each(function (idx, li) {
    if (idx > 3) {
      if (!$(li).hasClass("all-categories") && !$(li).hasClass("d-none")) {
        if ($(li).offset().top - $(li).parent().offset().top > 4) {
          $(li).addClass("d-none");
        } else {
          $(li).removeClass("d-none");
        }
      }
    }
  });

  var elmAllCat = $(".main-nav > li.all-categories");
  if ($(elmAllCat).length) {
    if ($(elmAllCat).offset().top - $(elmAllCat).parent().offset().top > 4) {
      var pElm = null;
      if (prevLiElm) {
        pElm = getMenuPrev(prevLiElm);
      } else {
        pElm = getMenuPrev(elmAllCat);
      }
      $(pElm).addClass("d-none");
      fixMenu(pElm);
    }
  }

  if (
    $(".main-nav").parent().outerWidth() - $(".main-nav").outerWidth() <
    100
  ) {
    $(".main-nav").addClass("justify-content-between");
  } else {
    $(".main-nav").removeClass("justify-content-between");
  }

  if ($(".main-nav-wrapper").length) {
    $(".main-nav-wrapper").removeClass("main-nav-wrapper");
  }
}

$(window).resize(function () {
  fixMenu();
});

$(".search-input-input").on("keyup", function (e) {
  if (e.key === "Enter" || e.keyCode === 13) {
    window.location.href = "/products?search=" + encodeURI(this.value);
  }
});

//$( document ).ready(function() {
document.addEventListener("DOMContentLoaded", function () {
  fetchCart();
  // productsQuestions.checkAddQuestionPossibility();

  /* mobile slide menu */
  window.slidingMenuElement = document.getElementById("sliding-menu");
  window.slidingMenu = new SlideMenu(window.slidingMenuElement, {
    position: window.appDirection === "ltr" ? "left" : "right",
    showBackLink: true,
    backLinkBefore:
      window.appDirection === "ltr"
        ? '<span class="icon-arrow_left slide-menu-arrow slide-menu-arrow-back"></span>'
        : '<span class="icon-arrow_right slide-menu-arrow slide-menu-arrow-back"></span>',
    submenuLinkAfter:
      window.appDirection === "ltr"
        ? '<span class="icon-arrow_right slide-menu-arrow"></span>'
        : '<span class="icon-arrow_left slide-menu-arrow"></span>',
  });

  window.slidingMenuElement.addEventListener("sm.open", function () {
    $("body").addClass("sidenav-open");
  });

  window.slidingMenuElement.addEventListener("sm.close", function () {
    $("body").removeClass("sidenav-open");
  });

  $(".search-input-input").on("input", function (event) {
    fetchProductsSearchDebounce(event.currentTarget);
  });

  /* mobile slide menu */
  fixMenu();

  menuFiixedHeader();
});

$(document).ready(function () {
  const query = $(".search-input-input").val();
  if (!query || query.trim().length === 0) {
    getPopularProduct();
  }
});

var fetchProductsSearchDebounce = debounce(function (target) {
  fetchProductsSearch($(target).attr("data-cat-id"), $(target).val());
}, 650);

function fetchProductsSearch(catId, query) {
  if (!query || query.trim().length <= 0) {
    zid.store.product
      .fetchAll(catId, { search: encodeURI(query) })
      .then(function (response) {
        if (response.status === "success") {
          if (response.data) {
            createSearchResult(response.data.products.data);
          }
        }
      });
    $(".autocomplete-items").html("");
    return;
  }

  zid.store.product
    .fetchAll(catId, { search: encodeURI(query) })
    .then(function (response) {
      if (response.status === "success") {
        if (response.data) {
          createSearchResult(response.data.products.data);
        }
      }
    });
}

function createSearchResult(products) {
  const offTextEle = document.querySelector("span.off-text");
  const popularTextEle = document.querySelector("span.popular-text");
  const productsTextEle = document.querySelector("span.products-text");
  const offText = offTextEle?.textContent || offTextEle?.innerText;
  const productsText =
    productsTextEle?.textContent || productsTextEle?.innerText;
  const popularText = popularTextEle?.textContent || popularTextEle?.innerText;
  const inputLength = $(".search-input-input").val().trim().length;
  const productsList = $(".search-product-result");
  let allProds = "";

  $(".search-suggestions, .search-history").addClass("d-none");
  $(".search-product-no-result").removeClass("d-flex");
  $(".search-result-title").removeClass("d-none");
  $(".search-product-result").addClass("d-none");
  $("#search-products-list").removeClass("d-none");

  if (products.length === 0) {
    $(".search-result-num-products-text .num").text("0");
    $(".search-product-no-result").addClass("d-flex");
    $(".search-product-no-result").removeClass("d-none");
    $(".search-product-result").addClass("d-none");
    $(".search-product-result").removeClass("d-flex");
  } else {
    $(".search-product-no-result").removeClass("d-flex");
    $(".search-product-no-result").addClass("d-none");
    $(".search-product-result").removeClass("d-none");
    $(".search-product-result").addClass("d-flex");

    products.forEach((product, index) => {
      const productImage =
        product.images?.[0]?.image?.large ||
        "{{ imageUrl(asset_url ~ 'product-img.svg', { w: 235, q: 100, f: 'auto' }) }}";
      const productDiscount = product.formatted_sale_price
        ? `<span class="product-card-discount">${product.discount_percentage}% ${offText}</span>`
        : "";

      const productPrice = product.formatted_sale_price
        ? `
                <div class="section-product-price d-flex gap-2 flex-row flex-wrap align-items-center justify-content-center" style="margin-bottom:5px" >
                  <span>${product.formatted_sale_price}</span>
                  <span class="product-prev-price">${product.formatted_price}</span>
                </div>
              `
        : `<div class="product-price section-product-price"  style="margin-bottom:5px"><span>${product.formatted_price}</span></div>`;

      const productButton =
        !product.is_infinite && product.quantity <= 0
          ? `
                <a class="product-card-button btn-product-card-out-of-stock " style="display:none" disabled>
                  <svg width="16" height="20" ...></svg>
                </a>
              `
          : product.has_options || product.has_fields
          ? `
                <a class="product-card-button btn-product-card-select-variant" style="display:none" href="/products/${product.slug}">
                  <svg width="25" height="24" ...></svg>
                </a>
              `
          : "";

      allProds += `
              <section class="c-product-item product-item ${
                !product.is_infinite && product.quantity <= 0
                  ? "product-item-out-of-stock"
                  : ""
              }" style="outline:1px solid black">
                <a href="/products/${
                  product.slug
                }" class="c-link d-flex flex-column justify-content-start" style="padding:0 !important;text-decoration:none;font-size:16px;font-weight:500">
                  <div class="product-card-image product-card-image-search">
                    <img id="product-card-img-${product.id}" alt="${
        product.name
      }" src="${productImage}" />
                    <span class="product-card-bundle-offer" data-bundle-offer-product-id="${
                      product.id
                    }"></span>
                    ${productDiscount}
                  </div>
                  <div class="c-product-info  p-lg-3 pt-0 d-grid align-content-between flex-grow-1">
                    <h4 class="product-card-title"><span>${
                      product.name
                    }</span></h4>
                    <div class="d-flex align-items-center justify-content-center gap-1" style="max-width:95%;margin-top: auto;text-wrap:nowrap">
                      ${productPrice}
                      ${
                        productButton
                          ? `<span style="max-height:34px">${productButton}</span>`
                          : ""
                      }
                    </div>
                  </div>
                </a>
              </section>
            `;
    });
    productsList.html(allProds);
  }
  if (inputLength === 0) {
    $(".search-result-num-products-text").text(`${popularText}`);
  } else {
    $(".search-result-num-products-text").text(
      `${products.length} ${productsText}`
    );
  }
}

function debounce(func, wait, immediate) {
  var timeout;
  return function () {
    var context = this,
      args = arguments;
    var later = function () {
      timeout = null;
      if (!immediate) func.apply(context, args);
    };
    var callNow = immediate && !timeout;
    clearTimeout(timeout);
    timeout = setTimeout(later, wait);
    if (callNow) func.apply(context, args);
  };
}

function sessionLangCurrencyChange() {
  var currency = $(".select-country option:selected").attr("data-currency");
  var currencySymbol = $(".select-country option:selected").attr(
    "data-currency-symbol"
  );

  $("#input-change-session-currency").val(currency);
  $("#input-change-session-currency-symbol").val(currencySymbol);
}

function addToCartAnimation(cart, imgtodrag) {
  if (imgtodrag && cart) {
    var imgclone = imgtodrag
      .clone()
      .offset({
        top: imgtodrag.offset().top,
        left: imgtodrag.offset().left,
      })
      .css({
        opacity: "0.5",
        position: "absolute",
        height: "150px",
        width: "150px",
        "z-index": "100",
      })
      .appendTo($("body"))
      .animate(
        {
          top: cart.offset().top + 10,
          left: cart.offset().left + 10,
          width: 75,
          height: 75,
        },
        1000,
        "easeInOutExpo"
      );

    imgclone.animate(
      {
        width: 0,
        height: 0,
      },
      function () {
        $(this).detach();
      }
    );
  }
}

function goBack() {
  if (
    document.referrer &&
    document.referrer.split("/")[2] === window.location.host
  ) {
    history.go(-1);
    return false;
  } else {
    window.location.href = "/";
  }
}

function scrollToSubMenu(ele) {
  const subMenuElement = ele.querySelector("ul");
  if (subMenuElement) {
    const subMenu = document.getElementById("sliding-menu");
    subMenu.scrollTop = 0;
  }
}

// class ProductsQuestions {
//   constructor() {
//     this.emailRegex = /^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,6}$/;
//     // this.customer = window.customer;
//     this.customerName = $('#addProductQuestionModal input[name="name"]');
//     this.customerEmail = $('#addProductQuestionModal input[name="email"]');
//     this.customerQuestion = $(
//       '#addProductQuestionModal textarea[name="question"]'
//     );
//     this.isAnonymous = $('#addProductQuestionModal input[name="is_anonymous"]');
//     this.submitButton = $(".btn-submit-new-question");
//   }

//   isValidEmail() {
//     return this.emailRegex.test(this.customerEmail.val());
//   }

//   showError(inputName) {
//     $(`#addProductQuestionModal .input-error-${inputName}`).removeClass(
//       "d-none"
//     );
//     $(
//       `#addProductQuestionModal input[name="${inputName}"], textarea[name="${inputName}"]`
//     ).addClass("border-danger");
//   }

//   hideError(inputName) {
//     $(`#addProductQuestionModal .input-error-${inputName}`).addClass("d-none");
//     $(
//       `#addProductQuestionModal input[name="${inputName}"], textarea[name="${inputName}"]`
//     ).removeClass("border-danger");
//   }

//   validateInputs() {
//     let isValid = true;

//     if (!this.customerQuestion.val().length) {
//       this.showError("question");
//       isValid = false;
//     } else {
//       this.hideError("question");
//     }

//     if (!this.customerEmail.val().length) {
//       this.showError("email");
//       isValid = false;
//     } else {
//       this.hideError("email");
//     }

//     if (this.customerEmail.val().length && !this.isValidEmail()) {
//       $("#addProductQuestionModal .input-error-invalid-email").removeClass(
//         "d-none"
//       );
//       $('#addProductQuestionModal input[name="email"]').addClass(
//         "border-danger"
//       );
//       isValid = false;
//     } else {
//       $("#addProductQuestionModal .input-error-invalid-email").addClass(
//         "d-none"
//       );
//     }

//     if (!this.customerName.val().length) {
//       this.showError("name");
//       isValid = false;
//     } else {
//       this.hideError("name");
//     }

//     return isValid;
//   }

//   // fillCustomerData() {
//   //   if (this.customer && this.customer.name && this.customer.email) {
//   //     if (!this.customerName.val()) this.customerName.val(this.customer.name);
//   //     if (!this.customerEmail.val())
//   //       this.customerEmail.val(this.customer.email);
//   //   }
//   // }

//   // checkAddQuestionPossibility() {
//   //   $("#addQuestionButton").click(function () {
//   //     if (window.customer) {
//   //       $("#addProductQuestionModal").modal("show");
//   //       productsQuestions.fillCustomerData();
//   //     } else {
//   //       const currentPathname = location.pathname;
//   //       const params = location.search;
//   //       location.href = `/auth/login?redirect_to=${encodeURIComponent(
//   //         currentPathname + params
//   //       )}`;
//   //       return;
//   //     }
//   //   });
//   // }

//   async submitQuestion(productId) {
//     const isValid = this.validateInputs();

//     if (isValid) {
//       $(".add-review-progress").removeClass("d-none");
//       this.submitButton.attr("disabled", true);

//       try {
//         const response = await zid.store.product.addQuestion(
//           productId,
//           this.customerQuestion.val(),
//           this.customerName.val(),
//           this.customerEmail.val(),
//           this.isAnonymous.is(":checked")
//         );

//         if (response.status === "success") {
//           toastr.success(
//             locales_messages.success,
//             locales_messages.success_header
//           );

//           $('textarea[name="question"]').val("");
//         }
//       } catch (error) {
//         console.log(error);
//         toastr.error(error, locales_messages.error);
//       } finally {
//         $(".add-review-progress").addClass("d-none");

//         $("#addProductQuestionModal").modal("hide");
//         this.submitButton.removeAttr("disabled");
//       }
//     }
//   }
// }

function fillWishlistItems(items) {
  items.forEach((product) => {
    $(`.add-to-wishlist[data-wishlist-id=${product.id}]`)
      .find(".icon-heart-mask")
      .addClass("filled");
  });
}

function handleWishlistState() {
  let customerElements = document.querySelectorAll(".zid-customer");
  let guestElements = document.querySelectorAll(".zid-guest");
  let wishlistContainers = document.querySelectorAll(".add-to-wishlist");

  if (customer) {
    wishlistContainers.forEach((wishlistContainer) => {
      wishlistContainer.classList.remove("d-none");
    });

    customerElements.forEach((el) => (el.style.display = "block"));
    guestElements.forEach((el) => (el.style.display = "none"));

    let wishlist = customer.wishlist || [];

    customerElements.forEach((el) => {
      const visibleWishlist = el.querySelector("[visible-wishlist]");
      const hiddenWishlist = el.querySelector("[hidden-wishlist]");

      if (!visibleWishlist || !hiddenWishlist) return;

      let visibleWishlistId = visibleWishlist.getAttribute("visible-wishlist");

      if (visibleWishlistId && wishlist.includes(visibleWishlistId)) {
        visibleWishlist.style.setProperty("display", "inline-block");
        hiddenWishlist.style.setProperty("display", "none");
      } else {
        hiddenWishlist.style.setProperty("display", "inline-block");
        visibleWishlist.style.setProperty("display", "none");
      }
    });
  } else {
    wishlistContainers.forEach((wishlistContainer) => {
      wishlistContainer.classList.remove("d-none");
    });

    customerElements.forEach((el) => (el.style.display = "none"));
    guestElements.forEach((el) => (el.style.display = "block"));
  }
}

function addToWishlist(elm, productId) {
  const loader = $(`.heart-loader-${productId}`);
  loader.removeClass("d-none");
  $(elm).addClass("d-none");

  // Remove From Wishlist if added
  if ($(elm).hasClass("filled")) {
    loader.addClass("d-none");
    return removeFromWishlist(elm, productId);
  }

  zid.store.customer.addToWishlist(productId).then((response) => {
    if (response.status === "success") {
      loader.addClass("d-none");
      $(elm).addClass("filled").removeClass("d-none");

      toastr.success(response.data.message);
    } else {
      toastr.error(response.data.message);
    }
  });
}

function removeFromWishlist(elm, productId) {
  const loader = $(`.heart-loader-${productId}`);
  loader.removeClass("d-none");
  $(elm).addClass("d-none");
  zid.store.customer.removeFromWishlist(productId).then((response) => {
    if (response.status === "success") {
      loader.addClass("d-none");
      $(elm).removeClass("d-none filled");

      toastr.success(response.data.message);

      if (location.pathname === "/account-wishlist") {
        location.reload();
      }
    } else {
      toastr.error(response.data.message);
    }
  });
}

function shareWishlist() {
  $(".share-wishlist .heart-loader")
    .removeClass("d-none")
    .siblings(".share-icon")
    .addClass("d-none");
  zid.store.customer.shareWishlist().then(async (response) => {
    if (response.status === "success") {
      $(".share-wishlist .heart-loader")
        .addClass("d-none")
        .siblings(".share-icon")
        .removeClass("d-none");

      if (response.data.link) {
        try {
          await navigator.clipboard.writeText(response.data.link);
          toastr.success(response.data.message);
        } catch (error) {
          console.log(error);
        }
      }
    } else {
      toastr.error(response.data.message);
    }
  });
}

function isArabicLang() {
  const lang = document.documentElement.lang || "en";
  return lang.startsWith("ar");
}
// const productsQuestions = new ProductsQuestions();

//handle product list view

function listView(isCat = false) {
  const productItems = document.querySelectorAll(".product-item");
  let productsList;
  if (isCat) {
    productsList = document.querySelector(".grid-border-container");
  } else {
    productsList = document.querySelector("#products-list");
  }

  gridButton.classList.remove("active");
  listButton.classList.add("active");
  productsList.classList.remove("grid-view");
  isGridView = false;

  productItems.forEach((item) => {
    const badge = item.querySelector(".badge-name");
    const productTitle = item.querySelector(".product-title");
    const productPrice = item.querySelector(".product-price");
    const productPrevPrice = item.querySelector(".product-prev-price");
    const outOfStock = item.querySelector(".btn-product-card-out-of-stock");
    const badgeDiscount = item.querySelector(".badge-discount");
    const addToWishlist = item.querySelector(".add-to-wishlist");
    const price_discount = item.querySelector(".price-discount");
    const box = item.querySelector(".box-product-section .content div");
    const box_2 = item.querySelector(".box-product-section");
    const price_container = item.querySelector(".c-price-container");

    if (price_container) {
      price_container.style.marginBottom = "24px";
    }

    if (badge) {
      badge.classList.remove("grid-view");
    }

    if (price_discount) {
      price_discount.classList.remove("grid-view");
    }

    if (productPrevPrice) {
      productPrevPrice.classList.remove("grid-view");
    }

    if (productTitle) {
      productTitle.classList.remove("grid-view");
    }

    if (productPrice) {
      productPrice.classList.remove("grid-view");
    }

    if (outOfStock) {
      outOfStock.classList.remove("grid-view");
    }

    if (box) {
      box.classList.remove("grid-view");
    }
    if (box_2) {
      box_2.classList.remove("grid-view");
    }
    if (addToWishlist) {
      addToWishlist.classList.remove("grid-view");
    }
  });
}
function gridView(isCat = false) {
  const productItems = document.querySelectorAll(".product-item");
  let productsList;
  if (isCat) {
    productsList = document.querySelector(".grid-border-container");
  } else {
    productsList = document.querySelector("#products-list");
  }

  isGridView = true;
  gridButton.classList.add("active");
  listButton.classList.remove("active");
  productsList.classList.add("grid-view");

  productItems.forEach((item) => {
    const badge = item.querySelector(".badge-name");
    const productTitle = item.querySelector(".product-title");
    const productPrice = item.querySelector(".product-price");
    const productPrevPrice = item.querySelector(".product-prev-price");
    const outOfStock = item.querySelector(".btn-product-card-out-of-stock");
    const badgeDiscount = item.querySelector(".badge-discount");
    const addToWishlist = item.querySelector(".add-to-wishlist");
    const price_discount = item.querySelector(".price-discount");

    const box = item.querySelector(".box-product-section .content div");
    const box_2 = item.querySelector(".box-product-section");

    const price_container = item.querySelector(".c-price-container");

    if (price_container) {
      price_container.style.marginBottom = "12px";
      price_container.style.paddingInline = "5px";
    }

    if (badge) {
      badge.classList.add("grid-view");
    }

    if (price_discount) {
      price_discount.classList.add("grid-view");
    }

    if (productPrevPrice) {
      productPrevPrice.classList.add("grid-view");
    }

    if (productTitle) {
      productTitle.classList.add("grid-view");
    }

    if (productPrice) {
      productPrice.classList.add("grid-view");
    }

    if (outOfStock) {
      outOfStock.classList.add("grid-view");
    }

    if (box) {
      box.classList.add("grid-view");
    }
    if (box_2) {
      box_2.classList.add("grid-view");
    }
    if (addToWishlist) {
      addToWishlist.classList.add("grid-view");
    }
  });
}

function isNumber(value) {
  return !isNaN(value) && typeof value === "number";
}