mirror of
https://gitlab.com/Shinobi-Systems/ShinobiCE.git
synced 2025-03-09 15:40:15 +00:00
Son Goku
- Rebased sql, test, web, defintions, languages, INSTALL, and libs folders.
This commit is contained in:
parent
24de55e45a
commit
d0b12e92e7
362 changed files with 21716 additions and 7018 deletions
334
web/libs/js/dash2.timelapse.js
Normal file
334
web/libs/js/dash2.timelapse.js
Normal file
|
@ -0,0 +1,334 @@
|
|||
$(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+='<li class="glM'+v.mid+$user.auth_token+' list-group-item timelapse_video flex-block" timelapse="video" file="'+v.filename+'" href="'+v.href+'" mid="'+v.mid+'" ke="'+v.ke+'" auth="'+$user.auth_token+'">'
|
||||
e.tmp+='<div class="flex-block">'
|
||||
e.tmp+='<div class="flex-unit-3"><div class="frame" style="background-image:url('+$.timelapse.placeholder+')"></div></div>'
|
||||
e.tmp+='<div class="flex-unit-3"><div><span title="'+v.time+'" class="livestamp"></span></div><div>'+v.filename+'</div></div>'
|
||||
e.tmp+='<div class="flex-unit-3 text-right"><a class="btn btn-default" download="'+v.mid+'-'+v.filename+'" href="'+v.href+'"> <i class="fa fa-download"></i> </a> <a class="btn btn-danger" video="delete" href="'+$.ccio.init('videoHrefToDelete',v.href)+'"> <i class="fa fa-trash-o"></i> </a></div>'
|
||||
e.tmp+='</div>'
|
||||
e.tmp+='<div class="flex-block">'
|
||||
e.tmp+='<div class="flex-unit-3"><div class="progress"><div class="progress-bar progress-bar-primary" role="progressbar" style="width:0%"></div></div></div>'
|
||||
e.tmp+='</div>'
|
||||
e.tmp+='</li>'
|
||||
})
|
||||
$.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('<video class="video_video '+position+'" video="'+video.href+'" preload><source src="'+video.href+'" type="video/'+video.ext+'"></video>')
|
||||
}
|
||||
}
|
||||
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)
|
||||
})
|
||||
})
|
Loading…
Add table
Add a link
Reference in a new issue