//Alpinejs Section
document.addEventListener("alpine:init", () => 
    {
        Alpine.data("provinsi",()=>({
          open:false,
          search:'',
          items: [],
          init(){
            fetch('districts-data')
                  .then(response => response.json())
                  .then(data => this.items = data)
          },
          get searchResults () {
              if(this.search.length > 2){
                  const filterItems = this.items.filter((item) => {
                      return item.name.toLowerCase().includes(this.search.toLowerCase())
                  })
    
                  if(filterItems.length < this.items.length && filterItems.length > 0) {
                      this.open = true
                      return filterItems
                  }
              }
          },
        }));
    
    }
);

//Javascript Section
// form validation
/*
const checkoutButton = document.querySelector("#checkout-button");
checkoutButton.disabled = true;
const codButton = document.querySelector("#cod-button");
codButton.disabled = true;
*/

/*
const form = document.querySelector("#checkoutForm");

form.addEventListener("keyup", function () {
  for (let i = 0; i < form.elements.length; i++) {
    if (form.elements[i].value.length !== 0) {
      checkoutButton.classList.remove("disabled");
      checkoutButton.classList.add("disabled");
      codButton.classList.remove("disabled");
      codButton.classList.add("disabled");
    } else {
      return false;
    }
  }

  checkoutButton.disabled = false;
  checkoutButton.classList.remove("disabled");
  codButton.disabled = false;
  codButton.classList.remove("disabled");
});

// kirim data ketika tombol checkout diklik
checkoutButton.addEventListener("click", async function (e) {
    e.preventDefault();

    const formData = new FormData(form);
    const data = new URLSearchParams(formData);

    //minta transaction token menggunakan ajax / fetch
    try {
        const response = await fetch("place-order", {
            method: "POST",
            body: data,
        });
    
        const token = await response.text();
        //console.log(token);
        window.snap.pay(token);
        
    } catch (err) {
        console.log(err.message);
    }
   
});

// kirim data ketika tombol COD diklik
codButton.addEventListener("click", async function (e) {
    e.preventDefault();
    
    if(confirm("Pesanan COD Anda segera kami proses!")){
        const formData = new FormData(form);
        const data = new URLSearchParams(formData);
    
        //minta transaction token menggunakan ajax / fetch
        try {
            const response = await fetch("place-cod", {
                method: "POST",
                body: data,
            });
        
            const result = await response.text();
            //console.log(result);
            window.location.href = "/";
        } catch (err) {
            console.log(err.message);
        }
    }
});

//konversi ke rupiah
const rupiah = (number) => {
  return new Intl.NumberFormat("id-ID", {
    style: "currency",
    currency: "IDR",
    minimumFractionDigits: 0,
  }).format(number);
};
*/