62 lines
		
	
	
		
			1.7 KiB
		
	
	
	
		
			JavaScript
		
	
	
	
	
	
			
		
		
	
	
			62 lines
		
	
	
		
			1.7 KiB
		
	
	
	
		
			JavaScript
		
	
	
	
	
	
(function (Drupal, once) {
 | 
						|
  Drupal.behaviors.pingPongSlider = {
 | 
						|
 | 
						|
    attach: function (context, settings) {
 | 
						|
      let sliders = once('pingPongSlider', '.swiper', context);
 | 
						|
      sliders.forEach((slider) =>  {
 | 
						|
        const swiper = new Swiper(slider, {
 | 
						|
          // Optional parameters
 | 
						|
          loop: true,
 | 
						|
          autoplay: {
 | 
						|
           delay: 5000,
 | 
						|
          },
 | 
						|
 | 
						|
          // If we need pagination
 | 
						|
          pagination: {
 | 
						|
            el: '.swiper-pagination',
 | 
						|
          },
 | 
						|
 | 
						|
          // Navigation arrows
 | 
						|
          navigation: {
 | 
						|
            nextEl: '.swiper-button-next',
 | 
						|
            prevEl: '.swiper-button-prev',
 | 
						|
          },
 | 
						|
 | 
						|
          // And if we need scrollbar
 | 
						|
          scrollbar: {
 | 
						|
            el: '.swiper-scrollbar',
 | 
						|
          },
 | 
						|
        });
 | 
						|
        // // get the slides
 | 
						|
        // let slides = slider.querySelectorAll('.slide');
 | 
						|
        // slides[0].classList.add("active");
 | 
						|
        // if (slides.length <= 1) {
 | 
						|
        //   return;
 | 
						|
        // }
 | 
						|
        // changeSlide(slider);
 | 
						|
      });
 | 
						|
 | 
						|
      // function changeSlide(sliderDiv, loop = 1) {
 | 
						|
      //   setTimeout(() => {
 | 
						|
      //     let slideCount = sliderDiv.querySelectorAll('.slide').length;
 | 
						|
      //     let activeSlide = sliderDiv.querySelector('.slide.active');
 | 
						|
      //     let nextSlide = activeSlide.nextElementSibling;
 | 
						|
      //     if (loop == slideCount) {
 | 
						|
      //       nextSlide = sliderDiv.querySelectorAll('.slide')[0];
 | 
						|
      //       return;
 | 
						|
      //       // get the first slide
 | 
						|
      //     }
 | 
						|
      //     else {
 | 
						|
      //       loop++;
 | 
						|
      //       activeSlide.classList.toggle('active');
 | 
						|
      //       nextSlide.classList.toggle('active');
 | 
						|
      //       changeSlide(sliderDiv, loop);
 | 
						|
      //     }
 | 
						|
      //   }, 10000);
 | 
						|
      // }
 | 
						|
    }
 | 
						|
 | 
						|
  };
 | 
						|
})(Drupal, once);
 | 
						|
 |