https://www.metalocus.es/themes/custom/paltana/components/02_molecules/slider/slider.js?tltbuk

1let swiperInstance = {};
2
3(function (Drupal, once) {
4  Drupal.behaviors.slider = {
5    attach: function (context, settings) {
6      once('slider', '.swiper .swiper-container', context).forEach(el => {
7        let slidesPerViewMobile = 1;
8        let slidesPerViewTablet = 1;
9        let slidesPerViewDesktop = 1;
10        let spaceBetween = 30;
11        let loop = true;
12        let effect = 'slide';
13        let autoplay = false;
14        let slider_id = '';
15        let activeIndex = 0;
16        if (el.parentNode.parentNode.dataset.slider !== undefined) {
17          const sliderConf = JSON.parse(el.parentNode.parentNode.dataset.slider);
18          if(sliderConf.slider_id !== undefined) {
19            slider_id = sliderConf.slider_id;
20          }
21          if (sliderConf.slider_slides_per_view_mobile !== undefined) {
22            slidesPerViewMobile = sliderConf.slider_slides_per_view_mobile;
23          }
24          if (sliderConf.slider_slides_per_view_tablet !== undefined) {
25            slidesPerViewTablet = sliderConf.slider_slides_per_view_tablet;
26          }
27          if (sliderConf.slider_slides_per_view_desktop !== undefined) {
28            slidesPerViewDesktop = sliderConf.slider_slides_per_view_desktop;
29          }
30          if (sliderConf.slider_gap !== undefined) {
31            spaceBetween = sliderConf.slider_gap;
32          }
33          if (sliderConf.loop !== undefined) {
34            loop = sliderConf.loop;
35          }
36          if (sliderConf.autoplay !== undefined) {
37            autoplay = sliderConf.autoplay === true ? {delay: 2000} : false;
38          }
39          if (sliderConf.effect !== undefined) {
40            effect = sliderConf.effect;
41          }
42        }
43        swiperInstance[slider_id] = new Swiper(el, {
44          initialSlide: activeIndex,
45          direction: 'horizontal',
46          slidesPerView: 1,
47          spaceBetween: spaceBetween,
48          speed: 600,
49          loop: loop,
50          autoplay: autoplay,
51          autoHeight: true,
52          observer: true,
53          observeParents: true,
54          effect: effect,
55          passiveListeners: true,
56          breakpoints: {
57            320: {
58              slidesPerView: slidesPerViewMobile,
59            },
60            768: {
61              slidesPerView: slidesPerViewTablet,
62            },
63            1200: {
64              slidesPerView: slidesPerViewDesktop,
65            }
66          },
67          pagination: {
68            el: '.swiper-pagination-' + slider_id,
69            clickable: true,
70          },
71          navigation: {
72            nextEl: '#sw_next-' + slider_id,
73            prevEl: '#sw_prev-' + slider_id,
74          },
75        });
76
77
78      });
79
80    },
81  };
82}(Drupal, once));