{"version":3,"sources":["webpack:///./src/components/VideoPlayer/VideoPlayerBadges.vue?e78e","webpack:///./src/components/VideoPlayer/VideoPlayerBadges.vue?2c66","webpack:///src/components/VideoPlayer/VideoPlayerBadges.vue","webpack:///./src/components/VideoPlayer/VideoPlayerBadges.vue?522d","webpack:///./src/components/VideoPlayer/VideoPlayerBadges.vue"],"names":["render","_vm","this","_h","$createElement","_c","_self","staticClass","staticStyle","on","closeVideo","_v","ref","_e","staticRenderFns","name","props","options","type","Object","default","data","player","completeCheck","isPlaying","showModal","computed","watch","methods","location","reload","watchplayer","$route","matched","path","substring","time","console","log","$root","$refs","videoSection","submitCompleted","mounted","controlBar","progressControl","disable","self","beforeDestroy","dispose","component","VIcon"],"mappings":"mHAAA,W,2CCAA,IAAIA,EAAS,WAAa,IAAIC,EAAIC,KAASC,EAAGF,EAAIG,eAAmBC,EAAGJ,EAAIK,MAAMD,IAAIF,EAAG,OAAQF,EAAa,UAAEI,EAAG,MAAM,CAACE,YAAY,cAAcC,YAAY,CAAC,IAAM,MAAM,KAAO,MAAM,MAAQ,OAAO,OAAS,SAAS,CAACH,EAAG,MAAM,CAACE,YAAY,aAAaE,GAAG,CAAC,MAAQR,EAAIS,aAAa,CAACL,EAAG,SAAS,CAACJ,EAAIU,GAAG,gBAAgB,GAAGN,EAAG,MAAM,CAACE,YAAY,iBAAiB,CAACF,EAAG,QAAQ,CAACO,IAAI,cAAcL,YAAY,uCAAuCN,EAAIY,MAC7bC,EAAkB,G,iCCiBtB,GACEC,KAAM,cACNC,MAAO,CACLC,QAAS,CACPC,KAAMC,OACNC,QAFN,WAGQ,MAAO,MAIbC,KAVF,WAWI,MAAO,CACLC,OAAQ,KACRC,eAAe,EACfC,WAAW,EACXC,WAAN,IAGEC,SAAU,GAGVC,MAAO,GAEPC,QAAS,CAeP,WAfJ,WAgBM1B,KAAKuB,WAAX,EAEMI,SAASC,UAEXC,YApBJ,WAqBM,IAAN,aACA,sDAIuD,WAA7C7B,KAAK8B,OAAOC,QAAQ,GAAGC,KAAKC,UAAU,IAC5B,IAARC,GAAclC,KAAKqB,gBACrBc,QAAQC,IAAIF,EAAM,gBAClBlC,KAAKqC,MAAMC,MAAMC,aAAaC,gBACxC,sDACA,2BAEUxC,KAAKqB,eAAgB,KAK7BoB,QA7DF,WA6DA,WACA,wCACA,SACA,mBACA,YACA,cAEIzC,KAAKoB,OAAS,IAClB,uBACA,cACA,eAIIpB,KAAKoB,OAAOsB,WAAWC,gBAAgBC,UACvC,IAAJ,OACI5C,KAAKoB,OAAOb,GAAG,cAAnB,WACM4B,QAAQC,IAAI,aAAlB,4CAEMS,EAAKhB,iBAGP,KAAJ,8BACM,EAAN,yBAGEiB,cAvFF,WAwFI9C,KAAKoB,OAAO2B,YC1G0V,I,0DCQtWC,EAAY,eACd,EACAlD,EACAc,GACA,EACA,KACA,WACA,MAIa,aAAAoC,EAAiB,QAKhC,IAAkBA,EAAW,CAACC,QAAA,Q","file":"js/chunk-ca1ec472.38bbac01.js","sourcesContent":["export * from \"-!../../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--7-oneOf-1-0!../../../node_modules/css-loader/dist/cjs.js??ref--7-oneOf-1-1!../../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../../node_modules/postcss-loader/src/index.js??ref--7-oneOf-1-2!../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./VideoPlayerBadges.vue?vue&type=style&index=0&id=755d3855&scoped=true&lang=css&\"","var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return (_vm.showModal)?_c('div',{staticClass:\"video-modal\",staticStyle:{\"top\":\"0px\",\"left\":\"0px\",\"width\":\"100%\",\"height\":\"100%\"}},[_c('div',{staticClass:\"close-icon\",on:{\"click\":_vm.closeVideo}},[_c('v-icon',[_vm._v(\"mdi-close\")])],1),_c('div',{staticClass:\"modal-content\"},[_c('video',{ref:\"videoPlayer\",staticClass:\"video-js vjs-big-play-centered\"})])]):_vm._e()}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<template>\r\n  <div  class=\"video-modal\" style=\"top: 0px;\r\n    left: 0px;\r\n    width: 100%;\r\n    height: 100%;\" v-if=\"showModal\">\r\n     <div class=\"close-icon\" @click=\"closeVideo\">\r\n      <v-icon>mdi-close</v-icon>\r\n    </div>\r\n    <div class=\"modal-content\">\r\n      <video ref=\"videoPlayer\" class=\"video-js vjs-big-play-centered\"></video>\r\n   \r\n    </div>\r\n  </div>\r\n</template>\r\n<script>\r\nimport \"video.js/dist/video-js.css\";\r\nimport videojs from \"video.js\";\r\n\r\nexport default {\r\n  name: \"VideoPlayer\",\r\n  props: {\r\n    options: {\r\n      type: Object,\r\n      default() {\r\n        return {};\r\n      },\r\n    },\r\n  },\r\n  data() {\r\n    return {\r\n      player: null,\r\n      completeCheck: true,\r\n      isPlaying: false,\r\n      showModal:true,\r\n    };\r\n  },\r\n  computed: {\r\n    \r\n  },\r\n  watch: {\r\n  },\r\n  methods: {\r\n \r\n  \r\n    // playTheVideo(){\r\n    //   this.player.play()\r\n    // },\r\n    // pauseTheVideo(){\r\n    //   this.player.pause()\r\n    // },\r\n    // playing(){\r\n    //   this.isPlaying = true\r\n    // },\r\n    // paused(){\r\n    //   this.isPlaying=false\r\n    // },\r\n       closeVideo() {\r\n      this.showModal=false // Pause the video before closing\r\n      // Emit an event to the parent to close the modal\r\n      location.reload();\r\n    },\r\n    watchplayer() {\r\n      let time = Math.round(\r\n        (this.player.currentTime() / this.player.duration()) * 100\r\n      );\r\n      // console.log(time,\"jdjdjd\")\r\n\r\n      if (this.$route.matched[0].path.substring(1) === \"parent\") {\r\n        if (time == 80 && this.completeCheck) {\r\n          console.log(time, \"80% has done\");\r\n          this.$root.$refs.videoSection.submitCompleted(\r\n            this.$store.state.videoSection.videoModal.videoObject,\r\n            this.player.currentTime()\r\n          );\r\n          this.completeCheck = false;\r\n        }\r\n      }\r\n    },\r\n  },\r\n  mounted() {\r\n  this.player = videojs(this.$refs.videoPlayer, {\r\n    fluid: true, // Make the player responsive\r\n    aspectRatio: '16:9', // Maintain the aspect ratio\r\n    autoplay: false,\r\n    controls: true,\r\n  });\r\n    this.player = videojs(\r\n      this.$refs.videoPlayer,\r\n      this.options,\r\n      function onPlayerReady() {\r\n        // console.log(\"onPlayerReady\", this);\r\n      }\r\n    );\r\n    this.player.controlBar.progressControl.disable();\r\n    const self = this;\r\n    this.player.on(\"timeupdate\",function(){\r\n      console.log(\"timeupdate\",self.player.currentTime(),self.player.duration())\r\n      // alert(\"time\")\r\n      self.watchplayer()\r\n      // self.player.currentTime()\r\n    });\r\n      this.player.on(\"ended\", () => {\r\n      this.$emit(\"video-ended\");\r\n    });\r\n  },\r\n  beforeDestroy() {\r\n    this.player.dispose();\r\n  },\r\n\r\n};\r\n</script>\r\n<style scoped>\r\n.video-modal {\r\n  position: fixed;\r\n  top: 0;\r\n  left: 0;\r\n  width: 100%;\r\n  height: 100%;\r\n  background-color: rgba(0, 0, 0, 0.8); /* Semi-transparent black background */\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  z-index: 1000;\r\n}\r\n\r\n.modal-content {\r\n  position: relative;\r\n  width: 80%;\r\n  max-width: 900px;\r\n  background: transparent;\r\n  padding: 0;\r\n  border-radius: 10px;\r\n  aspect-ratio: 16/9;\r\n}\r\n\r\n.video-js {\r\n  width: 100%;\r\n  height: auto;\r\n}\r\n\r\n/* Style the close button */\r\n.close-icon {\r\n  position: absolute;\r\n  top: 20px;\r\n  right: 20px;\r\n  font-size: 32px; /* Larger size for visibility */\r\n  color: white; /* Make the close icon white */\r\n  cursor: pointer;\r\n  z-index: 1001; /* Make sure the close icon is above other elements */\r\n}\r\n\r\n.close-icon:hover {\r\n  color: red; /* Optional: Add hover effect to make it more interactive */\r\n}\r\n.theme--light.v-icon {\r\n    /* color: rgba(0, 0, 0, 0.54); */\r\n    color: white;\r\n}\r\n</style>","import mod from \"-!../../../node_modules/cache-loader/dist/cjs.js??ref--13-0!../../../node_modules/thread-loader/dist/cjs.js!../../../node_modules/babel-loader/lib/index.js!../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./VideoPlayerBadges.vue?vue&type=script&lang=js&\"; export default mod; export * from \"-!../../../node_modules/cache-loader/dist/cjs.js??ref--13-0!../../../node_modules/thread-loader/dist/cjs.js!../../../node_modules/babel-loader/lib/index.js!../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./VideoPlayerBadges.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./VideoPlayerBadges.vue?vue&type=template&id=755d3855&scoped=true&\"\nimport script from \"./VideoPlayerBadges.vue?vue&type=script&lang=js&\"\nexport * from \"./VideoPlayerBadges.vue?vue&type=script&lang=js&\"\nimport style0 from \"./VideoPlayerBadges.vue?vue&type=style&index=0&id=755d3855&scoped=true&lang=css&\"\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  \"755d3855\",\n  null\n  \n)\n\nexport default component.exports\n\n/* vuetify-loader */\nimport installComponents from \"!../../../node_modules/vuetify-loader/lib/runtime/installComponents.js\"\nimport { VIcon } from 'vuetify/lib/components/VIcon';\ninstallComponents(component, {VIcon})\n"],"sourceRoot":""}