{"version":3,"sources":["webpack:///./src/js/modules/homepageBloomHero.js"],"names":["Module","this","dom","arrowLine","el","querySelector","arrowBottom","videoElement","playPauseBtn","playIcon","pauseIcon","videoSource","dataset","src","style","display","animateLine","animateArrow","addEventListener","handlePlayPauseBtn","bind","paused","playVideo","pauseVideo","play","pause","gsap","to","keyframes","y","duration","ease","transform","transformOrigin","repeat","onComplete","stopLine","stopArrow","fromTo","Component"],"mappings":"+9CAGMA,E,iXAEFC,KAAKC,IAAM,CACTC,UAAWF,KAAKG,GAAGC,cAAc,eACjCC,YAAaL,KAAKG,GAAGC,cAAc,iBACnCE,aAAcN,KAAKG,GAAGC,cAAc,SACpCG,aAAcP,KAAKG,GAAGC,cAAc,iCACpCI,SAAUR,KAAKG,GAAGC,cAAc,iCAChCK,UAAWT,KAAKG,GAAGC,cAAc,mCAGnCJ,KAAKU,YAAcV,KAAKG,GAAGQ,QAAQD,YACnCV,KAAKC,IAAIK,aAAaM,IAAMZ,KAAKU,YACjCV,KAAKC,IAAIO,SAASK,MAAMC,QAAU,OAG9Bd,KAAKC,IAAIC,WACXF,KAAKe,cAGHf,KAAKC,IAAII,aACXL,KAAKgB,iB,qCAQPhB,KAAKC,IAAIM,aAAaU,iBACpB,QACAjB,KAAKkB,mBAAmBC,KAAKnB,S,2CAM3BA,KAAKC,IAAIK,aAAac,OAAQpB,KAAKqB,YAClCrB,KAAKsB,e,kCAKVtB,KAAKC,IAAIK,aAAaiB,OACtBvB,KAAKC,IAAIO,SAASK,MAAMC,QAAU,OAClCd,KAAKC,IAAIQ,UAAUI,MAAMC,QAAU,gB,mCAInCd,KAAKC,IAAIK,aAAakB,QACtBxB,KAAKC,IAAIQ,UAAUI,MAAMC,QAAU,OACnCd,KAAKC,IAAIO,SAASK,MAAMC,QAAU,gB,oCAMlCW,IAAKC,GAAG1B,KAAKC,IAAIC,UAAW,CAC1ByB,UAAW,CACT,CAAEC,EAAE,GAAIC,SAAU,IAAKC,KAAM,WAAYC,UAAW,YAAaC,gBAAiB,OAClF,CAAEJ,EAAE,IAAKC,SAAU,EAAGC,KAAM,UAAWC,UAAW,YAAaC,gBAAiB,WAElFC,OAAQ,EACRC,WAAYlC,KAAKmC,SAAShB,KAAKnB,U,qCAIjCyB,IAAKC,GAAG1B,KAAKC,IAAII,YAAa,CAC5BsB,UAAW,CACT,CAAEC,EAAE,GAAIC,SAAU,IAAKC,KAAM,YAC7B,CAAEF,EAAE,IAAKC,SAAU,EAAGC,KAAM,YAE9BG,OAAQ,EACRC,WAAYlC,KAAKoC,UAAUjB,KAAKnB,U,iCAIlCyB,IAAKY,OAAOrC,KAAKC,IAAIC,UACnB,CACE6B,UAAW,YACXC,gBAAiB,MACjBJ,EAAE,GAEJ,CACEG,UAAW,YACXC,gBAAiB,MACjBJ,EAAG,GACHC,SAAS,EACTI,OAAO,EACPH,KAAM,2B,kCAIVL,IAAKY,OAAOrC,KAAKC,IAAII,YACnB,CACEuB,EAAE,GAEJ,CACEA,EAAG,GACHC,SAAS,EACTI,OAAO,EACPH,KAAM,8B,8BArGOQ,aA8GNvC","file":"55.de7427b63900c63bebda.js","sourcesContent":["import { Component } from '@verndale/core';\r\nimport { gsap } from 'gsap';\r\n\r\nclass Module extends Component {\r\n  setupDefaults() {\r\n    this.dom = {\r\n      arrowLine: this.el.querySelector('#arrow-line'),\r\n      arrowBottom: this.el.querySelector('#arrow-bottom'),\r\n      videoElement: this.el.querySelector('video'),\r\n      playPauseBtn: this.el.querySelector('.video-player__play-pause-btn'),\r\n      playIcon: this.el.querySelector('.cta-decorator-v2--video-play'),\r\n      pauseIcon: this.el.querySelector('.cta-decorator-v2--video-pause')\r\n    };\r\n\r\n    this.videoSource = this.el.dataset.videoSource;\r\n    this.dom.videoElement.src = this.videoSource;\r\n    this.dom.playIcon.style.display = 'none';\r\n\r\n\r\n    if (this.dom.arrowLine) {\r\n      this.animateLine();\r\n    }\r\n\r\n    if (this.dom.arrowBottom) {\r\n      this.animateArrow();\r\n    }\r\n\r\n\r\n  }\r\n\r\n\r\n  addListeners() {\r\n    this.dom.playPauseBtn.addEventListener(\r\n      'click',\r\n      this.handlePlayPauseBtn.bind(this)\r\n    );\r\n  }\r\n\r\n  handlePlayPauseBtn() {\r\n\r\n    if (this.dom.videoElement.paused) this.playVideo();\r\n    else this.pauseVideo();\r\n\r\n  }\r\n\r\n  playVideo() {\r\n    this.dom.videoElement.play();\r\n    this.dom.playIcon.style.display = 'none';\r\n    this.dom.pauseIcon.style.display = 'inline-flex';\r\n  }\r\n\r\n  pauseVideo() {\r\n    this.dom.videoElement.pause();\r\n    this.dom.pauseIcon.style.display = 'none';\r\n    this.dom.playIcon.style.display = 'inline-flex';\r\n  }\r\n\r\n\r\n\r\n  animateLine() {\r\n    gsap.to(this.dom.arrowLine, {\r\n      keyframes: [\r\n        { y:90, duration: 1.5, ease: 'expo.out', transform: 'scaleY(1)', transformOrigin: 'top'  },\r\n        { y:175, duration: 1, ease: 'expo.in', transform: 'scaleY(0)', transformOrigin: 'bottom' }\r\n      ],\r\n      repeat: 2,\r\n      onComplete: this.stopLine.bind(this)\r\n    });\r\n  }\r\n  animateArrow() {\r\n    gsap.to(this.dom.arrowBottom, {\r\n      keyframes: [\r\n        { y:80, duration: 1.5, ease: 'expo.out' },\r\n        { y:120, duration: 1, ease: 'expo.in' }\r\n      ],\r\n      repeat: 2,\r\n      onComplete: this.stopArrow.bind(this)\r\n    });\r\n  }\r\n  stopLine() {\r\n    gsap.fromTo(this.dom.arrowLine,\r\n      {\r\n        transform: 'scaleY(1)',\r\n        transformOrigin: 'top',\r\n        y:5\r\n      },\r\n      {\r\n        transform: 'scaleY(1)',\r\n        transformOrigin: 'top',\r\n        y: 87,\r\n        duration:2,\r\n        repeat:0,\r\n        ease: 'slow (0.1, 1, false)'\r\n      });\r\n  }\r\n  stopArrow() {\r\n    gsap.fromTo(this.dom.arrowBottom,\r\n      {\r\n        y:0\r\n      },\r\n      {\r\n        y: 83,\r\n        duration:2,\r\n        repeat:0,\r\n        ease: 'slow (0.1, 1, false)'\r\n      });\r\n  }\r\n\r\n\r\n\r\n\r\n\r\n}\r\nexport default Module;\r\n"],"sourceRoot":""}