{"version":3,"sources":["webpack:///./src/views/Video.vue?d030","webpack:///./src/components/webrtc.vue?91a0","webpack:///./src/views/Video.vue?2ff4","webpack:///./src/components/webrtc.vue?9400","webpack:///src/components/webrtc.vue","webpack:///./src/components/webrtc.vue?32bf","webpack:///./src/components/webrtc.vue","webpack:///src/views/Video.vue","webpack:///./src/views/Video.vue?e157","webpack:///./src/views/Video.vue"],"names":["render","_vm","this","_h","$createElement","_c","_self","staticClass","attrs","showProgress","ref","token","socketURL","allowStream","on","logEvent","onError","staticRenderFns","_l","item","streamType","key","id","refInFor","domProps","muted","scopedSlots","_u","fn","hover","class","_v","_s","name","timer","staticStyle","isMute","_e","$event","mute","unmute","isCloseCamera","closeCamera","openCamera","hangup","component","VBtn","VCard","VCol","VHover","VIcon","VImg","VRow","window","io","data","$store","state","auth","Config","mounted","showBottomRow","$router","replace","checkMeetingStatus","beforeDestroy","$refs","webrtc","leave","methods","console","log","error","stream","event","$api","_meeting","VOverlay","VProgressCircular"],"mappings":"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","file":"js/chunk-e82ac386.20457557.js","sourcesContent":["export * from \"-!../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--6-oneOf-1-0!../../node_modules/css-loader/dist/cjs.js??ref--6-oneOf-1-1!../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../node_modules/postcss-loader/src/index.js??ref--6-oneOf-1-2!../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../node_modules/vue-loader/lib/index.js??vue-loader-options!./Video.vue?vue&type=style&index=0&id=7649e514&scoped=true&lang=css&\"","export * from \"-!../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--6-oneOf-1-0!../../node_modules/css-loader/dist/cjs.js??ref--6-oneOf-1-1!../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../node_modules/postcss-loader/src/index.js??ref--6-oneOf-1-2!../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../node_modules/vue-loader/lib/index.js??vue-loader-options!./webrtc.vue?vue&type=style&index=0&id=a4fdfcc2&scoped=true&lang=css&\"","var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:\"background\",attrs:{\"id\":\"background\"}},[_c('v-overlay',{attrs:{\"value\":_vm.showProgress}},[_c('v-progress-circular',{attrs:{\"size\":65,\"width\":5,\"color\":\"#d82e3d\",\"indeterminate\":\"\"}})],1),_c('webrtc',{ref:\"webrtc\",attrs:{\"token\":_vm.token,\"socketURL\":_vm.socketURL,\"allowStream\":_vm.allowStream},on:{\"joined-room\":_vm.logEvent,\"left-room\":_vm.logEvent,\"opened-room\":_vm.logEvent,\"share-started\":_vm.logEvent,\"share-stopped\":_vm.logEvent,\"error\":_vm.onError}})],1)}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('v-card',{staticClass:\"background2\",attrs:{\"flat\":\"\",\"id\":\"background2\"}},[_c('v-card',{staticClass:\"card-background rounded-lg\",attrs:{\"id\":\"video-layout\"}},[_c('v-row',{staticClass:\"video-list\",attrs:{\"id\":\"video-list\"}},[_vm._l((_vm.videoList),function(item){return [(item.streamType==='local')?[_c('v-card',{key:item.id,staticClass:\"local-video rounded-lg\"},[_c('video',{ref:\"videos\",refInFor:true,staticClass:\"video\",attrs:{\"autoplay\":\"\",\"playsinline\":\"\",\"width\":\"100%\",\"height\":\"100%\",\"id\":item.id},domProps:{\"muted\":item.muted}})])]:[_c('v-col',{key:item.id,staticClass:\"other-video d-flex flex-column\",attrs:{\"justify\":\"center\",\"align\":\"center\",\"id\":'col-'+item.id}},[_c('v-hover',{scopedSlots:_vm._u([{key:\"default\",fn:function(ref){\nvar hover = ref.hover;\nreturn [_c('v-card',{staticClass:\"video-card rounded-lg\",class:{ 'on-hover': hover }},[_c('v-row',{staticClass:\"name-header\",attrs:{\"no-gutters\":\"\"}},[_c('p',{staticClass:\"name\"},[_vm._v(_vm._s(item.name))])]),_c('video',{ref:\"videos\",refInFor:true,staticClass:\"video\",attrs:{\"autoplay\":\"\",\"playsinline\":\"\",\"id\":item.id},domProps:{\"muted\":item.muted}})],1)]}}],null,true)})],1)]]})],2)],1),_c('v-card',{staticClass:\"controller\"},[_c('v-card',{staticClass:\"timer rounded-xl\",attrs:{\"tile\":\"\",\"outlined\":\"\",\"align\":\"center\",\"justify\":\"center\",\"no-gutters\":\"\"}},[_c('p',{staticClass:\"time\"},[_vm._v(_vm._s(this.timer))])]),_c('v-row',{staticClass:\"ma-0 pa-0\",staticStyle:{\"height\":\"84px\"},attrs:{\"align\":\"center\",\"justify\":\"center\",\"no-gutters\":\"\"}},[_c('v-btn',{staticStyle:{\"margin\":\"12px\"},attrs:{\"icon\":\"\",\"color\":\"#ffffff\"}},[(!this.isMute)?_c('v-img',{attrs:{\"max-width\":\"20px\",\"max-height\":\"29px\",\"src\":\"/../../img/svg/mic.svg\"},on:{\"click\":function($event){return _vm.mute()}}}):_vm._e(),(this.isMute)?_c('v-img',{attrs:{\"max-width\":\"26px\",\"max-height\":\"29px\",\"src\":\"/../../img/svg/mute.svg\"},on:{\"click\":function($event){return _vm.unmute()}}}):_vm._e()],1),_c('v-btn',{staticStyle:{\"margin\":\"12px\"},attrs:{\"icon\":\"\",\"color\":\"#ffffff\"}},[(!this.isCloseCamera)?_c('v-img',{attrs:{\"max-width\":\"29px\",\"max-height\":\"18px\",\"src\":\"/../../img/svg/cam.svg\"},on:{\"click\":function($event){return _vm.closeCamera()}}}):_vm._e(),(this.isCloseCamera)?_c('v-img',{attrs:{\"max-width\":\"29px\",\"max-height\":\"26px\",\"src\":\"/../../img/svg/nocam.svg\"},on:{\"click\":function($event){return _vm.openCamera()}}}):_vm._e()],1),_c('div',{staticClass:\"divider\"}),_c('v-btn',{staticClass:\"start\",attrs:{\"fab\":\"\",\"small\":\"\",\"color\":\"#c81717\"},on:{\"click\":_vm.hangup}},[_c('v-icon',{attrs:{\"color\":\"white\"}},[_vm._v(_vm._s(\"mdi-phone-hangup\"))])],1)],1)],1)],1)}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<template>\n<v-card flat class=\"background2\" id=\"background2\">\n  <v-card id=\"video-layout\" class=\"card-background rounded-lg\">\n    <v-row class=\"video-list\" id=\"video-list\">\n      <template v-for=\"item in videoList\" v-bind:video=\"item\">\n        <template v-if=\"item.streamType==='local'\">\n          <v-card v-bind:key=\"item.id\" class=\"local-video rounded-lg\" >\n            <video autoplay playsinline ref=\"videos\" class=\"video\" width=\"100%\" height=\"100%\" :muted=\"item.muted\" :id=\"item.id\"/>\n          </v-card>\n        </template>\n\n        <template v-else>\n          <v-col v-bind:key=\"item.id\" class=\"other-video d-flex flex-column\" justify=\"center\" align=\"center\" :id=\"'col-'+item.id\">\n            <v-hover v-slot=\"{hover}\">\n              <v-card :class=\"{ 'on-hover': hover }\" class=\"video-card rounded-lg\">\n                <v-row class=\"name-header\" no-gutters>\n                  <p class=\"name\">{{item.name}}</p>\n                </v-row>\n                <video autoplay playsinline ref=\"videos\" class=\"video\" :muted=\"item.muted\" :id=\"item.id\"/>\n              </v-card>\n            </v-hover>\n          </v-col>\n        </template>\n      </template>\n    </v-row>\n  </v-card>\n  \n  <v-card class=\"controller\">\n    <v-card class=\"timer rounded-xl\" tile outlined align=\"center\" justify=\"center\" no-gutters >\n      <p class=\"time\">{{this.timer}}</p>\n    </v-card>\n    <v-row class=\"ma-0 pa-0\" align=\"center\" justify=\"center\" no-gutters style=\"height:84px;\">\n      <v-btn icon style=\"margin: 12px;\" color=\"#ffffff\">\n        <v-img v-if=\"!this.isMute\" max-width=\"20px\" max-height=\"29px\" v-on:click=\"mute()\" src=\"/../../img/svg/mic.svg\"></v-img>\n        <v-img v-if=\"this.isMute\" max-width=\"26px\" max-height=\"29px\" v-on:click=\"unmute()\" src=\"/../../img/svg/mute.svg\"></v-img>\n      </v-btn>\n      <v-btn icon style=\"margin: 12px;\" color=\"#ffffff\">\n        <v-img v-if=\"!this.isCloseCamera\" max-width=\"29px\" max-height=\"18px\" v-on:click=\"closeCamera()\" src=\"/../../img/svg/cam.svg\"></v-img>\n        <v-img v-if=\"this.isCloseCamera\" max-width=\"29px\" max-height=\"26px\" v-on:click=\"openCamera()\" src=\"/../../img/svg/nocam.svg\"></v-img>\n      </v-btn>\n      <div class=\"divider\" />\n      <v-btn fab small class=\"start\" color=\"#c81717\" @click=\"hangup\">\n        <v-icon color=\"white\">{{ \"mdi-phone-hangup\" }}</v-icon>\n      </v-btn>\n    </v-row>\n  </v-card>\n</v-card>\n</template>\n\n<script>\n  import Vue from \"vue\"\n  import VueSimpleAlert from \"vue-simple-alert\";\n  import * as RTCMultiConnection from '../plugins/RTCMultiConnection.js';\n  import * as RecordRTC from \"recordrtc\";\n  import moment from 'moment';\n\n  Vue.use(VueSimpleAlert);\n\n  require('adapterjs');\n  export default {\n    name: 'webrtc',\n    components: {\n      RTCMultiConnection,\n      RecordRTC\n    },\n    data() {\n      return {\n        name: this.$store.state.auth.name,\n        fullVideo: false,\n        rtcmConnection: null,\n        localVideo: null,\n        videoList: [],\n        canvas: null,\n        transparent: 'rgba(255, 255, 255, 0)',\n        isMute: false,\n        isCloseCamera: false,\n        startTime: moment.now(),\n        timer: '00:00:00'\n      };\n    },\n    props: {\n      // roomId: {\n      //   type: String,\n      //   default: 'public-room'\n      // },\n      token: {\n        type: String,\n        default: ''\n      },\n      socketURL: {\n        type: String,\n        default: ''\n      },\n      allowStream: {\n        type: Boolean,\n        default: true\n      },\n      cameraHeight: {\n        type: [Number, String],\n        default: 160\n      },\n      autoplay: {\n        type: Boolean,\n        default: true\n      },\n      screenshotFormat: {\n        type: String,\n        default: 'image/jpeg'\n      },\n      enableAudio: {\n        type: Boolean,\n        default: true\n      },\n      enableVideo: {\n        type: Boolean,\n        default: true\n      },\n      enableLogs: {\n        type: Boolean,\n        default: false\n      },\n      stunServer: {\n        type: String,\n        default: null\n      },\n      turnServer: {\n        type: String,\n        default: null\n      }\n    },\n    watch: {\n    },\n    mounted() {\n      this.interval = setInterval(this.updateTimer, 1000);\n\n      var that = this;\n      this.rtcmConnection = new RTCMultiConnection(this);\n      this.rtcmConnection.socketURL = this.socketURL;\n      this.rtcmConnection.autoCreateMediaElement = false;\n      this.rtcmConnection.enableLogs = this.enableLogs;\n      this.rtcmConnection.session = {\n        audio: this.enableAudio,\n        video: this.enableVideo\n      };\n      this.rtcmConnection.sdpConstraints.mandatory = {\n        OfferToReceiveAudio: this.enableAudio,\n        OfferToReceiveVideo: this.enableVideo\n      };\n      if ((this.stunServer !== null) || (this.turnServer !== null)) {\n        this.rtcmConnection.iceServers = []; // clear all defaults\n      }\n      if (this.stunServer !== null) {\n        this.rtcmConnection.iceServers.push({\n          urls: this.stunServer\n        });\n      }\n      if (this.turnServer !== null) {\n        var parse = this.turnServer.split('%');\n        var username = parse[0].split('@')[0];\n        var password = parse[0].split('@')[1];\n        var turn = parse[1];\n        this.rtcmConnection.iceServers.push({\n          urls: turn,\n          credential: password,\n          username: username\n        });\n      }\n      this.rtcmConnection.onstream = function (stream) {\n        let found = that.videoList.find(video => {\n          return video.id === stream.streamid\n        })\n        if (found === undefined) {\n          let video = {\n            id: stream.streamid,\n            muted: stream.type === 'local',\n            isRecord: false,\n            isMute: stream.type === 'local',\n            streamType: stream.type,\n            userid: stream.userid,\n            name: stream.type === 'local' ? that.name : that.$store.state.user.users[stream.userid],\n          };\n\n          that.videoList.push(video);\n\n          if (stream.type === 'local') {\n            that.localVideo = video;\n          }\n        }\n\n        setTimeout(function(){ \n          for (var i = 0, len = that.$refs.videos.length; i < len; i++) {\n            if (that.$refs.videos[i].id === stream.streamid)\n            {\n              that.$refs.videos[i].srcObject = stream.stream;\n\n              that.$refs.videos[i].onended = function() {\n                that.rtcmConnection.onstreamended(stream);\n              };\n              break;\n            }\n          }\n        }, 1000);\n\n        that.$emit('joined-room', stream.streamid);\n      };\n\n      this.rtcmConnection.onstreamended = function (stream) {\n        var newList = [];\n        that.videoList.forEach(function (item) {\n          if (item.id !== stream.streamid) {\n            newList.push(item);\n          }\n        });\n        that.videoList = newList;\n        that.$emit('left-room', stream.streamid);\n      };\n\n      // document.getElementById(\"content\").style.height = (window.innerHeight - 74)+'px';\n      // document.getElementById(\"background2\").style.height = (window.innerHeight - 74)+'px';\n      // window.scrollTo(0, 0);\n\n      window.addEventListener('resize', () => {\n        // document.getElementById(\"content\").style.height = (window.innerHeight - 74)+'px';\n        // document.getElementById(\"background2\").style.height = (window.innerHeight - 74)+'px';\n        // window.scrollTo(0, 0);\n      })\n    },\n    methods: {\n      join(roomId) {\n        var that = this;\n        this.rtcmConnection.openOrJoin(roomId, function (isRoomExist, roomid) {\n          if (isRoomExist === false && that.rtcmConnection.isInitiator === true) {\n            that.$emit('opened-room', roomid);\n          }\n        });\n      },\n      leave() {\n        this.rtcmConnection.attachStreams.forEach(function (localStream) {\n          localStream.stop();\n        });\n        this.videoList = [];\n        this.rtcmConnection.leave();\n      },\n      capture() {\n        return this.getCanvas().toDataURL(this.screenshotFormat);\n      },\n      getCanvas() {\n        let video = this.getCurrentVideo();\n        if (video !== null && !this.ctx) {\n          let canvas = document.createElement('canvas');\n          canvas.height = video.clientHeight;\n          canvas.width = video.clientWidth;\n          this.canvas = canvas;\n          this.ctx = canvas.getContext('2d');\n        }\n        const { ctx, canvas } = this;\n        ctx.drawImage(video, 0, 0, canvas.width, canvas.height);\n        return canvas;\n      },\n      getCurrentVideo() {\n        if (this.localVideo === null) {\n          return null;\n        }\n        for (var i = 0, len = this.$refs.videos.length; i < len; i++) {\n          if (this.$refs.videos[i].id === this.localVideo.id)\n            return this.$refs.videos[i];\n        }\n        return null;\n      },\n      shareScreen() {\n        var that = this;\n        if (navigator.getDisplayMedia || navigator.mediaDevices.getDisplayMedia) {\n          function addStreamStopListener(stream, callback) {\n            var streamEndedEvent = 'ended';\n            if ('oninactive' in stream) {\n                streamEndedEvent = 'inactive';\n            }\n            stream.addEventListener(streamEndedEvent, function() {\n                callback();\n                callback = function() {};\n            }, false);\n          }\n\n          function onGettingSteam(stream) {\n            that.rtcmConnection.addStream(stream);\n            that.$emit('share-started', stream.streamid);\n\n            addStreamStopListener(stream, function() {\n              that.rtcmConnection.removeStream(stream.streamid);\n              that.$emit('share-stopped', stream.streamid);\n            });\n          }\n\n          function getDisplayMediaError(error) {\n            console.log('Media error: ' + JSON.stringify(error));\n          }\n\n          if (navigator.mediaDevices.getDisplayMedia) {\n            navigator.mediaDevices.getDisplayMedia({video: true, audio: false}).then(stream => {\n              onGettingSteam(stream);\n            }, getDisplayMediaError).catch(getDisplayMediaError);\n          }\n          else if (navigator.getDisplayMedia) {\n            navigator.getDisplayMedia({video: true}).then(stream => {\n              onGettingSteam(stream);\n            }, getDisplayMediaError).catch(getDisplayMediaError);\n          }\n        }\n      },\n      mute() {\n        var that = this;\n        this.rtcmConnection.attachStreams.forEach(function (localStream) {\n          if(localStream.type === 'local'){\n            localStream.getAudioTracks()[0].enabled = false;\n            that.isMute = true;\n          }\n        });\n      },\n      unmute() {\n        var that = this;\n        this.rtcmConnection.attachStreams.forEach(function (localStream) {\n          if(localStream.type === 'local'){\n            localStream.getAudioTracks()[0].enabled = true;\n            that.isMute = false;\n          }\n        });\n      },\n      closeCamera() {\n        var that = this;\n        this.rtcmConnection.attachStreams.forEach(function (localStream) {\n          if(localStream.type === 'local'){\n            localStream.getVideoTracks()[0].enabled = false;\n            that.isCloseCamera = true;\n          }\n        });\n      },\n      openCamera() {\n        var that = this;\n        this.rtcmConnection.attachStreams.forEach(function (localStream) {\n          if(localStream.type === 'local'){\n            localStream.getVideoTracks()[0].enabled = true;\n            that.isCloseCamera = false;\n          }\n        });\n      },\n      hangup() {\n        this.$confirm('Are you sure you want to leave?', '', 'question').then(() => {\n          this.leave();\n          this.$router.replace({\n              name: 'Leave',\n          });\n        });\n      },\n      updateTimer() {\n        var start = moment(this.startTime);\n        var now = moment();\n\n        this.timer = moment.utc(now.diff(start)).format(\"HH:mm:ss\")\n      },\n    }\n  };\n</script>\n\n<style scoped>\n  @import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300;0,400;0,600;0,700;0,800;1,300;1,400;1,600;1,700;1,800&display=swap');\n\n  .background2 {\n    background: transparent;\n  height: calc(100vh - 95px);\n  }\n\n  .card-background {\n    background: #2d2d2d;\n    height: calc(100% - 48px);\n    padding: 12px;\n    margin: 24px;\n  }\n\n  .video-card {\n    background: rgba(40, 40, 40, 1);\n    height: 100%;\n    padding: 0px;\n    margin: 12px;\n  }\n\n  .video-list {\n    background: #2d2d2d;\n    height: 100%;\n    padding: 0px;\n    margin: 0px;\n    z-index: 0;\n  }\n\n  .local-video{\n    position: absolute;\n    background: rgba(105, 105, 105, 1);\n    padding: 0px;\n    margin: 0px;\n    width: 22%;\n    height: 22%;\n    z-index: 1;\n    right: 0px;\n    bottom: 40px;\n  }\n  \n  .other-video {\n    background: #2d2d2d;\n    padding: 0px;\n    margin: 0px;\n    z-index: 0;\n    min-width: 50%;\n  }\n\n  .name-header {\n    position: absolute;\n    padding: 0;\n    margin: 0;\n    height: 12%;\n    width: 100%;\n    z-index: 1;\n    background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.4) 1%, rgba(0, 0, 0, 0.1));\n  }\n\n  .name {\n    position: absolute;\n    padding: 0px;\n    margin: 0px;\n    padding-left: 20px;\n    font-family: 'Open Sans';\n    font-size: 18px;\n    font-weight: normal;\n    font-stretch: normal;\n    font-style: normal;\n    line-height: normal;\n    letter-spacing: normal;\n    color: white;\n    top: 50%;\n    transform: translate(0%, -50%);\n  }\n\n  .video {\n    position: absolute;\n    width: 100%;\n    height: 100%;\n    left: 0;\n  }\n\n  .show-btns {\n    opacity: 1 !important;\n  }\n\n  .controller {\n    position: absolute;\n    background-image: linear-gradient(92deg, #23425a 0%, #243941 99%);\n    /* opacity: 0.8; */\n    padding: 0px;\n    margin: 0px;\n    width: 100%;\n    height: 84px;\n    z-index: 1;\n    bottom: 0px;\n  }\n\n  .timer {\n    position: absolute;\n    background: white;\n    padding: 0px;\n    margin: 0px;\n    width: 280px;\n    height: 32px;\n    z-index: 1;\n    left: 50%;\n    transform: translate(-50%, -50%);\n  }\n  \n  .time {\n    position: absolute;\n    padding: 0px;\n    margin: 0px;\n    width: 100%;\n    font-family: 'Open Sans';\n    font-size: 18px;\n    font-weight: bold;\n    font-stretch: normal;\n    font-style: normal;\n    line-height: normal;\n    letter-spacing: normal;\n    top: 50%;\n    transform: translate(0%, -50%);\n  }\n  \n  .divider {\n    width: 1px;\n    height: 30px;\n    background: #ffffff;\n    margin: 0 28px 0 28px;\n  }\n\n  .start {\n    margin: 12px;\n    padding: 0px;\n    font-family: 'Open Sans';\n    font-size: 16px;\n    font-weight: bold;\n    font-stretch: normal;\n    font-style: normal;\n    line-height: normal;\n    letter-spacing: normal;\n    text-transform: none !important;\n  }\n\n  @media screen and (max-width: 960px) {\n      .card-background {\n          background: white;\n          height: 100%;\n          padding: 0px;\n          margin: 0px;\n      }\n\n      .video-card {\n        background: rgba(40, 40, 40, 1);\n        height: 100%;\n        padding: 0px;\n        margin: 2px;\n      }\n\n      .video-list {\n        background: white;\n        height: calc(100% - 84px);\n        padding: 0px;\n        margin: 0px;\n        z-index: 0;\n      }\n\n      .other-video {\n        background: black;\n        padding: 0px;\n        margin: 0px;\n        z-index: 0;\n        min-width: 50%;\n      }\n\n      .timer {\n        position: absolute;\n        background: white;\n        padding: 0px;\n        margin: 0px;\n        width: 180px;\n        height: 32px;\n        z-index: 1;\n        left: 50%;\n        transform: translate(-50%, -50%);\n      }\n      \n      .time {\n        position: absolute;\n        padding: 0px;\n        margin: 0px;\n        width: 100%;\n        font-family: 'Open Sans';\n        font-size: 18px;\n        font-weight: bold;\n        font-stretch: normal;\n        font-style: normal;\n        line-height: normal;\n        letter-spacing: normal;\n        top: 50%;\n        transform: translate(0%, -50%);\n      }\n\n      .local-video{\n        position: absolute;\n        background: rgba(105, 105, 105, 1);\n        padding: 0px;\n        margin: 0px;\n        width: 22%;\n        height: 22%;\n        z-index: 1;\n        right: 10px;\n        bottom: 100px;\n      }\n\n      .controller {\n        position: absolute;\n        background-image: linear-gradient(92deg, #23425a 0%, #243941 99%);\n        /* opacity: 0.8; */\n        padding: 0px;\n        margin: 0px;\n        width: 100%;\n        height: 84px;\n        z-index: 1;\n        bottom: 0px;\n      }\n  }\n</style>\n","import mod from \"-!../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../node_modules/thread-loader/dist/cjs.js!../../node_modules/babel-loader/lib/index.js!../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../node_modules/vue-loader/lib/index.js??vue-loader-options!./webrtc.vue?vue&type=script&lang=js&\"; export default mod; export * from \"-!../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../node_modules/thread-loader/dist/cjs.js!../../node_modules/babel-loader/lib/index.js!../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../node_modules/vue-loader/lib/index.js??vue-loader-options!./webrtc.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./webrtc.vue?vue&type=template&id=a4fdfcc2&scoped=true&\"\nimport script from \"./webrtc.vue?vue&type=script&lang=js&\"\nexport * from \"./webrtc.vue?vue&type=script&lang=js&\"\nimport style0 from \"./webrtc.vue?vue&type=style&index=0&id=a4fdfcc2&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  \"a4fdfcc2\",\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 { VBtn } from 'vuetify/lib/components/VBtn';\nimport { VCard } from 'vuetify/lib/components/VCard';\nimport { VCol } from 'vuetify/lib/components/VGrid';\nimport { VHover } from 'vuetify/lib/components/VHover';\nimport { VIcon } from 'vuetify/lib/components/VIcon';\nimport { VImg } from 'vuetify/lib/components/VImg';\nimport { VRow } from 'vuetify/lib/components/VGrid';\ninstallComponents(component, {VBtn,VCard,VCol,VHover,VIcon,VImg,VRow})\n","<template>\n<div class=\"background\" id=\"background\">\n  <v-overlay :value=\"showProgress\">\n    <v-progress-circular :size=\"65\" :width=\"5\" color=\"#d82e3d\" indeterminate/>\n  </v-overlay>\n  <webrtc\n    ref=\"webrtc\"\n    :token=\"token\"\n    :socketURL=\"socketURL\"\n    :allowStream=\"allowStream\"\n    v-on:joined-room=\"logEvent\"\n    v-on:left-room=\"logEvent\"\n    v-on:opened-room=\"logEvent\"\n    v-on:share-started=\"logEvent\"\n    v-on:share-stopped=\"logEvent\"\n    @error=\"onError\" />\n</div>\n</template>\n\n<script>\nimport Vue from \"vue\";\nimport WebRTC from \"../components/webrtc\";\nimport Config from \"../plugins/Config\"\n\nimport * as io from \"socket.io-client\";\nwindow.io = io;\n\nVue.component(WebRTC.name, WebRTC);\n\nexport default {\n  name: 'Video',\n\n  data() {\n    return {\n      token: this.$store.state.auth.token,\n      allowStream: true,\n      showProgress: true,\n      socketURL: Config.URL.SOCKET_SERVER\n    }\n  },\n\n  mounted: function() {\n    this.showBottomRow(false);\n\n    if(this.$store.state.auth.token !== this.$route.query.token) {\n      this.$router.replace({\n          name: 'User',\n          query: {\n              token: this.$route.query.token\n          }\n      }).catch(() => {});\n    }else{\n      this.checkMeetingStatus(this.token, 'N');\n    }\n  },\n\n  beforeDestroy: function() {\n    this.$refs.webrtc.leave();\n  },\n\n  methods: {\n    showBottomRow(isShow) {\n      if(isShow) document.getElementById(\"bottom-row\").style.display = \"block\";\n      else document.getElementById(\"bottom-row\").style.display = \"none\";\n    },\n    onError(error, stream) {\n      console.log(\"On Error Event\", error, stream);\n    },\n    logEvent(event) {\n      console.log(\"Event : \", event);\n    },\n    checkMeetingStatus(token, isHost) {\n      this.$api._meeting\n        .checkMeetingStatus({\n            token: token,\n            ishost: isHost\n        })\n        .then((response) => {\n          if(response.data.status === \"200\"){\n            this.$refs.webrtc.join(response.data.data.meeting_id);\n            this.$store.dispatch(\"tokenInfo/setTokenInfo\", {\n              subject: response.data.data.subject,\n              staffName: response.data.data.staff_name,\n              meetingNo: response.data.data.meeting_no,\n              availableStartTime: response.data.data.available_start_datetime,\n            });\n          }\n          this.showProgress = false;\n        });\n    }\n  }\n}\n</script>\n\n<style scoped>\n.background {\n  margin: 0;\n  padding: 0;\n  height: calc(100vh - 85px);\n}\n\n@media screen and (max-width: 960px) {\n    .background {\n      margin: 0;\n      padding: 0;\n      height: calc(100%);\n    }\n}\n</style>","import mod from \"-!../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../node_modules/thread-loader/dist/cjs.js!../../node_modules/babel-loader/lib/index.js!../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../node_modules/vue-loader/lib/index.js??vue-loader-options!./Video.vue?vue&type=script&lang=js&\"; export default mod; export * from \"-!../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../node_modules/thread-loader/dist/cjs.js!../../node_modules/babel-loader/lib/index.js!../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../node_modules/vue-loader/lib/index.js??vue-loader-options!./Video.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./Video.vue?vue&type=template&id=7649e514&scoped=true&\"\nimport script from \"./Video.vue?vue&type=script&lang=js&\"\nexport * from \"./Video.vue?vue&type=script&lang=js&\"\nimport style0 from \"./Video.vue?vue&type=style&index=0&id=7649e514&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  \"7649e514\",\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 { VOverlay } from 'vuetify/lib/components/VOverlay';\nimport { VProgressCircular } from 'vuetify/lib/components/VProgressCircular';\ninstallComponents(component, {VOverlay,VProgressCircular})\n"],"sourceRoot":""}