{"version":3,"sources":["webpack:///./src/js/modules/modals/video-modal.js","webpack:///./src/js/modules/generic-overview.js"],"names":["VideoModal","this","dom","player","el","querySelector","modalId","id","videoId","dataset","createVideoPlayer","on","onPlayerReady","MicroModal","show","awaitCloseAnimation","onShow","playVideo","onClose","pauseVideo","YouTubePlayer","playerVars","controls","enablejsapi","fs","modestbranding","autoplay","playsinline","rel","loop","props","Component","GenericOverview","play","videoModal","overviewContainer","figure","mobileMediaQuery","window","matchMedia","isMobile","matches","enablePlay","setContainerHeight","addEventListener","showVideoModal","disabled","style","height","oneThirdHeight","offsetHeight","naturalHeight"],"mappings":"glDAIMA,E,sWACJ,WACEC,KAAKC,IAAM,CACTC,OAAQF,KAAKG,GAAGC,cAAc,yBAGhCJ,KAAKK,QAAUL,KAAKG,GAAGG,GACvBN,KAAKO,QAAUP,KAAKC,IAAIC,OAAOM,QAAQD,QACvCP,KAAKS,sB,0BAGP,WACET,KAAKE,OAAOQ,GAAG,QAAWV,KAAKW,cAA/B,KAA0BX,S,kBAG5B,WACEY,IAAWC,KAAKb,KAAKK,QAAS,CAC5BS,qBAAqB,EACrBC,OAAUf,KAAKgB,UAAT,KAAIhB,MACViB,QAAWjB,KAAKkB,WAAT,KAAIlB,U,+BAIf,WACEA,KAAKE,OAASiB,IAAcnB,KAAKC,IAAIC,OAAQ,CAC3CK,QAASP,KAAKO,QACda,WAAY,CACVC,SAAU,EACVC,YAAa,EACbC,GAAI,EACJC,eAAgB,EAChBC,SAAU,EACVC,YAAa,EACbC,IAAK,EACLC,KAAM,O,2BAKZ,WACM5B,KAAK6B,MAAMlB,eACbX,KAAK6B,MAAMlB,kB,uBAIf,WACMX,KAAKE,QACPF,KAAKE,OAAOc,c,wBAIhB,WACMhB,KAAKE,QACPF,KAAKE,OAAOgB,kB,8BArDOY,aA0DV/B,O,6gDC3DTgC,E,sWACJ,WACE/B,KAAKC,IAAM,CACT+B,KAAMhC,KAAKG,GAAGC,cAAc,2BAC5B6B,WAAYjC,KAAKG,GAAGC,cAAc,gBAClC8B,kBAAmBlC,KAAKG,GAAGC,cAAc,gCACzC+B,OAAQnC,KAAKG,GAAGC,cAAc,8BAEhCJ,KAAKoC,iBAAmBC,OAAOC,WAAW,sCAC1CtC,KAAKuC,SAAWvC,KAAKoC,iBAAiBI,QAElCxC,KAAKC,IAAIgC,aACXjC,KAAKiC,WAAa,IAAIlC,IAAWC,KAAKC,IAAIgC,WAAY,CACpDtB,cAAiBX,KAAKyC,WAAT,KAAIzC,SAIrBA,KAAK0C,uB,0BAGP,WAAe,WACT1C,KAAKC,IAAI+B,MAAQhC,KAAKC,IAAIgC,YAC5BjC,KAAKC,IAAI+B,KAAKW,iBAAiB,QAAW3C,KAAK4C,eAA/C,KAA0C5C,OAGxCA,KAAKC,IAAIkC,QACXE,OAAOM,iBAAiB,UAAU,WAChC,EAAKJ,SAAW,EAAKH,iBAAiBI,QACtC,EAAKE,0B,4BAKX,WACE1C,KAAKiC,WAAWpB,S,wBAGlB,WACEb,KAAKC,IAAI+B,KAAKa,UAAW,I,gCAG3B,WACE,GAAK7C,KAAKC,IAAIkC,QAAWnC,KAAKC,IAAIiC,kBAElC,GAAIlC,KAAKuC,SACPvC,KAAKC,IAAIiC,kBAAkBY,MAAMC,OAAS,WAD5C,CAKA/C,KAAKC,IAAIiC,kBAAkBY,MAAMC,OAAS,OAC1C,IACMC,EADehD,KAAKC,IAAIkC,OAAOc,aACC,EAChCC,EAAgBlD,KAAKC,IAAIiC,kBAAkBe,aACjDjD,KAAKC,IAAIiC,kBAAkBY,MAAMC,OAAjC,UAA6CG,EAAgBF,EAA7D,Y,8BArD0BlB,aAyDfC","file":"6.b5b6dc976d7da275bf58.js","sourcesContent":["import MicroModal from 'micromodal';\nimport { Component } from '@verndale/core';\nimport YouTubePlayer from 'youtube-player';\n\nclass VideoModal extends Component {\n  setupDefaults() {\n    this.dom = {\n      player: this.el.querySelector('.video-modal__player')\n    };\n\n    this.modalId = this.el.id;\n    this.videoId = this.dom.player.dataset.videoId;\n    this.createVideoPlayer();\n  }\n\n  addListeners() {\n    this.player.on('ready', ::this.onPlayerReady)\n  }\n\n  show() {\n    MicroModal.show(this.modalId, {\n      awaitCloseAnimation: true,\n      onShow: ::this.playVideo,\n      onClose: ::this.pauseVideo\n    });\n  }\n\n  createVideoPlayer() {\n    this.player = YouTubePlayer(this.dom.player, {\n      videoId: this.videoId,\n      playerVars: {\n        controls: 1,\n        enablejsapi: 1,\n        fs: 1,\n        modestbranding: 0,\n        autoplay: 0,\n        playsinline: 0,\n        rel: 0,\n        loop: 1\n      }\n    });\n  }\n\n  onPlayerReady() {\n    if (this.props.onPlayerReady) {\n      this.props.onPlayerReady();\n    }\n  }\n\n  playVideo() {\n    if (this.player) {\n      this.player.playVideo();\n    }\n  }\n\n  pauseVideo() {\n    if (this.player) {\n      this.player.pauseVideo();\n    }\n  }\n}\n\nexport default VideoModal;\n","import { Component } from '@verndale/core';\nimport VideoModal from './modals/video-modal';\n\nclass GenericOverview extends Component {\n  setupDefaults() {\n    this.dom = {\n      play: this.el.querySelector('.generic-overview__play'),\n      videoModal: this.el.querySelector('.video-modal'),\n      overviewContainer: this.el.querySelector('.generic-overview__container'),\n      figure: this.el.querySelector('.generic-overview__figure')\n    };\n    this.mobileMediaQuery = window.matchMedia('only screen and (max-width: 979px)');\n    this.isMobile = this.mobileMediaQuery.matches;\n\n    if (this.dom.videoModal) {\n      this.videoModal = new VideoModal(this.dom.videoModal, {\n        onPlayerReady: ::this.enablePlay\n      });\n    }\n\n    this.setContainerHeight();\n  }\n\n  addListeners() {\n    if (this.dom.play && this.dom.videoModal) {\n      this.dom.play.addEventListener('click', ::this.showVideoModal);\n    }\n\n    if (this.dom.figure) {\n      window.addEventListener('resize', () => {\n        this.isMobile = this.mobileMediaQuery.matches;\n        this.setContainerHeight();\n      });\n    }\n  }\n\n  showVideoModal() {\n    this.videoModal.show();\n  }\n\n  enablePlay() {\n    this.dom.play.disabled = false;\n  }\n\n  setContainerHeight() {\n    if (!this.dom.figure || !this.dom.overviewContainer) return;\n\n    if (this.isMobile) {\n      this.dom.overviewContainer.style.height = 'auto';\n      return;\n    }\n\n    this.dom.overviewContainer.style.height = 'auto';\n    const figureHeight = this.dom.figure.offsetHeight;\n    const oneThirdHeight = figureHeight / 3;\n    const naturalHeight = this.dom.overviewContainer.offsetHeight;\n    this.dom.overviewContainer.style.height = `${naturalHeight + oneThirdHeight}px`;\n  }\n}\n\nexport default GenericOverview;\n"],"sourceRoot":""}