{"version":3,"sources":["webpack:///./src/js/modules/legacy/roundshotMountainCam.js"],"names":["Module","this","dom","imageContainer","el","querySelector","animationType","dataset","loopDuration","duration","bounceDuration","loadModel","buildSlider","window","addEventListener","debounce","bind","image","model","JSON","parse","camModel","document","createElement","src","picture","appendChild","imageWidth","offsetWidth","slider","kill","innerHTML","diff","imgClone","cloneNode","classList","add","animateSlider","containerWidth","slides","querySelectorAll","totalWidth","length","mod","gsap","utils","wrap","set","x","i","timeline","to","modifiers","parseFloat","ease","repeat","yoyo","Component"],"mappings":"ilDAKMA,E,sWACJ,WACEC,KAAKC,IAAM,CACTC,eAAgBF,KAAKG,GAAGC,cACtB,0CAIJJ,KAAKK,cAAgBL,KAAKG,GAAGG,QAAQD,eAAiB,SACtDL,KAAKO,aAAeP,KAAKG,GAAGG,QAAQE,UAAY,IAChDR,KAAKS,eAAiBT,KAAKG,GAAGG,QAAQE,UAAY,GAElDR,KAAKU,YACLV,KAAKW,gB,0BAGP,WACEC,OAAOC,iBACL,SACAC,YAASd,KAAKW,YAAYI,KAAKf,MAAO,MAExCA,KAAKC,IAAIe,MAAMH,iBAAiB,OAAQb,KAAKW,YAAYI,KAAKf,S,uBAGhE,WACEA,KAAKiB,MAAQC,KAAKC,MAAMnB,KAAKG,GAAGG,QAAQc,UAExCpB,KAAKC,IAAIe,MAAQK,SAASC,cAAc,OACxCtB,KAAKC,IAAIe,MAAMO,IAAMvB,KAAKiB,MAAMO,QAEhCxB,KAAKC,IAAIC,eAAeuB,YAAYzB,KAAKC,IAAIe,S,yBAG/C,WACE,IAAMU,EAAa1B,KAAKC,IAAIe,MAAMW,YAMlC,GAJI3B,KAAK4B,QACP5B,KAAK4B,OAAOC,OAGVH,EAAY,CAId,GAHA1B,KAAKC,IAAIC,eAAe4B,UAAY,GACpC9B,KAAKC,IAAIC,eAAeuB,YAAYzB,KAAKC,IAAIe,OAElB,SAAvBhB,KAAKK,cAEP,IADA,IAAI0B,EAAO/B,KAAKC,IAAIC,eAAeyB,YAC5BI,EAAO,GAAG,CACf,IAAMC,EAAWhC,KAAKC,IAAIe,MAAMiB,YAChCD,EAASE,UAAUC,IAAI,SACvBnC,KAAKC,IAAIC,eAAeuB,YAAYO,GAEpCD,GAAQL,EAIZ1B,KAAKoC,mB,2BAIT,WACE,IAAMV,EAAa1B,KAAKC,IAAIe,MAAMW,YAC5BU,EAAiBrC,KAAKC,IAAIC,eAAeyB,YAE/C,GAA2B,SAAvB3B,KAAKK,cAA0B,CACjC,IAAMiC,EAAStC,KAAKC,IAAIC,eAAeqC,iBAAiB,OAClDC,EAAad,EAAaY,EAAOG,OACjCC,EAAMC,IAAKC,MAAMC,MAAMnB,EAAYc,EAAad,GAEtDiB,IAAKG,IAAIR,EAAQ,CAAES,EAAG,SAAAC,GAAC,OAAIA,EAAItB,KAE/B1B,KAAK4B,OAASe,IAAKM,WAAWC,GAAGZ,EAAQ,CACvCS,EAAG,KAAF,OAAOP,GACRW,UAAW,CACTJ,EAAG,SAAAA,GAAC,gBAAOL,EAAIU,WAAWL,IAAtB,QAENvC,SAAUR,KAAKO,aACf8C,KAAM,OACNC,QAAS,SAGXX,IAAKG,IAAI9C,KAAKC,IAAIe,MAAO,CAAE+B,EAAG,IAE9B/C,KAAK4B,OAASe,IACXM,SAAS,CAAEK,QAAS,EAAGC,MAAM,IAC7BL,GAAGlD,KAAKC,IAAIe,MAAO,CAClB+B,EAAGV,EAAiBX,EACpBlB,SAAUR,KAAKS,eACf4C,KAAM,sB,8BAvFKG,aA6FNzD","file":"71.1dc1b1c4e7209f12ab0b.js","sourcesContent":["import { Component } from '@verndale/core';\nimport { gsap } from 'gsap';\n\nimport { debounce } from '../../helpers';\n\nclass Module extends Component {\n  setupDefaults() {\n    this.dom = {\n      imageContainer: this.el.querySelector(\n        '.roundshot-mountain-cam__image-slider'\n      )\n    };\n\n    this.animationType = this.el.dataset.animationType || 'bounce';\n    this.loopDuration = this.el.dataset.duration || 150;\n    this.bounceDuration = this.el.dataset.duration || 15;\n\n    this.loadModel();\n    this.buildSlider();\n  }\n\n  addListeners() {\n    window.addEventListener(\n      'resize',\n      debounce(this.buildSlider.bind(this), 200)\n    );\n    this.dom.image.addEventListener('load', this.buildSlider.bind(this));\n  }\n\n  loadModel() {\n    this.model = JSON.parse(this.el.dataset.camModel);\n\n    this.dom.image = document.createElement('img');\n    this.dom.image.src = this.model.picture;\n\n    this.dom.imageContainer.appendChild(this.dom.image);\n  }\n\n  buildSlider() {\n    const imageWidth = this.dom.image.offsetWidth;\n\n    if (this.slider) {\n      this.slider.kill();\n    }\n\n    if (imageWidth) {\n      this.dom.imageContainer.innerHTML = '';\n      this.dom.imageContainer.appendChild(this.dom.image);\n\n      if (this.animationType === 'loop') {\n        let diff = this.dom.imageContainer.offsetWidth;\n        while (diff > 0) {\n          const imgClone = this.dom.image.cloneNode();\n          imgClone.classList.add('clone');\n          this.dom.imageContainer.appendChild(imgClone);\n\n          diff -= imageWidth;\n        }\n      }\n\n      this.animateSlider();\n    }\n  }\n\n  animateSlider() {\n    const imageWidth = this.dom.image.offsetWidth;\n    const containerWidth = this.dom.imageContainer.offsetWidth;\n\n    if (this.animationType === 'loop') {\n      const slides = this.dom.imageContainer.querySelectorAll('img');\n      const totalWidth = imageWidth * slides.length;\n      const mod = gsap.utils.wrap(-imageWidth, totalWidth - imageWidth);\n\n      gsap.set(slides, { x: i => i * imageWidth });\n\n      this.slider = gsap.timeline().to(slides, {\n        x: `-=${totalWidth}`,\n        modifiers: {\n          x: x => `${mod(parseFloat(x))}px`\n        },\n        duration: this.loopDuration,\n        ease: 'none',\n        repeat: -1\n      });\n    } else {\n      gsap.set(this.dom.image, { x: 0 });\n\n      this.slider = gsap\n        .timeline({ repeat: -1, yoyo: true })\n        .to(this.dom.image, {\n          x: containerWidth - imageWidth,\n          duration: this.bounceDuration,\n          ease: 'power1.inOut'\n        });\n    }\n  }\n}\n\nexport default Module;\n"],"sourceRoot":""}