// main script
(function () {
  "use strict";

  // Dropdown Menu Toggler For Mobile
  // ----------------------------------------
  const dropdownMenuToggler = document.querySelectorAll(
    ".nav-dropdown > .nav-link",
  );

  dropdownMenuToggler.forEach((toggler) => {
    toggler?.addEventListener("click", (e) => {
      e.target.closest('.nav-item').classList.toggle("active");
    });
  });

  // Testimonial Slider
  // ----------------------------------------
  new Swiper(".testimonial-slider", {
    spaceBetween: 24,
    loop: true,
    pagination: {
      el: ".testimonial-slider-pagination",
      type: "bullets",
      clickable: true,
    },
    breakpoints: {
      768: {
        slidesPerView: 2,
      },
      992: {
        slidesPerView: 3,
      },
    },
  });


  // modals 
  function toggle_modal(target, show) {
    target.classList.toggle("hidden", !show);
    body.classList.toggle("overflow-hidden", show);
    body.setAttribute("modal", show ? target.id : "");
  }

  const body = document.querySelector("body");
  const show_modal_buttons = document.querySelectorAll("[data-modal-show]");
  show_modal_buttons.forEach((btn) => {
    const target = btn.getAttribute('data-modal-show');
    const modal = document.querySelector(`#${target}`);
    if (modal) {
      btn.addEventListener("click", (e) => {
        toggle_modal(modal, true);
      });
    }
  });

  const hide_modal_buttons = document.querySelectorAll("[data-modal-hide]");
  hide_modal_buttons.forEach((btn) => {
    const target = btn.getAttribute('data-modal-hide');
    const modal = document.querySelector(`#${target}`);
    if (modal) {
      btn.addEventListener("click", (e) => {
        toggle_modal(modal, false);
      });
    }
  });

  const modal_bg = document.querySelectorAll(".modal-bg");
  modal_bg.forEach((bg) => {
    bg.addEventListener("click", (e) => {
      if (e.target === bg) {
        toggle_modal(bg, false);
      }
    });
  });

  document.addEventListener("keydown", (e) => {
    if (e.key === "Escape") {
      var modal_id = body.getAttribute("modal");
      if(modal_id) toggle_modal(document.querySelector(`#${modal_id}`), false);
    }
  });

  // Swipers
  // ----------------------------------------
  const swipers = document.querySelectorAll(".swiper-slider");

  swipers.forEach((swiper) => {
    new Swiper(swiper, {
      spaceBetween: 24,
      loop: true,
      pagination: {
        el: swiper.querySelector(".swiper-slider-pagination"),
        type: "bullets",
        clickable: true,
      },
      navigation: {
        nextEl: swiper.querySelector(".swiper-button-next"),
        prevEl: swiper.querySelector(".swiper-button-prev"),
      },
      breakpoints: {
        768: {
          slidesPerView: 2,
        },
        992: {
          slidesPerView: 3,
        },
      },
    });
  });
})();

// c > js -devon