https://www.accuenergy.com/wp-content/themes/stratusx-child/page-assets/js/pages/product-support-documents.js

1jQuery("document").ready(function ($) {
2  $("#default_open").trigger("click");
3  let catalog_swiper;
4
5  function initCatalogSwiper() {
6    catalog_swiper = new Swiper(".document-catalogs-sub-menu .swiper", {
7      spaceBetween: 0,
8      pagination: {
9        el: ".swiper-pagination",
10        clickable: false,
11      },
12      // Responsive breakpoints
13      breakpoints: {
14        // when window width is >= 0
15        0: {
16          slidesPerGroup: 1,
17          slidesPerView: 1,
18          touchRatio: 1,
19        },
20        // when window width is >= 300px
21        300: {
22          slidesPerGroup: 2,
23          slidesPerView: 2,
24          touchRatio: 1,
25        },
26        // when window width is >= 344px
27        344: {
28          slidesPerGroup: 3,
29          slidesPerView: 3,
30          touchRatio: 1,
31        },
32        // when window width is >= 768px
33        768: {
34          slidesPerGroup: 4,
35          slidesPerView: 4,
36          touchRatio: 1,
37        },
38        // when window width is >= 991px
39        991: {
40          slidesPerView: $(".document-catalogs-sub-menu .swiper .swiper-slide")
41            .length,
42          touchRatio: 0,
43        },
44      },
45    });
46
47    // Set the initial active catalog based on the breakpoint
48    catalog_swiper.on("breakpoint", function () {
49      let $activeCatalog = $(".document-catalogs-sub-menu .catalog.active-des");
50      let activeIndex = $(".document-catalogs-sub-menu .catalog").index(
51        $activeCatalog
52      );
53
54      setTimeout(() => {
55        catalog_swiper.slideTo(activeIndex); // Move to active slide
56      }, 100);
57    });
58  }
59
60  initCatalogSwiper();
61
62  // Set the active catalog based on the index
63  function setActiveCatalog(index) {
64    // desktop menu
65    $(".document-catalogs-sub-menu .catalog").removeClass("active-des");
66    $(".document-catalogs-sub-menu .catalog").eq(index).addClass("active-des");
67
68    // desktop content
69    $(".document-files .doc-file-sec").addClass("sec-deactive");
70    $(".document-files .doc-file-sec").eq(index).removeClass("sec-deactive");
71  }
72
73  // when the user clicks on a catalog
74  $(".document-catalogs-sub-menu .catalog").on("click", function () {
75    let index = $(this).data("menu-idx");
76    setActiveCatalog(index);
77
78    // only for mobile
79    if (window.innerWidth < 991) {
80      const $documents = $(".acu-sup-document");
81      $("html, body").animate(
82        {
83          scrollTop: $documents.offset().top,
84        },
85        400
86      );
87    }
88  });
89
90  // handle the sticky catalog menu
91  let stickyOffset = $(".sticky").offset().top;
92  $(window).scroll(function () {
93    let sticky = $(".sticky"),
94      scroll = $(window).scrollTop();
95
96    if (scroll >= stickyOffset) sticky.addClass("fixed");
97    else sticky.removeClass("fixed");
98  });
99});