{"version":3,"sources":["webpack:///./src/js/modules/videoContentV2.js"],"names":["ScrollMagicPluginGsap","ScrollMagic","TweenMax","TimelineMax","Module","this","dom","hiddenWord","el","querySelector","videoWrapper","titleWrapper","controller","Controller","setIsMobile","setHeight","wordAnimation","window","addEventListener","bind","isMobile","matchMedia","matches","closest","style","overflowX","removeAttribute","height","offsetHeight","tl","set","left","add","to","Scene","triggerElement","duration","offset","setTween","addTo","Component"],"mappings":"uYAEA,SAEA,QACA,S,sSAGA,EAFA,OAEAA,uBAAsBC,UAAaC,WAAUC,e,IAEvCC,E,ieAEFC,KAAKC,IAAM,CACTC,WAAYF,KAAKG,GAAGC,cAAc,gBAClCC,aAAcL,KAAKG,GAAGC,cAAc,4BACpCE,aAAcN,KAAKG,GAAGC,cAAc,qCAEtCJ,KAAKO,WAAa,IAAIX,UAAYY,WAClCR,KAAKS,cACLT,KAAKU,YACLV,KAAKW,kB,qCAILC,OAAOC,iBAAiB,SAAUb,KAAKU,UAAUI,KAAKd,S,oCAItDA,KAAKe,SAAWH,OAAOI,WAAW,sBAAsBC,U,kCAMxD,GAFAjB,KAAKS,cAEDT,KAAKe,SAEP,OADAf,KAAKG,GAAGe,QAAQ,cAAcC,MAAMC,UAAY,QACzCpB,KAAKC,IAAIK,aAAae,gBAAgB,SAE/CrB,KAAKC,IAAIK,aAAaa,MAAMG,OAAYtB,KAAKC,IAAII,aAAakB,aAA9D,O,sCAIA,IAAMC,EAAK,IAAI1B,cAEfD,WAAS4B,IAAIzB,KAAKC,IAAIC,WAAY,CAAEwB,KAAM,IAE1CF,EAAGG,IAAI9B,WAAS+B,GAAG5B,KAAKC,IAAIC,WAAY,EAAG,CAAEwB,KAAM,UAEnD,IAAI9B,UAAYiC,MAAM,CACpBC,eAAgB9B,KAAKG,GACrB4B,SAAU/B,KAAKC,IAAIK,aAAaiB,aAChCS,QAAQhC,KAAKe,SAAW,YAEvBkB,SAAST,GACTU,MAAMlC,KAAKO,gB,GA5CG4B,a,UAiDNpC","file":"77.51e8994291f94366f36b.js","sourcesContent":["// import 'scrollmagic/scrollmagic/uncompressed/plugins/debug.addIndicators';\n\nimport { TimelineMax, TweenMax } from 'gsap';\n\nimport { Component } from '@verndale/core';\nimport ScrollMagic from 'ScrollMagic';\nimport { ScrollMagicPluginGsap } from 'scrollmagic-plugin-gsap';\n\nScrollMagicPluginGsap(ScrollMagic, TweenMax, TimelineMax);\n\nclass Module extends Component {\n  setupDefaults() {\n    this.dom = {\n      hiddenWord: this.el.querySelector('.hidden-word'),\n      videoWrapper: this.el.querySelector('.video-content-v2__video'),\n      titleWrapper: this.el.querySelector('.video-content-v2__title-wrapper')\n    };\n    this.controller = new ScrollMagic.Controller();\n    this.setIsMobile();\n    this.setHeight();\n    this.wordAnimation();\n  }\n\n  addListeners() {\n    window.addEventListener('resize', this.setHeight.bind(this));\n  }\n\n  setIsMobile() {\n    this.isMobile = window.matchMedia('(max-width: 677px)').matches;\n  }\n\n  setHeight() {\n    this.setIsMobile();\n\n    if (this.isMobile) {\n      this.el.closest('.container').style.overflowX = 'unset';\n      return this.dom.titleWrapper.removeAttribute('style');\n    }\n    this.dom.titleWrapper.style.height = `${this.dom.videoWrapper.offsetHeight}px`;\n  }\n\n  wordAnimation() {\n    const tl = new TimelineMax();\n\n    TweenMax.set(this.dom.hiddenWord, { left: 0 });\n\n    tl.add(TweenMax.to(this.dom.hiddenWord, 1, { left: '100%' }));\n\n    new ScrollMagic.Scene({\n      triggerElement: this.el,\n      duration: this.dom.titleWrapper.offsetHeight,\n      offset: this.isMobile ? '-200px' : '-200px'\n    })\n      .setTween(tl)\n      .addTo(this.controller);\n    // .addIndicators({ name: '1 (duration: 0)' }); // add indicators (requires plugin)\n  }\n}\n\nexport default Module;\n"],"sourceRoot":""}