{"version":3,"sources":["webpack:///./app/javascript/scripts/components/Comic.js"],"names":["Comic","data","comicSelector","swiperSelector","swiperHiddenClass","swiperNextElSelector","swiperPrevElSelector","beerSliderSelector","paginationSelector","gtmEvent","gtmAction","init","observeComics","document","querySelector","this","initSwiper","initBeerSlider","Swiper","autoHeight","feature","a11y","prevSlideMessage","nextSlideMessage","pagination","el","clickable","navigation","hideOnClick","hiddenClass","nextEl","prevEl","querySelectorAll","forEach","slider","BeerSlider","getElementById","id","comics","LoadIntersectionObserver","then","createObserver","targets","observer","IntersectionObserver","entries","self","Array","prototype","call","entry","isIntersecting","sendGTMEvent","window","location","href","unobserve","target","threshold","image","observe","action","label","Analytics","track"],"mappings":"0FAAA,sDAKMA,EAAQ,CACZC,KAAM,CACJC,cAAe,YACfC,eAAgB,oBAChBC,kBAAmB,wBACnBC,qBAAsB,sBACtBC,qBAAsB,sBACtBC,mBAAoB,eACpBC,mBAAoB,kCACpBC,SAAU,aACVC,UAAW,cAGbC,KAbY,WAcVX,EAAMY,gBAEkBC,SAASC,cAAcC,KAAKd,KAAKE,iBAEvDY,KAAKC,aAGqBH,SAASC,cAAcC,KAAKd,KAAKM,qBAE3DQ,KAAKE,gBAER,EAEDD,WA3BY,WA8CV,OAlBe,IAAIE,IAAOH,KAAKd,KAAKE,eAAgB,CAClDgB,YAAY,EACZC,SAAS,EACTC,KAAM,CACJC,iBAAkB,iBAClBC,iBAAkB,cAEpBC,WAAY,CACVC,GAAIV,KAAKd,KAAKO,mBACdkB,WAAW,GAEbC,WAAY,CACVC,aAAa,EACbC,YAAad,KAAKd,KAAKG,kBACvB0B,OAAQf,KAAKd,KAAKI,qBAClB0B,OAAQhB,KAAKd,KAAKK,uBAIvB,EAEDW,eAjDY,WAkDVJ,SAASmB,iBAAiBjB,KAAKd,KAAKM,oBAAoB0B,SAAQ,SAAAC,GAE9D,OADmB,IAAIC,IAAWtB,SAASuB,eAAeF,EAAOG,IAElE,GACF,EAEDzB,cAxDY,WAyDV,IAAM0B,EAASzB,SAASmB,iBAAiBhC,EAAMC,KAAKC,eACpDqC,cAA2BC,MAAK,WAC9BxC,EAAMyC,eAAeH,EACtB,GACF,EAEDG,eA/DY,SA+DGC,GACb,IAIMC,EAAW,IAAIC,sBAAqB,SAACC,EAASC,GAClDC,MAAMC,UAAUf,QAAQgB,KAAKJ,GAAS,SAAAK,GAChCA,EAAMC,iBACRnD,EAAMoD,aAAapD,EAAMC,KAAKS,UAAW2C,OAAOC,SAASC,MACzDT,EAAKU,UAAUN,EAAMO,QAExB,GACF,GAXc,CACbC,UAAW,IAabX,MAAMC,UAAUf,QAAQgB,KAAKP,GAAS,SAAAiB,GAAK,OAAIhB,EAASiB,QAAQD,EAArB,GAC5C,EAEDP,aAjFY,SAiFCS,EAAQC,GACnBC,IAAUC,MAAMhE,EAAMC,KAAKQ,SAAU,CACnCoD,SACAC,SAEH,GAEY9D,W","file":"js/Comic-0a8341b00f50b6c16a3e.chunk.js","sourcesContent":["import Swiper from \"swiper\";\nimport BeerSlider from \"beerslider\";\nimport { LoadIntersectionObserver } from \"../tfs-utilities\";\nimport Analytics from \"../analytics\";\n\nconst Comic = {\n  data: {\n    comicSelector: \".js-comic\",\n    swiperSelector: \".swiper-container\",\n    swiperHiddenClass: \"swiper-button--hidden\",\n    swiperNextElSelector: \".swiper-button-next\",\n    swiperPrevElSelector: \".swiper-button-prev\",\n    beerSliderSelector: \".beer-slider\",\n    paginationSelector: \".tfs-comic__carousel-pagination\",\n    gtmEvent: \"view-comic\",\n    gtmAction: \"view comic\"\n  },\n\n  init() {\n    Comic.observeComics();\n\n    const swiperContainer = document.querySelector(this.data.swiperSelector);\n    if (swiperContainer) {\n      this.initSwiper();\n    }\n\n    const beerSliderContainer = document.querySelector(this.data.beerSliderSelector);\n    if (beerSliderContainer) {\n      this.initBeerSlider();\n    }\n  },\n\n  initSwiper() {\n    const swiper = new Swiper(this.data.swiperSelector, {\n      autoHeight: true,\n      feature: true,\n      a11y: {\n        prevSlideMessage: \"Previous slide\",\n        nextSlideMessage: \"Next slide\"\n      },\n      pagination: {\n        el: this.data.paginationSelector,\n        clickable: true\n      },\n      navigation: {\n        hideOnClick: false,\n        hiddenClass: this.data.swiperHiddenClass,\n        nextEl: this.data.swiperNextElSelector,\n        prevEl: this.data.swiperPrevElSelector\n      }\n    });\n    return swiper;\n  },\n\n  initBeerSlider() {\n    document.querySelectorAll(this.data.beerSliderSelector).forEach(slider => {\n      const beerslider = new BeerSlider(document.getElementById(slider.id));\n      return beerslider;\n    });\n  },\n\n  observeComics() {\n    const comics = document.querySelectorAll(Comic.data.comicSelector);\n    LoadIntersectionObserver().then(() => {\n      Comic.createObserver(comics);\n    });\n  },\n\n  createObserver(targets) {\n    const config = {\n      threshold: 1\n    };\n\n    const observer = new IntersectionObserver((entries, self) => {\n      Array.prototype.forEach.call(entries, entry => {\n        if (entry.isIntersecting) {\n          Comic.sendGTMEvent(Comic.data.gtmAction, window.location.href);\n          self.unobserve(entry.target);\n        }\n      });\n    }, config);\n\n    // Watch for images to come into view\n    Array.prototype.forEach.call(targets, image => observer.observe(image));\n  },\n\n  sendGTMEvent(action, label) {\n    Analytics.track(Comic.data.gtmEvent, {\n      action,\n      label\n    });\n  }\n};\nexport default Comic;\n"],"sourceRoot":""}