{"version":3,"file":"campaignVideoCarousel-ccce5ddf.js","sources":["../../../../../../src/scripts/modules/campaignVideoCarousel.ts"],"sourcesContent":["import { Component } from '@verndale/core';\nimport Swiper from 'swiper';\nimport { Navigation } from 'swiper/modules';\n\nimport 'swiper/css';\n\nclass CampaignVideoCarousel extends Component {\n  swiper: Swiper;\n\n  constructor(el: HTMLElement) {\n    super(el);\n    this.init();\n  }\n\n  setupDefaults() {\n    this.dom = {\n      slider: this.el.querySelector<HTMLElement>('.swiper'),\n      slides: this.el.querySelectorAll<HTMLElement>('.swiper-slide'),\n      videoContainer: this.el.querySelector<HTMLElement>('.video'),\n      nextButton: this.el.querySelector<HTMLElement>('.campaign-video-carousel__next'),\n      prevButton: this.el.querySelector<HTMLElement>('.campaign-video-carousel__prev')\n    };\n  }\n\n  addListeners() {\n    (this.dom.slides as NodeList).forEach((slide) => {\n      slide.addEventListener('click', () => {\n        this.removeActiveClass();\n        (slide as HTMLElement).classList.add('active');\n        this.setVideoSrc(slide as HTMLElement);\n      });\n    });\n  }\n\n  setVideoSrc(slide: HTMLElement) {\n    const videoUrl = slide.dataset.videoUrl;\n    const videoId = slide.dataset.videoId;\n    const accountId = slide.dataset.videoAccount;\n    const script = document.createElement('script');\n\n    script.src = 'https://players.brightcove.net/1496514756001/default_default/index.min.js';\n    script.async = true;\n\n    (this.dom.videoContainer as HTMLElement).innerHTML = `\n     <video\n              data-video-url=\"${videoUrl}\"\n              data-video-id=\"${videoId}\"\n              data-account-id=\"${accountId}\"\n              data-player=\"default\"\n              data-embed=\"default\"\n              data-application-id\n              class=\"video__video\"\n              controls></video>`;\n    (this.dom.videoContainer as HTMLElement).appendChild(script);\n  }\n\n  removeActiveClass() {\n    (this.dom.slides as NodeList).forEach((slide) => {\n      (slide as HTMLElement).classList.remove('active');\n    });\n  }\n\n  init() {\n    this.swiper = new Swiper(this.dom.slider as HTMLDivElement, {\n      modules: [Navigation],\n      slidesPerView: 2.5,\n      spaceBetween: 20,\n      breakpoints: {\n        768: {\n          slidesPerView: 4,\n          spaceBetween: 40\n        }\n      },\n      navigation: {\n        nextEl: this.dom.nextButton as HTMLDivElement,\n        prevEl: this.dom.prevButton as HTMLDivElement\n      }\n    });\n  }\n}\n\nexport default CampaignVideoCarousel;\n"],"names":["CampaignVideoCarousel","Component","el","__publicField","slide","videoUrl","videoId","accountId","script","Swiper","Navigation"],"mappings":"yUAMA,MAAMA,UAA8BC,CAAU,CAG5C,YAAYC,EAAiB,CAC3B,MAAMA,CAAE,EAHVC,EAAA,eAIE,KAAK,KAAK,CACZ,CAEA,eAAgB,CACd,KAAK,IAAM,CACT,OAAQ,KAAK,GAAG,cAA2B,SAAS,EACpD,OAAQ,KAAK,GAAG,iBAA8B,eAAe,EAC7D,eAAgB,KAAK,GAAG,cAA2B,QAAQ,EAC3D,WAAY,KAAK,GAAG,cAA2B,gCAAgC,EAC/E,WAAY,KAAK,GAAG,cAA2B,gCAAgC,CAAA,CAEnF,CAEA,cAAe,CACZ,KAAK,IAAI,OAAoB,QAASC,GAAU,CACzCA,EAAA,iBAAiB,QAAS,IAAM,CACpC,KAAK,kBAAkB,EACtBA,EAAsB,UAAU,IAAI,QAAQ,EAC7C,KAAK,YAAYA,CAAoB,CAAA,CACtC,CAAA,CACF,CACH,CAEA,YAAYA,EAAoB,CACxB,MAAAC,EAAWD,EAAM,QAAQ,SACzBE,EAAUF,EAAM,QAAQ,QACxBG,EAAYH,EAAM,QAAQ,aAC1BI,EAAS,SAAS,cAAc,QAAQ,EAE9CA,EAAO,IAAM,4EACbA,EAAO,MAAQ,GAEd,KAAK,IAAI,eAA+B,UAAY;AAAA;AAAA,gCAEzBH,CAAQ;AAAA,+BACTC,CAAO;AAAA,iCACLC,CAAS;AAAA;AAAA;AAAA;AAAA;AAAA,iCAMrC,KAAK,IAAI,eAA+B,YAAYC,CAAM,CAC7D,CAEA,mBAAoB,CACjB,KAAK,IAAI,OAAoB,QAASJ,GAAU,CAC9CA,EAAsB,UAAU,OAAO,QAAQ,CAAA,CACjD,CACH,CAEA,MAAO,CACL,KAAK,OAAS,IAAIK,EAAO,KAAK,IAAI,OAA0B,CAC1D,QAAS,CAACC,CAAU,EACpB,cAAe,IACf,aAAc,GACd,YAAa,CACX,IAAK,CACH,cAAe,EACf,aAAc,EAChB,CACF,EACA,WAAY,CACV,OAAQ,KAAK,IAAI,WACjB,OAAQ,KAAK,IAAI,UACnB,CAAA,CACD,CACH,CACF"}