diff --git a/web/libs/css/dash2.timelapse.css b/web/libs/css/dash2.timelapse.css deleted file mode 100644 index 924bc2fc..00000000 --- a/web/libs/css/dash2.timelapse.css +++ /dev/null @@ -1,13 +0,0 @@ -#timelapse_video_line{overflow-y:scroll;overflow-x:hidden;max-height:400px;margin:0;text-align:left} -#timelapse_video_display .videoBefore,#timelapse_video_display .videoAfter{display:none} -.timelapse_video:not(:last-child){border-bottom:1px solid #444;} -.timelapse_video .frame{width:50px;height:50px;background-size:cover;background-position:center;border-radius:5px} -.timelapse_video>div>div:not(:last-child){padding-right:10px} -.timelapse_video .flex-block:not(:last-child){padding-bottom:10px} -.timelapse_video.list-group-item{padding:10px} -.timelapse_hud{position: relative;background:#000} -.timelapse_hud .timelapse_playRate{position: absolute;font-family: monospace;top:10px;right:0;left:0;margin:auto;font-size:23px} -#timelapse .progress-bar{transition:0.5s!important} -.timelapse_hud .controlBar{position: absolute;background:rgba(22,22,22,0.8);width:100%;left:0;bottom:0;} -.timelapse_hud .hover-hide{opacity:0} -.timelapse_hud:hover .hover-hide{opacity:1;z-index:5} diff --git a/web/libs/js/dash2.powerVideo2.js b/web/libs/js/dash2.powerVideo2.js index 62507160..62eca554 100644 --- a/web/libs/js/dash2.powerVideo2.js +++ b/web/libs/js/dash2.powerVideo2.js @@ -503,17 +503,17 @@ $(document).ready(function(e){ powerVideoWindow.on('shown.bs.modal',function(){ drawMonitorsList() }) - $.powerVideoViewer = { - window: powerVideoWindow, - drawMonitorsList: drawMonitorsList, - activeTimeline: activeTimeline, - monitorListElement: powerVideoMonitorsListElement, - monitorViewsElement: powerVideoMonitorViewsElement, - timelineStripsElement: powerVideoTimelineStripsContainer, - dateRangeElement: powerVideoDateRangeElement, - loadedVideos: powerVideoLoadedVideos, - loadedEvents: powerVideoLoadedEvents, - loadedChartData: powerVideoLoadedChartData, - loadedTableGroupIds: loadedTableGroupIds - } + // $.powerVideoViewer = { + // window: powerVideoWindow, + // drawMonitorsList: drawMonitorsList, + // activeTimeline: activeTimeline, + // monitorListElement: powerVideoMonitorsListElement, + // monitorViewsElement: powerVideoMonitorViewsElement, + // timelineStripsElement: powerVideoTimelineStripsContainer, + // dateRangeElement: powerVideoDateRangeElement, + // loadedVideos: powerVideoLoadedVideos, + // loadedEvents: powerVideoLoadedEvents, + // loadedChartData: powerVideoLoadedChartData, + // loadedTableGroupIds: loadedTableGroupIds + // } }) diff --git a/web/libs/js/dash2.timelapse.js b/web/libs/js/dash2.timelapse.js deleted file mode 100644 index 0334d9e8..00000000 --- a/web/libs/js/dash2.timelapse.js +++ /dev/null @@ -1,334 +0,0 @@ -$(document).ready(function(e){ - //Timelapse Window - $.timelapse={e:$('#timelapse')} - $.timelapse.f=$.timelapse.e.find('form'), - $.timelapse.meter=$.timelapse.e.find('.motion-meter'), - $.timelapse.line=$('#timelapse_video_line'), - $.timelapse.display=$('#timelapse_video_display'), - $.timelapse.seekBar=$('#timelapse_seekBar'), - $.timelapse.seekBarProgress=$.timelapse.seekBar.find('.progress-bar'), - $.timelapse.dr=$('#timelapse_daterange'), - $.timelapse.mL=$.timelapse.e.find('.motion_list'), - $.timelapse.monitors=$.timelapse.e.find('.monitors_list'); - $.timelapse.playDirection='videoAfter' - $.timelapse.playRate=15 - $.timelapse.placeholder=placeholder.getData(placeholder.plcimg({bgcolor:'#b57d00',text:'...'})) - $.timelapse.dr.daterangepicker({ - startDate:$.ccio.timeObject().subtract(moment.duration("24:00:00")), - endDate:$.ccio.timeObject().add(moment.duration("24:00:00")), - timePicker: true, - timePicker24Hour: true, - timePickerSeconds: true, - timePickerIncrement: 30, - locale: { - format: 'MM/DD/YYYY h:mm A' - } - },function(start, end, label){ - $.timelapse.drawTimeline() - $.timelapse.dr.focus() - }); - $.timelapse.f.find('input,select').change(function(){ - $.timelapse.f.submit() - }) - $.timelapse.f.submit(function(e){ - e.preventDefault(); - $.timelapse.drawTimeline() - return false; - }) - $.timelapse.drawTimeline=function(getData){ - var e={}; - if(getData===undefined){getData=true} - var mid = $.timelapse.monitors.val() - e.dateRange=$.timelapse.dr.data('daterangepicker'); - e.dateRange={startDate:e.dateRange.startDate,endDate:e.dateRange.endDate} - e.videoURL=$.ccio.init('location',$user)+$user.auth_token+'/videos/'+$user.ke+'/'+mid; - e.videoURL+='?limit=100&start='+$.ccio.init('th',e.dateRange.startDate)+'&end='+$.ccio.init('th',e.dateRange.endDate); - e.next=function(videos){ - $.timelapse.currentVideos={} - e.tmp='' - $.each(videos.videos,function(n,v){ - if(!v||!v.time){return} - // v.filename=$.ccio.init('tf',v.time)+'.'+v.ext; - v.videoBefore=videos.videos[n-1]; - v.videoAfter=videos.videos[n+1]; - // if(v.href.charAt(0)==='/'){ - // v.href=$.ccio.init('location',user)+(v.href.substring(1)) - // v.videoURL=$.ccio.init('location',user)+(v.videoURL.substring(1)) - // } - v.position=n; - $.timelapse.currentVideos[v.filename]=v; - e.tmp+='
  • ' - e.tmp+='
    ' - e.tmp+='
    ' - e.tmp+='
    '+v.filename+'
    ' - e.tmp+='' - e.tmp+='
    ' - e.tmp+='
    ' - e.tmp+='
    ' - e.tmp+='
    ' - e.tmp+='
  • ' - }) - $.timelapse.line.html(e.tmp) - $.ccio.init('ls') - if(getData===true){ - e.timeout=50 - }else{ - e.timeout=2000 - } - setTimeout(function(){ - if($.timelapse.e.find('.timelapse_video.active').length===0){ - $.timelapse.e.find('[timelapse="video"]').first().click() - } - },e.timeout) - } - if(getData===true){ - $.getJSON(e.videoURL,function(videos){ - videos.videos=videos.videos.reverse() - $.timelapse.currentVideosArray=videos - e.next(videos) - }) - }else{ - e.next($.timelapse.currentVideosArray) - } - } - $.timelapse.playButtonIcon = $.timelapse.e.find('[timelapse="play"]').find('i') - $.timelapse.timelapseSpeedUseBasicSwitch = $('#timelapseSpeedUseBasic') - $.timelapse.timelapseSpeedUseBasicSwitch.on('change',function(){ - var el = $.timelapse.e.find('.timelapseSpeedUseBasicSwitch') - if($(this).is(':checked')){ - el.hide() - }else{ - el.show() - } - $.timelapse.play() - }) - $.timelapse.getUseBasicStatus = function(){return $.timelapse.timelapseSpeedUseBasicSwitch.prop('checked')} - $.timelapse.onPlayPause = function(toggleGui,secondWind){ - if($.timelapse.paused === true){ - $.timelapse.paused = false - if(toggleGui === true)$.timelapse.play(); - }else{ - $.timelapse.paused = true - if(toggleGui === true)$.timelapse.pause(secondWind); - } - } - $.timelapse.pause = function(secondWind){ - //secondWind is used because sometimes pause can be pressed just as a video ends and the pause command does not register on the next video. - var videoNow = $.timelapse.display.find('video.videoNow')[0] - var pause = function(){ - if(videoNow.paused == false)videoNow.pause() - clearInterval($.timelapse.interval) - $.timelapse.playButtonIcon.removeClass('fa-pause').addClass('fa-play') - } - pause() - if(secondWind === true)setTimeout(pause,250); - } - $.timelapse.play = function(x){ - var videoNow = $.timelapse.display.find('video.videoNow')[0] - $.timelapse.pause() - clearInterval($.timelapse.interval) - if($.timelapse.getUseBasicStatus()){ - videoNow.playbackRate = $.timelapse.playRate - if(videoNow.paused)videoNow.play() - }else{ - videoNow.playbackRate = 1.0 - $.timelapse.interval = setInterval(function(){ - if(videoNow.currentTime >= videoNow.duration - .2){ - clearInterval($.timelapse.interval) - videoNow.currentTime = videoNow.duration - }else{ - videoNow.currentTime += .5 - } - },500 / $.timelapse.playRate) - } - $.timelapse.playButtonIcon.removeClass('fa-play').addClass('fa-pause') - } - $.timelapse.rewind = function(e){ - var videoNow = $.timelapse.display.find('video.videoNow')[0] - $.timelapse.pause() - videoNow.playbackRate = 1.0 - clearInterval($.timelapse.interval) - $.timelapse.interval = setInterval(function(){ - if(videoNow.currentTime <= 0.2){ - clearInterval($.timelapse.interval) - videoNow.currentTime = 0 - $('[timelapse][href="'+e.videoCurrentBefore.attr('video')+'"]').click() - var videoNowNew = $.timelapse.display.find('video.videoNow')[0] - videoNowNew.pause() - videoNowNew.currentTime = videoNowNew.duration - 0.1 - $.timelapse.e.find('[timelapse="stepBackBack"]').click() - }else{ - videoNow.currentTime += -.5 - } - },500 / $.timelapse.playRate) - $.timelapse.playButtonIcon.removeClass('fa-play').addClass('fa-pause') - } - $.timelapse.e.on('click','[timelapse]',function(){ - var e={} - e.e=$(this) - e.videoCurrentNow=$.timelapse.display.find('.videoNow') - e.videoCurrentAfter=$.timelapse.display.find('.videoAfter') - e.videoCurrentBefore=$.timelapse.display.find('.videoBefore') - if($.timelapse.videoInterval){ - clearInterval($.timelapse.videoInterval); - } - switch(e.e.attr('timelapse')){ - case'download': - $.timelapse.line.find('.active [download]').click() - break; - case'mute': - e.videoCurrentNow[0].muted = !e.videoCurrentNow[0].muted - $.timelapse.videoNowIsMuted = e.videoCurrentNow[0].muted - e.e.find('i').toggleClass('fa-volume-off fa-volume-up') - e.e.toggleClass('btn-danger') - break; - case'play': - e.videoCurrentNow[0].playbackRate = $.timelapse.playRate; - $.timelapse.onPlayPause(true,true) - break; - case'setPlayBackRate': - $.timelapse.pause() - $.timelapse.playRate = parseFloat(e.e.attr('playRate')) - $.timelapse.play() - break; - case'stepFrontFront': - e.add=e.e.attr('add') - e.stepFrontFront=parseInt(e.e.attr('stepFrontFront')) - if(!e.stepFrontFront||isNaN(e.stepFrontFront)){e.stepFrontFront = 5} - if(e.add==="0"){ - $.timelapse.playRate = e.stepFrontFront - }else{ - $.timelapse.playRate += e.stepFrontFront - } - e.videoCurrentNow[0].playbackRate = $.timelapse.playRate; - e.videoCurrentNow[0].play() - break; - case'stepFront': - e.videoCurrentNow[0].currentTime += 5; - e.videoCurrentNow[0].pause() - break; - case'stepBackBack': - // e.videoCurrentNow=$.timelapse.display.find('.videoNow') - // e.videoCurrentAfter=$.timelapse.display.find('.videoAfter') - // e.videoCurrentBefore=$.timelapse.display.find('.videoBefore') - $.timelapse.rewind(e) - break; - case'stepBack': - e.videoCurrentNow[0].currentTime += -5; - e.videoCurrentNow[0].pause() - break; - case'video': - $.timelapse.e.find('video').each(function(n,v){ - v.pause() - }) - e.drawVideoHTML=function(position){ - var video - var exisitingElement=$.timelapse.display.find('.'+position) - if(position){ - video=e.video[position] - }else{ - position='videoNow' - video=e.video - } - if(video){ - $.timelapse.display.append('') - } - } - e.filename=e.e.attr('file') - e.video=$.timelapse.currentVideos[e.filename] - e.videoIsSame=(e.video.href==e.videoCurrentNow.attr('video')) - e.videoIsAfter=(e.video.href==e.videoCurrentAfter.attr('video')) - e.videoIsBefore=(e.video.href==e.videoCurrentBefore.attr('video')) - if(e.videoIsSame||e.videoIsAfter||e.videoIsBefore){ - switch(true){ - case e.videoIsSame: - $.ccio.log('$.timelapse','videoIsSame') - e.videoNow=$.timelapse.display.find('video.videoNow') - if(e.videoNow[0].paused===true){ - e.videoNow[0].play() - }else{ - e.videoNow[0].pause() - } - return - break; - case e.videoIsAfter: - $.ccio.log('$.timelapse','videoIsAfter') - e.videoCurrentBefore.remove() - e.videoCurrentAfter.removeClass('videoAfter').addClass('videoNow') - e.videoCurrentNow.removeClass('videoNow').addClass('videoBefore') - e.drawVideoHTML('videoAfter') - break; - case e.videoIsBefore: - $.ccio.log('$.timelapse','videoIsBefore') - e.videoCurrentAfter.remove() - e.videoCurrentBefore.removeClass('videoBefore').addClass('videoNow') - e.videoCurrentNow.removeClass('videoNow').addClass('videoAfter') - e.drawVideoHTML('videoBefore') - break; - } - }else{ - $.ccio.log('$.timelapse','newSetOf3') - $.timelapse.display.empty() - e.drawVideoHTML()//videoNow - e.drawVideoHTML('videoBefore') - e.drawVideoHTML('videoAfter') - } - $.timelapse.display.find('video').each(function(n,v){ - v.addEventListener('loadeddata', function() { - e.videoCurrentAfterPreview=$('.timelapse_video[href="'+$(v).attr('video')+'"] .frame') - if(e.videoCurrentAfterPreview.attr('set')!=='1'){ - $.ccio.snapshotVideo(v,function(url,buffer){ - e.videoCurrentAfterPreview.attr('set','1').css('background-image','url('+url+')') - if($(v).hasClass('videoAfter')){ - v.currentTime=0 - v.pause() - } - }) - } - }, false); - }) - e.videoNow=$.timelapse.display.find('video.videoNow')[0] - if($.timelapse.videoNowIsMuted){ - e.videoNow.muted=true - } - $.timelapse.playButtonIcon.removeClass('fa-pause').addClass('fa-play') - $.timelapse.onended = function() { - $.timelapse.line.find('[file="'+e.video[$.timelapse.playDirection].filename+'"]').click() - }; - e.videoNow.onended = $.timelapse.onended - e.videoNow.onerror = $.timelapse.onended - // - $(e.videoNow) - .off('play').on('play',$.timelapse.play) - .off('pause').on('pause',$.timelapse.onPlayPause) - .off('timeupdate').on('timeupdate',function(){ - var value= (( e.videoNow.currentTime / e.videoNow.duration ) * 100)+"%" - $.timelapse.seekBarProgress.css("width",value); - $.timelapse.e.find('.timelapse_video[file="'+e.filename+'"] .progress-bar').css("width",value); - }) - $.timelapse.play() - $.timelapse.seekBar.off("click").on("click", function(seek){ - var offset = $(this).offset(); - var left = (seek.pageX - offset.left); - var totalWidth = $.timelapse.seekBar.width(); - var percentage = ( left / totalWidth ); - var vidTime = e.videoNow.duration * percentage; - e.videoNow.currentTime = vidTime; - }); - - $.ccio.log('$.timelapse',e.video) - $.timelapse.line.find('.timelapse_video').removeClass('active') - e.videoCurrentNow=$.timelapse.display.find('.videoNow') - e.e.addClass('active') - if ($('#timelapse_video_line:hover').length === 0) { - $.timelapse.line.animate({scrollTop:$.timelapse.line.scrollTop() + e.e.position().top - $.timelapse.line.height()/2 + e.e.height()/2 - 40}); - } - break; - } - $.timelapse.e.find('.timelapse_playRate').text('x'+$.timelapse.playRate) - }) - $.timelapse.e.on('hidden.bs.modal',function(e){ - delete($.timelapse.currentVideos) - delete($.timelapse.currentVideosArray) - }) -}) diff --git a/web/pages/blocks/timelapse.ejs b/web/pages/blocks/timelapse.ejs index 84f16d4e..c18858a1 100644 --- a/web/pages/blocks/timelapse.ejs +++ b/web/pages/blocks/timelapse.ejs @@ -1,84 +1,4 @@ - -