webshop/static/dist/product-WJ64SBTW.js

// static/js/cart.js
async function updateCart(form) {
  const formData = new FormData(form);
  const res = await fetch("/checkout?js=true", {
    method: "POST",
    body: formData
  });
  if (res.ok) {
    return res.json();
  } else {
    return { status: res.status, error: res.statusText };
  }
}
function updateCartIcon(data) {
  const cart_icon = document.querySelector(".cart-icon");
  if (cart_icon.length !== null) {
    let cart_icon_amount_list = cart_icon.querySelector(".cart-icon--amount");
    if (cart_icon_amount_list.length !== null) {
      cart_icon_amount_list.innerText = data.cart_breakdown.item_amount;
    }
    cart_icon.dataset.status = "busy";
    cart_icon.style.color = "#FF7070";
    cart_icon.style.textDecorationColor = "#FF7070";
    setTimeout(() => {
      cart_icon.dataset.status = "free";
      cart_icon.style.color = "#fff";
      cart_icon.style.textDecorationColor = "#fff";
    }, "2000");
  }
}
function displayProductSelectable(btnSubmit, isProductSelectable, isProductAvailable) {
  console.log("displayProductSelectable called with:", { isProductSelectable, isProductAvailable, btnSubmit, value: btnSubmit && btnSubmit.value });
  if (!btnSubmit) {
    return;
  }
  btnSubmit.classList.remove(
    "btn-product-available",
    "btn-product-unselectable",
    "btn-product-soldout"
  );
  if (!isProductAvailable || !isProductSelectable) {
    btnSubmit.setAttribute("disabled", "disabled");
    btnSubmit.classList.add("btn-product-soldout");
    btnSubmit.value = "sold out";
  } else {
    btnSubmit.removeAttribute("disabled");
    btnSubmit.classList.add("btn-product-available");
    btnSubmit.value = "add to cart";
  }
}
function updateProductURL(product_selected) {
  if ("URLSearchParams" in window) {
    const searchParams = new URLSearchParams(product_selected);
    history.pushState(null, "", "?".concat(searchParams.toString()));
  }
}

// static/js/product.js
async function processForm(form) {
  form.addEventListener("submit", async (e) => {
    e.preventDefault();
    const data = await updateCart(form);
    console.log("AJAX response from /checkout:", data);
    updateCartIcon(data);
    const btnSubmit = form.querySelector(".btn-submit");
    const isProductSelectable = data.is_product_selectable;
    const isProductAvailable = data.is_product_available;
    displayProductSelectable(btnSubmit, isProductSelectable, isProductAvailable);
    console.log("displayProductSelectable called with:", isProductSelectable, isProductAvailable);
    updateProductURL(data.product_selected);
  });
}
async function checkProductAvailability(product_path, searchParams) {
  const res = await fetch("/".concat(product_path, "?js=true&").concat(searchParams.toString()));
  if (res.ok) {
    return res.json();
  } else {
    return { status: res.status, error: res.statusText };
  }
}
async function changeProductURLOnInputRadio(form) {
  const inputs = Array.from(form.querySelectorAll(".input-listen"));
  await Promise.all(inputs.map(async (input) => {
    input.addEventListener("change", async (e) => {
      let key = e.target.name;
      let value = e.target.value;
      if ("URLSearchParams" in window) {
        const product_path = form.querySelector("#product_path").value;
        const searchParams = new URLSearchParams(window.location.search);
        searchParams.set(key, value);
        let size = searchParams.get("size");
        let style = searchParams.get("style");
        if (size || style) {
          const data = await checkProductAvailability(product_path, searchParams);
          const btnSubmit = form.querySelector(".btn-submit");
          const isProductSelectable = data.is_product_selectable;
          const isProductAvailable = data.is_product_available;
          displayProductSelectable(btnSubmit, isProductSelectable, isProductAvailable);
        }
        history.pushState(null, "", "?".concat(searchParams.toString()));
      }
      ;
    });
  }));
}
window.addEventListener("load", () => {
  ;
  (async () => {
    const forms = Array.from(document.querySelectorAll(".product-item"));
    await Promise.all(forms.map(async (form) => {
      processForm(form);
      changeProductURLOnInputRadio(form);
    }));
  })();
});