"use strict";

(function ($) {
  $("document").ready(function () {
    if (window.Swiper == null) {
      return;
    }

    function resizeNavigation() {
      $(
        ".brandy-product-collection-slider:not(.block-editor-block-list__block, .brandy-product-collection-custom-slider)"
      ).each((_, $swiper) => {
        const $image = $($swiper).find(
          '[data-block-name="woocommerce/product-image"]'
        );
        if ($image.length < 1) {
          return;
        }
        const button = $($swiper).find(".brandy-swiper-navigation-button");

        if (button.length < 1) {
          return;
        }

        const swiperOffset = $($swiper).offset();
        const imageOffset = $($image).offset();
        const imageHeight = $($image).height();
        const buttonHeight = $(button).height();
        const distanceFromImageAndSwiper = Math.max(
          imageOffset.top - swiperOffset.top,
          0
        );
        const centerY =
          distanceFromImageAndSwiper + imageHeight / 2 + buttonHeight / 2;
        button.css("top", centerY);
      });
    }

    const defaultConfig = {
      direction: "horizontal",
      slidesPerView: 4,
      spaceBetween: 30,
    };

    const swiperConfig =
      window.brandyData?.blocks_data["woocommerce/product-collection"]?.swiper;

    const backIcon =
      swiperConfig?.backIcon ??
      window.brandyData?.swiper?.backIcon ??
      '<svg width="7" height="12" viewBox="0 0 7 12" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M1 1L6 6L1 11" stroke="#D3DCE5" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg>';
    const nextIcon =
      swiperConfig?.nextIcon ??
      window.brandyData?.swiper?.nextIcon ??
      '<svg width="7" height="12" viewBox="0 0 7 12" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M1 1L6 6L1 11" stroke="#D3DCE5" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg>';

    $(document).ready(function () {
      $(
        ".brandy-product-collection-slider:not(.block-editor-block-list__block, .brandy-product-collection-custom-slider)"
      ).addClass("swiper");
      $(
        ".brandy-product-collection-slider:not(.block-editor-block-list__block, .brandy-product-collection-custom-slider) .brandy-site-product-template"
      ).addClass("swiper-wrapper");
      $(
        ".brandy-product-collection-slider:not(.block-editor-block-list__block, .brandy-product-collection-custom-slider) .brandy-site-product-template > .product"
      ).addClass("swiper-slide");
      $(
        ".brandy-product-collection-slider:not(.block-editor-block-list__block, .brandy-product-collection-custom-slider)"
      ).append(`
		<div class="brandy-product-collection-slider-navigation brandy-swiper-navigation">
				<span class="brandy-swiper-navigation-button brandy-swiper-navigation-button--back">${backIcon}</span>
				<span class="brandy-swiper-navigation-button brandy-swiper-navigation-button--next">${nextIcon}</span>
			</div>
      `);

      $(
        ".brandy-product-collection-slider:not(.block-editor-block-list__block, .brandy-product-collection-custom-slider)"
      ).append(`
		<div class="brandy-product-collection-slider-scrollbar swiper-scrollbar brandy-swiper-scrollbar"></div>
      `);
      setTimeout(() => {
        new Swiper(
          ".brandy-product-collection-slider:not(.block-editor-block-list__block, .brandy-product-collection-custom-slider)",
          {
            navigation: {
              nextEl: ".brandy-swiper-navigation-button--next",
              prevEl: ".brandy-swiper-navigation-button--back",
            },
            scrollbar: {
              el: ".brandy-swiper-scrollbar",
              draggable: true,
              placement: "outside",
              snapOnRelease: true,
            },
            grabCursor: true,
            ...defaultConfig,
            ...(swiperConfig?.data ?? {}),
          }
        );
        resizeNavigation();
      }, 1);
    });

    $(window).on("resize", function () {
      setTimeout(() => {
        resizeNavigation();
      }, 1);
    });
  });
})(window.jQuery);