557 lines
13 KiB
JavaScript
557 lines
13 KiB
JavaScript
|
/*
|
||
|
* Filename: playback_demo.js
|
||
|
* Created at: 2021.6.4
|
||
|
* Author: ybLin
|
||
|
* Description: www
|
||
|
* *******************************************************/
|
||
|
var playObj = null;
|
||
|
var localIp = null;
|
||
|
var userName = null;
|
||
|
var password = null;
|
||
|
var tTimeBar = null;
|
||
|
var g_sFileListArray = null;
|
||
|
var g_sSearchDateTime = null;
|
||
|
var playbactTime = null;
|
||
|
var g_nCurSpeed = 0;
|
||
|
var g_iSpanType = 7;
|
||
|
var g_bPlaying = false;
|
||
|
var g_bPause = false;
|
||
|
var g_nCurPage = 0;
|
||
|
var g_nTotalPage = 0;
|
||
|
var timerIDTime = null;
|
||
|
var playUpdateTimer = null;
|
||
|
var f_bplaystatus = 0;
|
||
|
var g_getcurtimefailnum = 0;
|
||
|
|
||
|
var PB_CMD_STOP = 0;
|
||
|
|
||
|
var ph = 0;
|
||
|
var pw = 0;
|
||
|
|
||
|
var firstLoad = true;
|
||
|
var preLastTime = "";
|
||
|
var beginSearch = false;
|
||
|
var firstFileTime = "";
|
||
|
var FirsClick=0;
|
||
|
var g_PrePlayTime = "";
|
||
|
var g_DelayTime = 0;
|
||
|
var g_player = null;
|
||
|
|
||
|
window.onload = function(){
|
||
|
|
||
|
};
|
||
|
|
||
|
|
||
|
FscallbackFun = function (e)
|
||
|
{
|
||
|
console.log(e);
|
||
|
}
|
||
|
|
||
|
//初始函数
|
||
|
function FsPlaybackInit(width,mouseUpCallback)
|
||
|
{
|
||
|
// var ffplayer = document.getElementById("Video_Container1");
|
||
|
|
||
|
//时间轴初始化
|
||
|
var canvas = document.getElementById("timebar");
|
||
|
tTimeBar = new TimeBar(canvas,width,37);
|
||
|
// tTimeBar.setMouseUpCallback(FsTimeBarMouseUp);
|
||
|
tTimeBar.setMouseUpCallback(mouseUpCallback);
|
||
|
|
||
|
//日期控件
|
||
|
var Date = new Time();
|
||
|
g_sSearchDateTime = Date.getStringTime();
|
||
|
playbactTime = Date.getStringTime();
|
||
|
g_sFileListArray = new Array();
|
||
|
var Date = new Time();
|
||
|
g_sSearchDateTime = Date.getStringTime();
|
||
|
g_sCalendarDate = g_sSearchDateTime;
|
||
|
|
||
|
tTimeBar.setMidLineTime(g_sSearchDateTime);
|
||
|
//
|
||
|
// if(g_player != null)
|
||
|
// {
|
||
|
// g_player.destroy();
|
||
|
// }
|
||
|
// g_player = new WasmPlayer(null,'Video_Container1', FscallbackFun,{cbUserPtr:this, decodeType:"auto", openAudio:1, BigPlay:false, Height:false, HideKbs:true});
|
||
|
}
|
||
|
|
||
|
|
||
|
|
||
|
//界面显示调整
|
||
|
var Top_H = 0;
|
||
|
|
||
|
// window.onbeforeunload = function()
|
||
|
// {
|
||
|
// onStopPlayBack();
|
||
|
// };
|
||
|
|
||
|
function FsAddDay(szDay,iAdd)
|
||
|
{
|
||
|
var date = new Date(Date.parse(szDay.replace(/\-/g,'/')));
|
||
|
var newdate = new Date(date.getTime()+(iAdd*24 * 60 * 60 * 1000));
|
||
|
|
||
|
return newdate.format("yyyy-MM-dd hh:mm:ss");
|
||
|
}
|
||
|
|
||
|
//时间轴事件
|
||
|
function FsTimeBarMouseUp()
|
||
|
{
|
||
|
var playbacktime = tTimeBar.f_tCurrentMidTime.getStringTime();
|
||
|
playbactTime = playbacktime;
|
||
|
var szStartTime = FsGetDateTimeFmt(g_sSearchDateTime, " 00:00:00");
|
||
|
var szStopTime = FsGetDateTimeFmt(g_sSearchDateTime, " 23:59:59");
|
||
|
|
||
|
if(playbacktime > szStopTime || playbacktime < szStartTime)
|
||
|
{
|
||
|
g_sSearchDateTime = playbacktime;
|
||
|
|
||
|
// FsSearchFile(FsAddDay(FsGetDateTimeFmt(g_sSearchDateTime, " 00:00:00"), -1), FsAddDay(FsGetDateTimeFmt(g_sSearchDateTime, " 23:59:59"), 1));
|
||
|
}
|
||
|
if(g_bPlaying)
|
||
|
{
|
||
|
f_bplaystatus = 0;
|
||
|
playObj.startPlayBack(1);
|
||
|
}
|
||
|
}
|
||
|
|
||
|
function FsGetTimeString(sTime)
|
||
|
{
|
||
|
return sTime.substring(0, 4) + sTime.substring(5, 7) + sTime.substring(8, 10) + sTime.substring(11, 13) + sTime.substring(14, 16) + sTime.substring(17, 19);
|
||
|
}
|
||
|
|
||
|
//为时间轴添加录像文件信息
|
||
|
function FsAddFileInfoToTimebar(fileListArray)
|
||
|
{
|
||
|
if(fileListArray.length == 0)
|
||
|
return ;
|
||
|
|
||
|
for(var i = 0; i < fileListArray.length; i++)
|
||
|
{
|
||
|
var filename = fileListArray[i];
|
||
|
var strarray = filename.split("_");
|
||
|
var sDatetime = strarray[0];
|
||
|
var Type = strarray[1];
|
||
|
var sDurationEnd = strarray[2].indexOf(".mp4");
|
||
|
var sDuration = strarray[2].substring(0, sDurationEnd);
|
||
|
|
||
|
sDuration = parseInt(sDuration);
|
||
|
var DateNow = new Date(parseInt(sDatetime.substring(0, 4)), parseInt(sDatetime.substring(4, 6))-1, parseInt(sDatetime.substring(6, 8)), parseInt(sDatetime.substring(8, 10)), parseInt(sDatetime.substring(10, 12)), parseInt(sDatetime.substring(12, 14)));
|
||
|
var fstime = DateNow.getTime();
|
||
|
fstime = fstime + sDuration*1000;
|
||
|
DateNow.setTime(fstime);
|
||
|
var sStartTime = sDatetime.substring(0, 4) + "-" + sDatetime.substring(4, 6) + "-" + sDatetime.substring(6, 8)+ " " + sDatetime.substring(8, 10)+ ":" + sDatetime.substring(10, 12) + ":" + sDatetime.substring(12, 14);
|
||
|
var sStopTime = DateNow.getFullYear().toString() + "-" + (DateNow.getMonth() + 1).toString() + "-" + DateNow.getDate().toString() + " " + DateNow.getHours().toString() + ":" + DateNow.getMinutes().toString() + ":" + DateNow.getSeconds().toString();
|
||
|
tTimeBar.addFile(sStartTime, sStopTime, Type);
|
||
|
|
||
|
if (firstLoad) // first time load
|
||
|
{
|
||
|
if (firstFileTime.localeCompare(sStartTime) < 0)
|
||
|
firstFileTime = sStartTime;
|
||
|
}
|
||
|
else // click search
|
||
|
{
|
||
|
if (sStartTime.substr(0,10) >= g_sSearchDateTime.split(" ")[0])
|
||
|
{
|
||
|
if(IsNull(firstFileTime))
|
||
|
{
|
||
|
firstFileTime = sStartTime;
|
||
|
}
|
||
|
else if(firstFileTime.localeCompare(sStartTime) > 0)
|
||
|
{
|
||
|
firstFileTime = sStartTime;
|
||
|
}
|
||
|
}
|
||
|
else
|
||
|
{
|
||
|
if (preLastTime.localeCompare(sStartTime) < 0)
|
||
|
preLastTime = sStartTime;
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
|
||
|
tTimeBar.repaint();
|
||
|
if (beginSearch && g_nCurPage == g_nTotalPage)
|
||
|
{
|
||
|
if (IsNull(firstFileTime) && !IsNull(preLastTime))
|
||
|
firstFileTime = preLastTime;
|
||
|
|
||
|
setTimeout("FsSetBarFileBegin()", 50);
|
||
|
}
|
||
|
}
|
||
|
|
||
|
//为时间轴添加录像文件信息
|
||
|
// {
|
||
|
// case 1:
|
||
|
// fileColor = this.scheFileColor;
|
||
|
// break;
|
||
|
// case 2:
|
||
|
// fileColor = this.alarmFileColor;
|
||
|
// break;
|
||
|
// case 3:
|
||
|
// fileColor = this.cmdFileColor;
|
||
|
// break;
|
||
|
// case 4:
|
||
|
// fileColor = this.manualFileColor;
|
||
|
// break;
|
||
|
// case 5:
|
||
|
// fileColor = this.mdVideoColor;
|
||
|
// break;
|
||
|
// case 6:
|
||
|
// fileColor = this.timeVideoColor;
|
||
|
// break;
|
||
|
// default:
|
||
|
// fileColor = this.defaultFileColor;
|
||
|
// break;
|
||
|
// }
|
||
|
function FsAddFileInfoToTimebar2(fileListArray,needClean)
|
||
|
{
|
||
|
//清除原来的记录
|
||
|
if(needClean){
|
||
|
tTimeBar.clearWndFileList();
|
||
|
}
|
||
|
if(fileListArray.length == 0)
|
||
|
return ;
|
||
|
|
||
|
for(var i = 0; i < fileListArray.length; i++)
|
||
|
{
|
||
|
var row = fileListArray[i];
|
||
|
var recordType = row.recordType;
|
||
|
var beginDt = row.beginDt;
|
||
|
var endDt = row.endDt;
|
||
|
var Type = -1;
|
||
|
var timeLength = row.timeLength;
|
||
|
if(recordType == "事件录像"){
|
||
|
Type = 2;
|
||
|
}
|
||
|
|
||
|
var sStartTime = beginDt.replace("T"," ");
|
||
|
var sStopTime = endDt.replace("T"," ");
|
||
|
|
||
|
tTimeBar.addFile(sStartTime, sStopTime, Type);
|
||
|
|
||
|
if (firstLoad) // first time load
|
||
|
{
|
||
|
if (firstFileTime.localeCompare(sStartTime) < 0)
|
||
|
firstFileTime = sStartTime;
|
||
|
}
|
||
|
else // click search
|
||
|
{
|
||
|
if (sStartTime.substr(0,10) >= g_sSearchDateTime.split(" ")[0])
|
||
|
{
|
||
|
if(IsNull(firstFileTime))
|
||
|
{
|
||
|
firstFileTime = sStartTime;
|
||
|
}
|
||
|
else if(firstFileTime.localeCompare(sStartTime) > 0)
|
||
|
{
|
||
|
firstFileTime = sStartTime;
|
||
|
}
|
||
|
}
|
||
|
else
|
||
|
{
|
||
|
if (preLastTime.localeCompare(sStartTime) < 0)
|
||
|
preLastTime = sStartTime;
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
|
||
|
tTimeBar.repaint();
|
||
|
if (beginSearch && g_nCurPage == g_nTotalPage)
|
||
|
{
|
||
|
if (IsNull(firstFileTime) && !IsNull(preLastTime))
|
||
|
firstFileTime = preLastTime;
|
||
|
|
||
|
setTimeout("FsSetBarFileBegin()", 50);
|
||
|
}
|
||
|
}
|
||
|
|
||
|
function clearTimeBar(){
|
||
|
tTimeBar.clearWndFileList();
|
||
|
tTimeBar.repaint();
|
||
|
}
|
||
|
|
||
|
//为时间轴添加录像文件信息
|
||
|
//录像类型 -1:默认 2:报警 4:手动 5:移动侦测 6:定时
|
||
|
function FsAddFileInfoToTimebar3(fileListArray,needClean)
|
||
|
{
|
||
|
//清除原来的记录
|
||
|
if(needClean){
|
||
|
tTimeBar.clearWndFileList();
|
||
|
}
|
||
|
if(fileListArray.length == 0){
|
||
|
tTimeBar.repaint();
|
||
|
return ;
|
||
|
}
|
||
|
|
||
|
for(var i = 0; i < fileListArray.length; i++)
|
||
|
{
|
||
|
var row = fileListArray[i];
|
||
|
var sStartTime = row.startTime;
|
||
|
var sStopTime = row.endTime;
|
||
|
tTimeBar.addFile(sStartTime, sStopTime, row.type);
|
||
|
|
||
|
if (firstLoad) // first time load
|
||
|
{
|
||
|
if (firstFileTime.localeCompare(sStartTime) < 0)
|
||
|
firstFileTime = sStartTime;
|
||
|
}
|
||
|
else // click search
|
||
|
{
|
||
|
if (sStartTime.substr(0,10) >= g_sSearchDateTime.split(" ")[0])
|
||
|
{
|
||
|
if(IsNull(firstFileTime))
|
||
|
{
|
||
|
firstFileTime = sStartTime;
|
||
|
}
|
||
|
else if(firstFileTime.localeCompare(sStartTime) > 0)
|
||
|
{
|
||
|
firstFileTime = sStartTime;
|
||
|
}
|
||
|
}
|
||
|
else
|
||
|
{
|
||
|
if (preLastTime.localeCompare(sStartTime) < 0)
|
||
|
preLastTime = sStartTime;
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
|
||
|
tTimeBar.repaint();
|
||
|
if (beginSearch && g_nCurPage == g_nTotalPage)
|
||
|
{
|
||
|
if (IsNull(firstFileTime) && !IsNull(preLastTime))
|
||
|
firstFileTime = preLastTime;
|
||
|
|
||
|
setTimeout("FsSetBarFileBegin()", 50);
|
||
|
}
|
||
|
}
|
||
|
|
||
|
function FsSetBarFileBegin()
|
||
|
{
|
||
|
preLastTime = "";
|
||
|
firstFileTime = "";
|
||
|
beginSearch = false;
|
||
|
firstLoad = false;
|
||
|
}
|
||
|
|
||
|
function FsSetBtnPlayState(playing)
|
||
|
{
|
||
|
if (playing)
|
||
|
{
|
||
|
var playId = document.getElementById('play')
|
||
|
playId.classList.remove('play')
|
||
|
playId.classList.add('playing')
|
||
|
//$("#play").removeClass().addClass("pause");
|
||
|
}
|
||
|
else
|
||
|
{
|
||
|
var playId = document.getElementById('play')
|
||
|
playId.classList.remove('playing')
|
||
|
playId.classList.add('play')
|
||
|
//$("#play").removeClass().addClass("play");
|
||
|
}
|
||
|
}
|
||
|
|
||
|
function FsPlayFileFail()
|
||
|
{
|
||
|
document.getElementById("laPlaybackTips").innerHTML = playback_play_failed;
|
||
|
document.getElementById("divPlaybackTips").style.display = "block";
|
||
|
}
|
||
|
|
||
|
function FsCheckHasFile(sTime)
|
||
|
{
|
||
|
var sDateTime = new Time();
|
||
|
sDateTime.parseTime(sTime);
|
||
|
for(var i = 0; i < g_sFileListArray.length; i++)
|
||
|
{
|
||
|
var filename = g_sFileListArray[i];
|
||
|
var sDatetime = filename.substring(0, 14);
|
||
|
var remainstr = filename.substr(filename.indexOf("_")+1, filename.indexOf(".mp4"));
|
||
|
|
||
|
var sDurationstart = remainstr.indexOf("_");
|
||
|
var sDurationEnd = remainstr.indexOf(".mp4");
|
||
|
var sDuration = remainstr.substring(sDurationstart+1, sDurationEnd);
|
||
|
sDuration = parseInt(sDuration);
|
||
|
var DateNow = new Date(parseInt(sDatetime.substring(0, 4)), parseInt(sDatetime.substring(4, 6))-1, parseInt(sDatetime.substring(6, 8)), parseInt(sDatetime.substring(8, 10)), parseInt(sDatetime.substring(10, 12)), parseInt(sDatetime.substring(12, 14)));
|
||
|
var fstime = DateNow.getTime();
|
||
|
|
||
|
if(fstime <= sDateTime.f_iMilliseconds && sDateTime.f_iMilliseconds <= fstime + sDuration* 1000)
|
||
|
return true;
|
||
|
if(fstime - 5*60*1000 <= sDateTime.f_iMilliseconds && sDateTime.f_iMilliseconds <= fstime)//pre 5 mins
|
||
|
return true;
|
||
|
}
|
||
|
return false;
|
||
|
}
|
||
|
|
||
|
function FsUpdatePlayTime() // update pb time
|
||
|
{
|
||
|
/*if(g_bPlaying == false)
|
||
|
return ;*/
|
||
|
|
||
|
FsSetPlaybarTime(1000);
|
||
|
}
|
||
|
|
||
|
function FsSetPlaybarTime(delta) //
|
||
|
{
|
||
|
var tCurTime = new Time();
|
||
|
g_PrePlayTime = tTimeBar.f_tCurrentMidTime.getStringTime();
|
||
|
tCurTime.parseTime(g_PrePlayTime);
|
||
|
|
||
|
var milTime = tCurTime.f_iMilliseconds+(delta);
|
||
|
|
||
|
if(f_bplaystatus == 1)//is play
|
||
|
{
|
||
|
tTimeBar.f_tCurrentMidTime.setTimeByMis(milTime);
|
||
|
tTimeBar.repaint();
|
||
|
}
|
||
|
}
|
||
|
|
||
|
function FsRecvPBCurTimeResp(g_SubmitHttpReserve)
|
||
|
{
|
||
|
if (g_SubmitHttpReserve.readyState == 4)
|
||
|
{
|
||
|
if (g_SubmitHttpReserve.status == 200)
|
||
|
{
|
||
|
try
|
||
|
{
|
||
|
var txt = g_SubmitHttpReserve.responseText;
|
||
|
var ix = txt.indexOf("OK getpbcurtime=");
|
||
|
if (ix >= 0)
|
||
|
{
|
||
|
var sTmp = txt.substr(ix+16);
|
||
|
var iend = sTmp.indexOf("\n");
|
||
|
if(iend <= 0)
|
||
|
{
|
||
|
return ;
|
||
|
}
|
||
|
var sCurrentTime = sTmp.substring(0, iend);
|
||
|
var nCurrentTime = parseInt(sCurrentTime);
|
||
|
if(nCurrentTime < 19701230235959)
|
||
|
{
|
||
|
return;
|
||
|
}
|
||
|
|
||
|
var sDisplayCurTime = sCurrentTime.substring(0, 4) + "-" + sCurrentTime.substring(4, 6) + "-" + sCurrentTime.substring(6, 8)+ " " + sCurrentTime.substring(8, 10)+ ":" + sCurrentTime.substring(10, 12) + ":" + sCurrentTime.substring(12, 14);
|
||
|
if(sDisplayCurTime != g_PrePlayTime)
|
||
|
{
|
||
|
if(f_bplaystatus == 1)//is play
|
||
|
tTimeBar.setMidLineTime(sDisplayCurTime);
|
||
|
}
|
||
|
else
|
||
|
{
|
||
|
g_DelayTime = 50;
|
||
|
}
|
||
|
g_getcurtimefailnum = 0;
|
||
|
}
|
||
|
|
||
|
var ix_ng = txt.indexOf("NG getpbcurtime"); // stop update
|
||
|
if (ix_ng >= 0)
|
||
|
{
|
||
|
g_getcurtimefailnum++;
|
||
|
if(g_getcurtimefailnum >= 2)
|
||
|
{
|
||
|
clearInterval(playUpdateTimer);
|
||
|
FsSetPlaybarTime(-2600);
|
||
|
g_bPlaying = false;
|
||
|
FsSetBtnPlayState(false);
|
||
|
FirsClick = 0;
|
||
|
document.getElementById("laCurrentSpeed").innerHTML = ""; //playback_status
|
||
|
g_nCurSpeed = 0;
|
||
|
|
||
|
g_getcurtimefailnum = 0;
|
||
|
return;
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
catch (e)
|
||
|
{
|
||
|
}
|
||
|
}
|
||
|
timerIDTime = setTimeout("FsGetPBCurTime()", 3000);
|
||
|
}
|
||
|
}
|
||
|
|
||
|
function FsGetPbTimeUpdateDeno(nSpeed) // get Denominator
|
||
|
{
|
||
|
var deno = 1.0;
|
||
|
switch(nSpeed)
|
||
|
{
|
||
|
case 0: deno = 1.0; break;
|
||
|
case 1: deno = 2.0; break;
|
||
|
case 2: deno = 4.0; break;
|
||
|
case -1: deno = 1/2.0; break;
|
||
|
case -2: deno = 1/4.0; break;
|
||
|
default: deno = 1.0; break;
|
||
|
}
|
||
|
return deno;
|
||
|
}
|
||
|
|
||
|
function FsGetPbDelayTime(nSpeed)
|
||
|
{
|
||
|
var deno = 0.0;
|
||
|
switch(nSpeed)
|
||
|
{
|
||
|
case 0: deno = g_DelayTime; break;
|
||
|
case 1: deno = 100.0 + g_DelayTime; break;
|
||
|
case 2: deno = 50.0 + g_DelayTime; break;
|
||
|
case -1: deno = g_DelayTime; break;
|
||
|
case -2: deno = g_DelayTime; break;
|
||
|
default: deno = g_DelayTime; break;
|
||
|
}
|
||
|
g_DelayTime = 0;
|
||
|
return deno;
|
||
|
}
|
||
|
|
||
|
function onNarrowTimebar()
|
||
|
{
|
||
|
g_iSpanType--;
|
||
|
if(g_iSpanType < 6)
|
||
|
{
|
||
|
g_iSpanType = 6;
|
||
|
return;
|
||
|
}
|
||
|
try
|
||
|
{
|
||
|
tTimeBar.SetSpantype(g_iSpanType);
|
||
|
}
|
||
|
catch(e)
|
||
|
{
|
||
|
}
|
||
|
}
|
||
|
|
||
|
function onExpandTimebar()
|
||
|
{
|
||
|
g_iSpanType++;
|
||
|
if(g_iSpanType > 12)
|
||
|
{
|
||
|
g_iSpanType = 12;
|
||
|
return;
|
||
|
}
|
||
|
try
|
||
|
{
|
||
|
tTimeBar.SetSpantype(g_iSpanType);
|
||
|
}
|
||
|
catch(e)
|
||
|
{
|
||
|
}
|
||
|
}
|
||
|
|
||
|
|
||
|
function FsGetDateTimeFmt(sDateTime, sTime)
|
||
|
{
|
||
|
return sDateTime.substring(0, 10) + sTime;
|
||
|
}
|
||
|
|
||
|
|
||
|
function GetVal(val, dfval)
|
||
|
{
|
||
|
return (val.indexOf("<%") > -1) ? dfval : val;
|
||
|
}
|
||
|
|
||
|
function OnRefresh()
|
||
|
{
|
||
|
window.location.href = "fsplayback.html";
|
||
|
}
|
||
|
|