{"version":3,"sources":["webpack://multicontent-widget/./resources/js/src/components/LazyVid.vue?8cfa","webpack://multicontent-widget/./resources/js/src/components/LazyVid.vue?997d","webpack://multicontent-widget/resources/js/src/components/LazyVid.vue","webpack://multicontent-widget/./resources/js/src/components/LazyVid.vue"],"names":["render","_vm","this","_h","$createElement","_c","_self","ref","class","videoClass","attrs","autoplay","autoPlay","loop","controls","playsinline","domProps","muted","on","blur","handleBlur","focus","handleFocus","videoUrl","type","_withStripped","component","options","__file"],"mappings":"2KAAA,IAAIA,EAAS,WACX,IAAIC,EAAMC,KACNC,EAAKF,EAAIG,eACTC,EAAKJ,EAAIK,MAAMD,IAAMF,EACzB,OAAOE,EACL,QACA,CACEE,IAAK,QACLC,MAAOP,EAAIQ,WACXC,MAAO,CACLC,SAAUV,EAAIW,SACdC,KAAMZ,EAAIY,KACVC,SAAUb,EAAIa,SACdC,YAAa,IAEfC,SAAU,CAAEC,MAAOhB,EAAIgB,OACvBC,GAAI,CAAEC,KAAMlB,EAAImB,WAAYC,MAAOpB,EAAIqB,cAEzC,CAACjB,EAAG,SAAU,CAAEK,MAAO,CAAE,WAAYT,EAAIsB,SAAUC,KAAM,gBAE7D,EAEAxB,EAAOyB,eAAgB,E,cCtB6J,ECsBpL,CACA,OACA,gBACA,kBACA,iBACA,cACA,aACA,kBAIA,MACA,CACA,+BACA,2BACA,sCACA,gCACA,GACA,GAEA,8BAEA,kDACA,gDAEA,2BACA,iCACA,uBACA,GACA,EACA,qBAEA,qDACA,kDACA,EACA,SACA,wBACA,+CACA,OAGA,wFAIA,EACA,yBAGA,+CACA,oBAEA,yBACA,wBAIA,yBACA,yBAIA,EACA,uBACA,8CACA,yBACA,uBAGA,EACA,sBACA,+CACA,yBACA,yBAGA,IC3FIC,GAAY,E,QAAA,GACd,EACA1B,EHYoB,IGVpB,EACA,KACA,KACA,MAuBF0B,EAAUC,QAAQC,OAAS,0CAC3B,MAAeF,E","file":"chunks/multicontent-36.min.js","sourcesContent":["var render = function () {\n  var _vm = this\n  var _h = _vm.$createElement\n  var _c = _vm._self._c || _h\n  return _c(\n    \"video\",\n    {\n      ref: \"video\",\n      class: _vm.videoClass,\n      attrs: {\n        autoplay: _vm.autoPlay,\n        loop: _vm.loop,\n        controls: _vm.controls,\n        playsinline: \"\",\n      },\n      domProps: { muted: _vm.muted },\n      on: { blur: _vm.handleBlur, focus: _vm.handleFocus },\n    },\n    [_c(\"source\", { attrs: { \"data-src\": _vm.videoUrl, type: \"video/mp4\" } })]\n  )\n}\nvar staticRenderFns = []\nrender._withStripped = true\n\nexport { render, staticRenderFns }","import mod from \"-!../../../../node_modules/babel-loader/lib/index.js!../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./LazyVid.vue?vue&type=script&lang=js&\"; export default mod; export * from \"-!../../../../node_modules/babel-loader/lib/index.js!../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./LazyVid.vue?vue&type=script&lang=js&\"","<template>\n  <video\n    ref=\"video\"\n    :class=\"videoClass\"\n    :autoplay=\"autoPlay\"\n    :muted=\"muted\"\n    :loop=\"loop\"\n    :controls=\"controls\"\n    playsinline=\"\"\n    @blur=\"handleBlur\"\n    @focus=\"handleFocus\"\n  >\n    <source\n      :data-src=\"videoUrl\"\n      type=\"video/mp4\"\n    >\n  </video>\n</template>\n\n<script>\n\nimport lozad from '../plugins/lozad_'\nexport default {\n  props: {\n    videoUrl: String,\n    videoClass: String,\n    autoPlay: Boolean,\n    muted: Boolean,\n    loop: Boolean,\n    controls: Boolean\n\n  },\n\n  watch:\n            {\n              videoUrl () {\n                this.$nextTick(() => {\n                  this.$el.setAttribute('data-loaded', false)\n                  lozad(this.$el).triggerLoad(this.$el)\n                })\n              }\n            },\n  mounted () {\n    // window.addEventListener('scroll', this.handleScroll);\n    window.addEventListener('focus', this.handleFocus)\n    window.addEventListener('blur', this.handleBlur)\n\n    this.$nextTick(() => {\n      this.$el.classList.toggle('lozad')\n      lozad(this.$el).observe()\n    })\n  },\n  destroyed () {\n    // window.removeEventListener('scroll', this.handleScroll);\n    window.removeEventListener('focus', this.handleFocus)\n    window.removeEventListener('blur', this.handleBlur)\n  },\n  methods: {\n    isInViewport () {\n      const bounding = this.$refs.video.getBoundingClientRect()\n      return (\n      // bounding.top >= (0 - 0.75*bounding.height) &&\n      // (bounding.bottom >= 0 || bounding.bottom <= (bounding.height + bounding.height/3) )\n        bounding.top >= (0 - 0.75 * bounding.height) && bounding.top < (window.innerHeight || document.documentElement.clientHeight)\n      // bounding.top >= 0 && bounding.top < (window.innerHeight || document.documentElement.clientHeight)\n\n      )\n    },\n    handleScroll (event) {\n      // console.log('Scroll!');\n      // console.log('getAttribute', this.$el.getAttribute(\"data-loaded\"));\n      if (this.$refs.video.getAttribute('data-loaded')) {\n        if (this.isInViewport()) {\n          // console.log('In viewport');\n          if (this.$refs.video.paused) {\n            this.$refs.video.play()\n          }\n        } else {\n          // console.log('Not in viewport');\n          if (!this.$refs.video.paused) {\n            this.$refs.video.pause()\n          }\n        }\n      }\n    },\n    handleFocus () {\n      if (this.$refs.video.getAttribute('data-loaded')) {\n        if (this.$refs.video.paused) {\n          this.$refs.video.play()\n        }\n      }\n    },\n    handleBlur () {\n      if (this.$refs.video.getAttribute('data-loaded')) {\n        if (!this.$refs.video.paused) {\n          this.$refs.video.pause()\n        }\n      }\n    }\n  }\n\n}\n</script>\n","import { render, staticRenderFns } from \"./LazyVid.vue?vue&type=template&id=6a0adc6d&\"\nimport script from \"./LazyVid.vue?vue&type=script&lang=js&\"\nexport * from \"./LazyVid.vue?vue&type=script&lang=js&\"\n\n\n/* normalize component */\nimport normalizer from \"!../../../../node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n  script,\n  render,\n  staticRenderFns,\n  false,\n  null,\n  null,\n  null\n  \n)\n\n/* hot reload */\nif (module.hot) {\n  var api = require(\"/Users/nsierrar/Projects/PlentyMarkets/Repo-GitHub/MultiContentWidget/node_modules/vue-hot-reload-api/dist/index.js\")\n  api.install(require('vue'))\n  if (api.compatible) {\n    module.hot.accept()\n    if (!api.isRecorded('6a0adc6d')) {\n      api.createRecord('6a0adc6d', component.options)\n    } else {\n      api.reload('6a0adc6d', component.options)\n    }\n    module.hot.accept(\"./LazyVid.vue?vue&type=template&id=6a0adc6d&\", function () {\n      api.rerender('6a0adc6d', {\n        render: render,\n        staticRenderFns: staticRenderFns\n      })\n    })\n  }\n}\ncomponent.options.__file = \"resources/js/src/components/LazyVid.vue\"\nexport default component.exports"],"sourceRoot":""}