{"version":3,"sources":["webpack:///./src/js/modules/featuredEvents.js"],"names":["Module","this","dom","nextBtn","el","querySelector","prevBtn","cards","querySelectorAll","sliderWrapper","sliderContainer","controlsContainer","currentSlide","gap","mq","window","matchMedia","animationDone","time","timeoutTime","initSlider","addEventListener","nextSlide","prevSlide","matches","forEach","card","style","width","blockSize","removeAttribute","activeCard","offsetWidth","index","updateCarousel","xDown","yDown","e","firstTouch","touches","clientX","clientY","xUp","yUp","xDiff","yDiff","Math","abs","offsetHeight","setActiveState","classList","remove","add","setTimeout","offset","currentGap","transform","disabled","length","Component"],"mappings":"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","file":"61.76d37e3114fe0e207043.js","sourcesContent":["import { Component } from '@verndale/core';\n\nclass Module extends Component {\n  setupDefaults() {\n    this.dom = {\n      nextBtn: this.el.querySelector('.arrow-btn__next'),\n      prevBtn: this.el.querySelector('.arrow-btn__prev'),\n      cards: this.el.querySelectorAll('.featured-events__event'),\n      sliderWrapper: this.el.querySelector('.featured-events__slider'),\n      sliderContainer: this.el.querySelector('.featured-events__slider-container'),\n      controlsContainer: this.el.querySelector('.featured-events__controls')\n    };\n    this.currentSlide = 0;\n    this.gap = 40;\n    this.mq = window.matchMedia('(max-width: 1024px)');\n    this.animationDone = true;\n    this.time = 0.5;\n    this.timeoutTime = this.time * 1000;\n    this.initSlider();\n  }\n\n  addListeners() {\n    this.dom.nextBtn.addEventListener('click', () => {\n      if (this.animationDone) {\n        this.animationDone = false;\n        this.nextSlide();\n      }\n    });\n\n    this.dom.prevBtn.addEventListener('click', () => {\n      if (this.animationDone) {\n        this.animationDone = false;\n        this.prevSlide();\n      }\n    });\n\n    window.addEventListener('resize', () => {\n      if (this.mq.matches) {\n        this.dom.cards.forEach(card => {\n          const innerCard = card.querySelector('.featured-events__event-inner-container');\n          innerCard.style.width = '';\n        });\n        this.dom.sliderContainer.style.blockSize = '';\n        this.initSlider();\n      } else {\n        this.initSlider();\n        this.dom.sliderContainer.removeAttribute('style');\n        this.dom.sliderWrapper.removeAttribute('style');\n        this.dom.cards.forEach(card => {\n          const innerCard = card.querySelector('.featured-events__event-inner-container');\n          innerCard.style.width = `${this.activeCard.offsetWidth}px`;\n          card.style.width = '';\n        });\n      }\n    });\n\n    this.dom.cards.forEach((card, index) => {\n      card.addEventListener('click', () => {\n        this.currentSlide = index;\n        this.updateCarousel();\n      });\n    });\n\n    //   add touch events for mobile\n    let xDown = null,\n      yDown = null;\n\n    this.dom.sliderWrapper.addEventListener('touchstart', e => {\n      const firstTouch = e.touches[0];\n      xDown = firstTouch.clientX;\n      yDown = firstTouch.clientY;\n    }, false);\n\n    this.dom.sliderWrapper.addEventListener('touchmove', e => {\n      if (!xDown || !yDown) {\n        return;\n      }\n\n      const xUp = e.touches[0].clientX;\n      const yUp = e.touches[0].clientY;\n\n      const xDiff = xDown - xUp;\n      const yDiff = yDown - yUp;\n\n      if (Math.abs(xDiff) > Math.abs(yDiff)) {\n        if (xDiff > 0) {\n          this.nextSlide();\n        } else {\n          this.prevSlide();\n        }\n      }\n\n      xDown = null;\n      yDown = null;\n    }, false);\n  }\n\n  initSlider() {\n    if (this.mq.matches) {\n      this.dom.sliderContainer.style.blockSize = `${this.dom.sliderWrapper.offsetHeight}px`;\n      this.dom.sliderWrapper.style.blockSize = '100%';\n      this.dom.sliderWrapper.style.width = '';\n    } else {\n      this.setActiveState();\n    }\n  }\n\n  setActiveState() {\n    this.dom.cards.forEach(card => {\n      card.classList.remove('active');\n      card.style.width = '';\n    });\n\n    this.activeCard = this.dom.cards[this.currentSlide];\n    this.activeCard.classList.add('active');\n\n\n    setTimeout(() => {\n      this.dom.cards.forEach(card => {\n        const innerCard = card.querySelector('.featured-events__event-inner-container');\n        innerCard.style.width = `${this.activeCard.offsetWidth}px`;\n        this.animationDone = true;\n\n      });\n    }, this.timeoutTime);\n  }\n\n  updateCarousel() {\n    if (this.mq.matches) {\n      const offset = -this.currentSlide * 100;\n      const currentGap = this.currentSlide * this.gap;\n      this.dom.sliderWrapper.style.transform = `translateX(calc(${offset}% - ${currentGap}px))`;\n      this.animationDone = true;\n    } else {\n      this.setActiveState();\n    }\n  }\n\n\n  nextSlide() {\n    this.dom.nextBtn.disabled = this.currentSlide + 1 === this.dom.cards.length - 1;\n    this.dom.prevBtn.disabled = false;\n    if (this.currentSlide === this.dom.cards.length - 1) return;\n    this.currentSlide++;\n    this.updateCarousel();\n\n  }\n\n  prevSlide() {\n    this.dom.prevBtn.disabled = this.currentSlide - 1 === 0;\n    this.dom.nextBtn.disabled = false;\n    if (this.currentSlide === 0) return;\n    this.currentSlide--;\n    this.updateCarousel();\n\n  }\n\n}\n\nexport default Module;\n"],"sourceRoot":""}