$(document).ready(function () {
  // GLOBAL CALL
  globalHandler();

  // PAGE CALL

  homepageHandler();

  categoryHandler();

});


// 
function globalHandler() {
  mmenuHandler();
  headerFixedScroll();
  arccodionHandler();

  swiperSectionBoxBottom();
}

// 
function headerFixedScroll() {
  $(window).scroll(function () {
    let distanceFromTop = $(document).scrollTop();
    const global_header = $(".global-header");

    if (distanceFromTop > 50) {
      global_header.addClass("fixed");
    } else {
      global_header.removeClass("fixed");
    }
  });
}

// MMENU HANDLER
function mmenuHandler() {
  $('#menu').mmenu();
  setTimeout(function () {
    $('#menu').removeClass("d-none");
  }, 500)
  $('.mm-navbar .mm-navbar__title').html('Danh mục').attr('href', 'javascript:;');
}

// FOOTER ARC
function arccodionHandler() {
  const arccodionItems = document.querySelectorAll(".accordion");

  if (arccodionItems.length > 0) {
    arccodionItems.forEach((acc) => {
      acc.addEventListener("click", function () {
        const nextEl = this.nextElementSibling;
        const childEl = this.firstElementChild;

        if (nextEl.style.maxHeight) {
          nextEl.style.maxHeight = null;
          childEl.style.transform = "translateY(-50%) rotate(0)";
        } else {
          nextEl.style.maxHeight = nextEl.scrollHeight + "px";
          childEl.style.transform = "translateY(-50%) rotate(90deg)";
        }
      });
    });
  }
}

// 
function fadeToggle(target) {
  $(target).fadeToggle();
}

// 
function swiperSectionBoxBottom() {
  new Swiper(".swiper-section-box-bottom", {
    slidesPerView: 2,
    spaceBetween: 10,
    rewind: true,
    speed: 1000,
    autoplay: {
      delay: 2500,
      disableOnInteraction: false,
      pauseOnMouseEnter: "true",
    },
    breakpoints: {
      577: {
        slidesPerView: 3,
        spaceBetween: 12,
      },
      769: {
        slidesPerView: 4,
        spaceBetween: 16,
      },
    },
  });
}

// 
function homepageHandler() {
  swiperSectionHero()
}

function swiperSectionHero() {
  new Swiper(".swiper-section-hero", {
    slidesPerView: 1,
    spaceBetween: 0,
    rewind: true,
    speed: 1000,
    autoplay: {
      delay: 2500,
      disableOnInteraction: false,
      pauseOnMouseEnter: "true",
    },
  });
}

//
function categoryHandler() {

}

// 
function productDetailHandler() {

}

let galleryThumbs = new Swiper(".gallery-thumbs", {
  spaceBetween: 4,
  slidesPerView: 4,
  slideToClickedSlide: true,
  freeMode: true,
  watchSlidesProgress: true,
  centerInsufficientSlides: true,
  breakpoints: {
    577: {
      slidesPerView: 6,
    },
  },
});

let galleryTop = new Swiper(".gallery-top", {
  spaceBetween: 0,
  slidesPerView: 1,
  speed: 1000,
  autoplay: {
    delay: 2500,
    disableOnInteraction: false,
    pauseOnMouseEnter: "true",
  },
  navigation: {
    nextEl: ".swiper-button-next",
    prevEl: ".swiper-button-prev",
  },
  thumbs: {
    swiper: galleryThumbs,
  },
  // AUTO SILDED AT FISRT AND END
  on: {
    slideChange: function () {
      let activeIndex = this.activeIndex + 1;

      let activeSlide = document.querySelector(
        `.gallery-thumbs .swiper-slide:nth-child(${activeIndex})`
      );
      let nextSlide = document.querySelector(
        `.gallery-thumbs .swiper-slide:nth-child(${activeIndex + 1})`
      );
      let prevSlide = document.querySelector(
        `.gallery-thumbs .swiper-slide:nth-child(${activeIndex - 1})`
      );

      if (
        nextSlide &&
        !nextSlide.classList.contains("swiper-slide-visible")
      ) {
        this.thumbs.swiper.slideNext();
      } else if (
        prevSlide &&
        !prevSlide.classList.contains("swiper-slide-visible")
      ) {
        this.thumbs.swiper.slidePrev();
      }
    },
  },
});

$('[data-fancybox="gallery"]').fancybox({
  thumbs: {
    autoStart: true
  }
});