github.com/outbrain/consul@v1.4.5/website/source/assets/javascripts/consul-connect/carousel.js (about)

     1  document.addEventListener('turbolinks:load', function () {
     2    var qs = document.querySelector.bind(document)
     3    var qsa = document.querySelectorAll.bind(document)
     4    var carousel = qs('.siema')
     5  
     6    if (carousel) {
     7      objectFitImages()
     8  
     9      // siema carousels
    10      var dots = qsa('.g-carousel .pagination li')
    11      var siema = new Siema({
    12        selector: carousel,
    13        duration: 200,
    14        easing: 'ease-out',
    15        perPage: 1,
    16        startIndex: 0,
    17        draggable: true,
    18        multipleDrag: true,
    19        threshold: 20,
    20        loop: true,
    21        rtl: false,
    22        onChange: function() {
    23          for (var i = 0; i < dots.length; i++) {
    24            dots[i].classList.remove('active')
    25          }
    26          dots[siema.currentSlide].classList.add('active')
    27        }
    28      })
    29  
    30      // on previous button click
    31      qs('.g-carousel .prev')
    32        .addEventListener('click', function() {
    33          siema.prev()
    34        })
    35    
    36      // on next button click
    37      qs('.g-carousel .next')
    38        .addEventListener('click', function() {
    39          siema.next()
    40        })
    41    
    42      // on dot click
    43      for (var i = 0; i < dots.length; i++) {
    44        dots[i].addEventListener('click', function() {
    45          siema.goTo(this.dataset.index)
    46        })
    47      }
    48  
    49      document.addEventListener('turbolinks:before-cache', function() {
    50        siema.goTo(0) // reset pagination
    51        siema.destroy(true)
    52      });
    53    }  
    54  })
    55