diff --git a/assets/js/vendors/carousel.js b/assets/js/vendors/carousel.js index 2aaba633f9b1cc66ad0f471f705ea74e33cdb783..41d1afa93a711b7adc3bb8a7c1f0b52d307d58ea 100644 --- a/assets/js/vendors/carousel.js +++ b/assets/js/vendors/carousel.js @@ -22,9 +22,7 @@ class Carousel { init () { this.splide = new Splide(this.element).mount(); const toggleButton = this.splide.root.querySelector('.splide__toggle'), - stepButtons = this.splide.root.querySelectorAll('.splide__pagination button'), - elements = this.splide.root.querySelectorAll('.splide__pagination, .splide__slide'), - autoplay = this.splide.Components.Autoplay; + stepButtons = this.splide.root.querySelectorAll('.splide__pagination button'); this.listen(); @@ -33,32 +31,11 @@ class Carousel { stepButton.innerHTML = '<i></i>'; }); - this.splide.on('autoplay:play', () => { - toggleButton.classList.add('is-active'); - console.log(toggleButton) - }); - this.splide.on('autoplay:playing', (rate) => { - - var activeStepButton = this.splide.root.querySelector('.splide__pagination .is-active i'); + const activeStepButton = this.splide.root.querySelector('.splide__pagination .is-active i'); activeStepButton.style.width = rate * 100 + '%'; }); - this.splide.on('autoplay:pause', () => { - toggleButton.classList.remove('is-active'); - var activeStepButton = this.splide.root.querySelector('.splide__pagination .is-active i'); - }); - - elements.forEach(element => { - element.addEventListener('click', () => { - autoplay.pause(); - }) - }); - - this.splide.on('drag', () => { - autoplay.pause(); - }); - stepButtons.forEach((stepButton) => { const progressBar = stepButton.querySelector('i'); stepButton.addEventListener('click', () => {