webpackJsonp([1],{"+rM4":function(t,e){},NHnr:function(t,e,i){"use strict";Object.defineProperty(e,"__esModule",{value:!0});var s=i("kV13"),o={render:function(){var t=this.$createElement;return(this._self._c||t)("router-view")},staticRenderFns:[]};var a=i("C7Lr")({name:"App"},o,!1,function(t){i("xUdR")},null,null).exports,n=i("wUgx"),r=i("I29D"),l=i.n(r);let c="http://localhost:3000";var u={name:"HelloWorld",data:function(){return{test_val:2,cur_video:null,video_src:"http://localhost:3000/video/test.mp4",audio_src:"http://localhost:3000/audio/test.mp3",video_src_base:"",audio_src_base:"",image_base:"",tmin:-3,tmax:3,l_ptime:0,l_mtime:0,ptime:0,step:.1,form:{},action_list:[],video_list:null,op_text:""}},created:function(){this.base="http://localhost:3000/",this.video_src_base=this.base+"video/",this.audio_src_base=this.base+"audio/",this.image_base=this.base+"public/images/";var t=3*Math.random(),e=Math.floor(10*Math.random());e%=2,this.rand=t,this.mod=e},mounted:function(){this.getvideos(),this.getVAndA(),this.mod?this.video.currentTime+=this.rand:this.audio.currentTime+=this.rand},methods:{getVAndA:function(){this.video=document.getElementById("video"),this.audio=document.getElementById("audio")},changeVideo:function(t){this.cur_video=t,this.setUrls(),this.getVAndA(),this.action_list=[],console.log(t)},pTimeChange:function(){var t=this.ptime/100-this.l_ptime;this.l_ptime=this.ptime/100;var e=this.audio.currentTime+"/"+t;this.audio.currentTime===this.audio.duration||(this.audio.currentTime+=t);var i="Aideo Ahead, with value "+(t=t.toFixed(2))+" s";this.action_list.push(e),this.op_text=this.op_text+i+"\n",this.$message({message:i,type:"success"})},mTimeChange:function(){this.l_ptime=this.mtime/100;var t=this.audio.currentTime+"/"+step;this.video.currentTime===this.video.duration||(this.video.currentTime-=step),pt=pt.toFixed(2);var e="Video Backward, with value "+mt+" s";this.action_list.push(t),this.op_text=this.op_text+e+"\n",this.$message({message:e,type:"success"})},setUrls:function(){this.video_src=this.video_src_base+(this.cur_video+".mp4"),this.audio_src=this.audio_src_base+(this.cur_video+".mp3"),this.video.src=this.video_src,this.audio.src=this.audio_src},getvideos:function(){var t=this;(t=>l.a.get(`${c}/available_videos`,{params:t}))(null).then(function(e){t.video_list=e.data.video_names,t.cur_video=t.video_list[0],t.setUrls(),console.log(t.video_list)})},upload_result:function(){var t=this;this.pause();var e=this.form,i=(new Date).valueOf();e.video_name=this.cur_video,e.actions=this.action_list.join("|"),e.timestamp=i,e.rand=this.rand,console.log(e),(t=>l.a.post(`${c}/upload_result`,t).then(t=>t.data))(e).then(function(e){0==e.status?t.$notify({title:"Success",message:"Your Response has been uploaded, Thank you!",type:"success"}):t.$notify.error({title:"Fail",message:"Something Wrong in uploading, please check.",type:"success"})})},play:function(){this.video.paused&&this.audio.paused&&(video.play(),audio.play()),console.log("click play")},pause:function(){this.video.pause(),this.audio.pause(),console.log("click pause")},click_good_integration:function(){this.form.indicator=1,this.upload_result(),console.log("good integration")},click_bad_integration:function(){this.form.indicator=0,this.upload_result(),console.log("bad integration")},pstep:function(){var t=this.step;this.l_ptime=this.l_ptime+t;var e=this.audio.currentTime+"/"+t;this.audio.currentTime===this.audio.duration||(this.audio.currentTime+=t);var i="Audio Forward, with value "+(t=t.toFixed(2))+" , and current audio time "+this.audio.currentTime+"s, videotime"+this.video.currentTime+" s";this.action_list.push(e),this.op_text=this.op_text+i+"\n",this.$message({message:i,type:"success"})},mstep:function(){var t=this.step;this.l_ptime=this.l_ptime-t;var e=this.audio.currentTime+"/"+t;this.audio.currentTime===this.audio.duration||(this.audio.currentTime-=t);var i="Audio Backward, with value "+(t=t.toFixed(2))+" , and current audio time "+this.audio.currentTime+"s, videotime"+this.video.currentTime+" s";this.action_list.push(e),this.op_text=this.op_text+i+"\n",this.$message({message:i,type:"success"})},formatTooltip:function(t){return t=(t=(t-50)/100).toFixed(2)}}},d={render:function(){var t=this,e=t.$createElement,i=t._self._c||e;return i("div",{staticStyle:{display:"block",width:"100%","margin-left":"auto","margin-right":"auto"}},[i("audio",{attrs:{id:"audio",preload:"auto"}},[i("source",{attrs:{src:t.audio_src}})]),t._v(" "),i("el-container",[i("el-header",{staticStyle:{height:"10%"}},[i("center",[t._v("Audiovisual Integration")])],1),t._v(" "),i("el-main",[i("el-row",{attrs:{type:"flex",justify:"space-between"}},[i("el-col",{staticClass:"videoscreen",attrs:{span:20}},[i("video",{attrs:{preload:"auto",id:"video"}},[i("source",{attrs:{src:t.video_src}})])]),t._v(" "),i("el-col",{staticClass:"videolist",staticStyle:{"margin-left":"10px"},attrs:{span:10}},[i("div",{staticClass:"title-1"},[t._v("Video List")]),t._v(" "),i("div",{staticStyle:{"overflow-y":"scroll",height:"600px"}},t._l(t.video_list,function(e,s){return i("el-card",{key:s,attrs:{shadow:"hover"}},[i("el-row",[i("el-col",{attrs:{span:10}},[i("el-image",{staticStyle:{width:"100%",height:"100%"},attrs:{src:t.image_base+e+".png",fit:""}})],1),t._v(" "),i("el-col",{attrs:{span:10}},[i("div",{staticStyle:{padding:"14px"}},[i("span",[t._v(t._s(e))]),t._v(" "),i("div",{staticClass:"bottom clearfix"},[i("el-button",{staticClass:"button",attrs:{type:"text"},on:{click:function(i){return t.changeVideo(e)}}},[t._v("View This Video")])],1)])])],1)],1)}),1)])],1),t._v(" "),i("el-row",{staticStyle:{"font-size":"2ex"},attrs:{type:"flex",justify:"space-between"}},[i("el-col",{staticStyle:{"margin-left":"10px"}},[i("el-row",{attrs:{type:"flex",justify:"center"}},[i("el-col",{attrs:{span:5}}),t._v(" "),i("el-col",{attrs:{span:5}},[i("el-button",{attrs:{icon:"el-icon-video-play"},on:{click:t.play}},[t._v("Play")])],1),t._v(" "),i("el-col",{attrs:{span:5}},[i("el-button",{attrs:{icon:"el-icon-video-pause"},on:{click:t.pause}},[t._v("Pause")])],1),t._v(" "),i("el-col",{attrs:{span:5}})],1),t._v(" "),i("el-row",{attrs:{type:"flex",justify:"center"}},[i("el-col",{staticStyle:{},attrs:{span:5}},[t._v("Change audio timeline for your integration")]),t._v(" "),i("el-col",{attrs:{span:2}},[i("el-button",{attrs:{icon:"el-icon-d-arrow-left"},on:{click:t.mstep}})],1),t._v(" "),i("el-col",{attrs:{span:8}},[i("el-inputNumber",{attrs:{step:"0.01",precision:"2",placeholder:"0"},model:{value:t.l_ptime,callback:function(e){t.l_ptime=e},expression:"l_ptime"}})],1),t._v(" "),i("el-col",{attrs:{span:2}},[i("el-button",{attrs:{icon:"el-icon-d-arrow-right"},on:{click:t.pstep}})],1),t._v(" "),i("el-col",{attrs:{span:5}})],1),t._v(" "),i("el-row",{attrs:{type:"flex",justify:"center"}},[i("el-col",{attrs:{span:5}},[t._v("Response:")]),t._v(" "),i("el-col",{attrs:{span:5}},[i("el-button",{attrs:{type:"success"},on:{click:t.click_good_integration}},[t._v("Good Integration")])],1),t._v(" "),i("el-col",{attrs:{span:5}},[i("el-button",{attrs:{type:"warning"},on:{click:t.click_bad_integration}},[t._v("Bad Integration")])],1),t._v(" "),i("el-col",{attrs:{span:5}})],1)],1),t._v(" "),i("el-col",{staticStyle:{"margin-left":"10px"},attrs:{span:12}},[i("el-input",{attrs:{type:"textarea",disabled:"",rows:8,placeholder:"Your Operation will be shown here"},model:{value:t.op_text,callback:function(e){t.op_text=e},expression:"op_text"}})],1)],1)],1),t._v(" "),i("el-footer",[i("el-row",[t._v("\n        Human Systems Laboratroy @ CUHK-SZ\n      ")])],1)],1)],1)},staticRenderFns:[]};var p=i("C7Lr")(u,d,!1,function(t){i("+rM4")},"data-v-3477c840",null).exports;s.default.use(n.a);var h=new n.a({routes:[{path:"/",name:"HelloWorld",component:p}]}),_=i("bQIR"),v=i.n(_);i("gFLX");s.default.config.productionTip=!1,s.default.use(v.a),new s.default({el:"#app",router:h,components:{App:a},template:"<App/>"})},gFLX:function(t,e){},xUdR:function(t,e){}},["NHnr"]);
//# sourceMappingURL=app.35b86a95d84a48114219.js.map