551 lines
25 KiB
Plaintext
551 lines
25 KiB
Plaintext
|
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
|||
|
|
<html>
|
|||
|
|
<head>
|
|||
|
|
<title></title>
|
|||
|
|
<meta charset="UTF-8">
|
|||
|
|
<meta http-equiv="X-UA-Compatible" content="IE=6;IE=7; IE=8; IE=EmulateIE7" />
|
|||
|
|
<jsp:include page="/jsp/inc.jsp"></jsp:include>
|
|||
|
|
</head>
|
|||
|
|
<body onUnLoad="StopPlay();LogoutDevice();">
|
|||
|
|
<!-- <div >
|
|||
|
|
<button id="Login" href="javascript:;"Onclick = "LoginDevice()">Login</button>
|
|||
|
|
<button id="Play" href="javascript:;"Onclick = "RealPlay()" style = "display:none;">RealPlay</button>
|
|||
|
|
<button id="Stop" href="javascript:;"Onclick = "StopPlay()" style = "display:none;">Stop</button>
|
|||
|
|
<button id="OpenIVS" href="javascript:;"Onclick = "OpenIVS()" style = "display:none;">OpenIVS</button>
|
|||
|
|
<button id="CloseIVS" href="javascript:;"Onclick = "CloseIVS()" style = "display:none;">CloseIVS</button>
|
|||
|
|
<button id="FullScreen" href="javascript:;"Onclick = "FullScreen()" style = "display:none;">FullScreen</button>
|
|||
|
|
<button id="LocalPlay" href="javascript:;"Onclick = "LocalPlay()" style = "display:none;">LocalPlay</button>
|
|||
|
|
<button id="SnapPicture" href="javascript:;"Onclick = "SnapPicture()" style = "display:none;">SnapPicture</button>
|
|||
|
|
<button id="GetAllChannelInfo" href="javascript:;"Onclick = "GetAllChannelInfo()" style = "display:none;">GetAllChannelInfo</button>
|
|||
|
|
<button id="Logout" href="javascript:;"Onclick = "LogoutDevice()" style = "display:none;">Logout</button>
|
|||
|
|
<button id="control" href="javascript:;" Onclick="control()" style="display:none;">control</button>
|
|||
|
|
</div> -->
|
|||
|
|
<div id="f_ocx" style="top:60px; left:0; height:400px;">
|
|||
|
|
</div>
|
|||
|
|
<!-- <div >
|
|||
|
|
<div>
|
|||
|
|
<button id="idQuery" href="javascript:;"Onclick = "QueryRecord()" style = "display:none;">QueryRecord</button>
|
|||
|
|
<button id="QueryFaceImageRecord" href="javascript:;"Onclick = "QueryFaceImageRecord()" style = "display:none;">QueryFaceImageRecord</button>
|
|||
|
|
<button id="QueryRecordInfoByTimeEx" href="javascript:;"Onclick = "QueryRecordInfoByTimeEx()" style = "display:none;">QueryRecordInfoByTime</button>
|
|||
|
|
<button id="DownloadFaceImageRecord" href="javascript:;"Onclick = "DownloadRecordByFile()" style = "display:none;">DownloadRecordByFile</button>
|
|||
|
|
<button id="download" href="javascript:;"Onclick = "DownloadByTime()" style = "display:none;">DownloadByTime</button>
|
|||
|
|
</div>
|
|||
|
|
<button id="PlayBack" href="javascript:;"Onclick = "PlayBack()" style = "display:none;">Playback</button>
|
|||
|
|
<button id="PlayRec" href="javascript:;"Onclick = "PlayRec()" style = "display:none;">PlayRec</button>
|
|||
|
|
<button id="PauseRec" href="javascript:;"Onclick = "PauseRec()" style = "display:none;">PauseRec</button>
|
|||
|
|
<button id="FastPlay" href="javascript:;"Onclick = "FastPlay()" style = "display:none;">FastPlay</button>
|
|||
|
|
<button id="SlowPlay" href="javascript:;"Onclick = "SlowPlay()" style = "display:none;">SlowPlay</button>
|
|||
|
|
<button id="SlowPlay" href="javascript:;" Onclick="control()" style="display:none;">control</button>
|
|||
|
|
|
|||
|
|
</div >
|
|||
|
|
<div id="TransEvent" style = "display:none;">
|
|||
|
|
<label >TransEvent</label><input type="text" style="width:900px" id="trEvent">
|
|||
|
|
</div>
|
|||
|
|
<div id="ShowPlayTime" style = "display:none;">
|
|||
|
|
<label >now time</label><input type="text" id="playtime">
|
|||
|
|
</div>
|
|||
|
|
<div id="DwonLoadPos" style = "display:none;">
|
|||
|
|
<label >pos</label><input type="text" style="width:900px" id="downPos">
|
|||
|
|
</div>
|
|||
|
|
<div style="display:none;" id="RecInfo">
|
|||
|
|
<div id="RecInfoList" style = "overflow:auto;width:600px;height:200px;">
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<div id="DwonLoadByTimeInfo" style = "display:none;">
|
|||
|
|
<label >DwonLoadByTimeInfo</label><input type="text" style="width:900px" id="DwonLoadInfo">
|
|||
|
|
</div> -->
|
|||
|
|
</body>
|
|||
|
|
</html>
|
|||
|
|
<script>
|
|||
|
|
$(function(){
|
|||
|
|
LoginDevice();
|
|||
|
|
setTimeout("RealPlay()",1000)
|
|||
|
|
})
|
|||
|
|
var Sys = {};
|
|||
|
|
var ua = navigator.userAgent.toLowerCase();
|
|||
|
|
var s;
|
|||
|
|
(s = ua.match(/(msie\s|trident.*rv:)([\d.]+)/)) ? Sys.ie = s[2] :
|
|||
|
|
(s = ua.match(/firefox\/([\d.]+)/)) ? Sys.firefox = s[1] :
|
|||
|
|
(s = ua.match(/chrome\/([\d.]+)/)) ? Sys.chrome = s[1] :
|
|||
|
|
(s = ua.match(/opera.([\d.]+)/)) ? Sys.opera = s[1] :
|
|||
|
|
(s = ua.match(/version\/([\d.]+).*safari/)) ? Sys.safari = s[1] : 0;
|
|||
|
|
|
|||
|
|
var hasPlugin = checkPlugins();
|
|||
|
|
|
|||
|
|
var g_ocx; //控件对象，初始化完毕后，可以调用《二次开发使用 WEB32网页调用接口说明.doc》文档中的接口
|
|||
|
|
var g_PlayTime;
|
|||
|
|
var g_curSpeed = 4; //默认的正常速度
|
|||
|
|
var htmlStChn1 = '';
|
|||
|
|
var recInfosByFile = [];
|
|||
|
|
|
|||
|
|
////////////////////////////////////////////////////////////////////////////////
|
|||
|
|
//STEP1：插件初始化/////////////////////////////////////////////////////////////
|
|||
|
|
////////////////////////////////////////////////////////////////////////////////
|
|||
|
|
|
|||
|
|
//加载插件到网页中去。
|
|||
|
|
loadPageOcx();
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* 检测浏览器是否存在视频插件
|
|||
|
|
* @return {Boolean}
|
|||
|
|
*/
|
|||
|
|
function checkPlugins() {
|
|||
|
|
var PLUGINS_NAME = 'WebActiveEXE.Plugin.1';
|
|||
|
|
var result;
|
|||
|
|
if (Sys.ie) {
|
|||
|
|
try {
|
|||
|
|
result = new ActiveXObject(PLUGINS_NAME);
|
|||
|
|
delete result;
|
|||
|
|
} catch (e) {
|
|||
|
|
return false;
|
|||
|
|
}
|
|||
|
|
return true;
|
|||
|
|
} else {
|
|||
|
|
navigator.plugins.refresh(false);
|
|||
|
|
result = navigator.mimeTypes["application/media-plugin-version-3.1.0.2"];
|
|||
|
|
return !!(result && result.enabledPlugin);
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function loadPageOcx() {
|
|||
|
|
var mainOcxHtml = '';
|
|||
|
|
if (Sys.ie) {
|
|||
|
|
mainOcxHtml = '<object id="ocx" width="100%" height="100%" classid="CLSID:7F9063B6-E081-49DB-9FEC-D72422F2727F"></object>';
|
|||
|
|
} else {
|
|||
|
|
mainOcxHtml = '<object id="ocx" width="100%" height="100%" type="application/media-plugin-version-3.1.0.2" VideoWindTextColor="9c9c9c" VideoWindBarColor="414141"></object>';
|
|||
|
|
}
|
|||
|
|
document.getElementById('f_ocx').innerHTML = mainOcxHtml;
|
|||
|
|
//document.getElementById('Login').style.display = '';
|
|||
|
|
initPageOcx();
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* [initPageOcx 初始化g_ocx，绑定插件事件；有些信息（录像信息等）会主动调用注册的回调接口]
|
|||
|
|
* @return {[type]} [description]
|
|||
|
|
*/
|
|||
|
|
function initPageOcx() {
|
|||
|
|
g_ocx = document.getElementById('ocx');
|
|||
|
|
//控件加载成功后注册需要关注的监听事件
|
|||
|
|
//详见《二次开发使用 WEB32网页调用接口说明》章节二：事件
|
|||
|
|
|
|||
|
|
//TransEvent: 注册这个事件接收控件内部状态
|
|||
|
|
//这个非常重要，是按时间查找录像查询的关键；调用本例中QueryRecordInfoByTimeEx()会触发回调
|
|||
|
|
g_ocx.AddEventListener('TransEvent', TransEvent);
|
|||
|
|
|
|||
|
|
//SetNetPlayFileInfo: 注册这个事件接收查询到的录像信息
|
|||
|
|
//这个非常重要，是录像查询的关键；调用本例中QueryRecord()会触发回调
|
|||
|
|
g_ocx.AddEventListener('SetNetPlayFileInfo', ShowRecInfo);
|
|||
|
|
g_ocx.AddEventListener('NetPlayTimeInform', ShowPlayTime);
|
|||
|
|
|
|||
|
|
//InsertNetRecordFileInfo: 注册这个事件接收查询到的录像信息
|
|||
|
|
//这个非常重要，是按时间查找录像查询的关键；调用本例中QueryRecordInfoByTimeEx()会触发回调
|
|||
|
|
g_ocx.AddEventListener('InsertNetRecordFileInfo', InsertNetRecordFileInfo);
|
|||
|
|
|
|||
|
|
//在这里可以隐藏工具栏上的按钮
|
|||
|
|
hideToolbarBtns();
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* [hideToolbarBtns 隐藏工具栏按钮]
|
|||
|
|
* @return {[type]} [description]
|
|||
|
|
*/
|
|||
|
|
function hideToolbarBtns() {
|
|||
|
|
//按钮隐藏可以自由选择怎么设置，遵从此协议格式即可
|
|||
|
|
//按钮名称有如下几种：{"Fisheye", "ZoomIn", "Record", "CloseVideo", "Snapshot", "Audio"}
|
|||
|
|
var str = '{"Protocol":"VideoFuncProtocol","Params":{"Audio":false, "Snapshot": false, "Record": false, "Fisheye":false, "ZoomIn":false}}';
|
|||
|
|
g_ocx.ProtocolPluginWithWebCall(str);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
|
|||
|
|
////////////////////////////////////////////////////////////////////////////////
|
|||
|
|
//STEP2：登录设备///////////////////////////////////////////////////////////////
|
|||
|
|
////////////////////////////////////////////////////////////////////////////////
|
|||
|
|
|
|||
|
|
function LoginDevice() {
|
|||
|
|
var url='${camera.url}';
|
|||
|
|
var arr=url.split(':');
|
|||
|
|
var ip =arr[0];
|
|||
|
|
var port=37777;
|
|||
|
|
if(arr.length>1){
|
|||
|
|
port=arr[1];
|
|||
|
|
}
|
|||
|
|
var bRet = g_ocx.LoginDeviceEx(ip.toString(), parseInt(port), '${camera.username}', '${camera.password}', 0);
|
|||
|
|
//登录后，默认四窗口显示。若需要自定义其他窗口数，可以调用g_ocx.SetWinBindedChannel
|
|||
|
|
g_ocx.SetWinBindedChannel(1, 0, 0, 0); //这样调用可以切换为单窗口模式，参数意义详见《二次开发使用 WEB32网页调用接口说明.doc》
|
|||
|
|
if (bRet == 0) {
|
|||
|
|
/* document.getElementById('LocalPlay').style.display = '';
|
|||
|
|
document.getElementById('Stop').style.display = '';
|
|||
|
|
document.getElementById('FullScreen').style.display = '';
|
|||
|
|
document.getElementById('Logout').style.display = '';
|
|||
|
|
document.getElementById('idQuery').style.display = '';
|
|||
|
|
document.getElementById('Play').style.display = '';
|
|||
|
|
document.getElementById('OpenIVS').style.display = '';
|
|||
|
|
document.getElementById('CloseIVS').style.display = '';
|
|||
|
|
document.getElementById('QueryFaceImageRecord').style.display = '';
|
|||
|
|
document.getElementById('QueryRecordInfoByTimeEx').style.display = '';
|
|||
|
|
document.getElementById('DownloadFaceImageRecord').style.display = '';
|
|||
|
|
document.getElementById('TransEvent').style.display = '';
|
|||
|
|
document.getElementById('control').style.display = ''; */
|
|||
|
|
//document.getElementById('SnapPicture').style.display = '';
|
|||
|
|
//document.getElementById('GetAllChannelInfo').style.display = '';
|
|||
|
|
|
|||
|
|
//登录成功后可以获取设备通道信息
|
|||
|
|
//GetAllChannelInfo();
|
|||
|
|
//QueryConnectState();
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* [GetAllChannelInfo 获取各通道名信息]
|
|||
|
|
*/
|
|||
|
|
function GetAllChannelInfo() {
|
|||
|
|
var data = g_ocx.GetAllChannelInfo();
|
|||
|
|
}
|
|||
|
|
/**
|
|||
|
|
* [QueryConnectState 查询对应通道的IPC是否在线]
|
|||
|
|
*/
|
|||
|
|
function QueryConnectState() {
|
|||
|
|
/*此协议字段说明：
|
|||
|
|
Protocol 表示和控件交互的协议名 目前控件支持的交互协议具体见文档，这里的QueryDevCfgInfo表示需要查询设备的配置信息
|
|||
|
|
Params 字段表示查询的配置参数：
|
|||
|
|
Command 表示向设备查询的配置名称 cameraConnectState 表示前端连接状态
|
|||
|
|
Channel 表示查询的通道号
|
|||
|
|
*/
|
|||
|
|
var strRet = g_ocx.ProtocolPluginWithWebCall('{"Protocol":"QueryDevCfgInfo", "Params":{"Command":"CameraConnectState","Channel":0}}');
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* [LogoutDevice 登出]
|
|||
|
|
*/
|
|||
|
|
function LogoutDevice() {
|
|||
|
|
g_ocx.LogoutDevice();
|
|||
|
|
document.getElementById('Login').style.display = '';
|
|||
|
|
document.getElementById('PlayBack').style.display = 'none';
|
|||
|
|
document.getElementById('LocalPlay').style.display = 'none';
|
|||
|
|
document.getElementById('Stop').style.display = 'none';
|
|||
|
|
document.getElementById('FullScreen').style.display = 'none';
|
|||
|
|
document.getElementById('Play').style.display = 'none';
|
|||
|
|
document.getElementById('OpenIVS').style.display = 'none';
|
|||
|
|
document.getElementById('CloseIVS').style.display = 'none';
|
|||
|
|
document.getElementById('Logout').style.display = 'none';
|
|||
|
|
document.getElementById('PlayRec').style.display = 'none';
|
|||
|
|
document.getElementById('PauseRec').style.display = 'none';
|
|||
|
|
document.getElementById('FastPlay').style.display = 'none';
|
|||
|
|
document.getElementById('SlowPlay').style.display = 'none';
|
|||
|
|
document.getElementById('ShowPlayTime').style.display = 'none';
|
|||
|
|
document.getElementById('TransEvent').style.display = 'none';
|
|||
|
|
document.getElementById('DwonLoadPos').style.display = 'none';
|
|||
|
|
document.getElementById('RecInfo').style.display = 'none';
|
|||
|
|
document.getElementById('SnapPicture').style.display = 'none';
|
|||
|
|
document.getElementById('GetAllChannelInfo').style.display = 'none';
|
|||
|
|
document.getElementById('idQuery').style.display = 'none';
|
|||
|
|
document.getElementById('QueryFaceImageRecord').style.display = 'none';
|
|||
|
|
document.getElementById('QueryRecordInfoByTimeEx').style.display = 'none';
|
|||
|
|
document.getElementById('DownloadFaceImageRecord').style.display = 'none';
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
////////////////////////////////////////////////////////////////////////////////
|
|||
|
|
//STEP3：实时监视///////////////////////////////////////////////////////////////
|
|||
|
|
////////////////////////////////////////////////////////////////////////////////
|
|||
|
|
|
|||
|
|
function RealPlay() {
|
|||
|
|
//首先切换到监视模式
|
|||
|
|
// g_ocx.SetModuleMode(1); //监视模式
|
|||
|
|
//打开通道视频
|
|||
|
|
var channel = '${camera.channel}';
|
|||
|
|
g_ocx.ConnectRealVideo(parseInt(channel), 1);
|
|||
|
|
/* g_ocx.ConnectRealVideo(8, 1);
|
|||
|
|
g_ocx.ConnectRealVideo(9, 1);
|
|||
|
|
g_ocx.ConnectRealVideo(10, 1); */
|
|||
|
|
// control();
|
|||
|
|
}
|
|||
|
|
function control()
|
|||
|
|
{
|
|||
|
|
alert(1);
|
|||
|
|
|
|||
|
|
g_ocx.ControlPtzEx(nchid, 1, 1, 8, 1, 0);
|
|||
|
|
alter(2);
|
|||
|
|
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
function StopPlay() { //关闭通道视频
|
|||
|
|
g_ocx.DisConnectRealVideo(0);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function OpenIVS() {//打开智能
|
|||
|
|
g_ocx.SetIVSEnable(true);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function CloseIVS() {//关闭智能
|
|||
|
|
g_ocx.SetIVSEnable(false);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* [LocalPlay 播放电脑上保存的录像文件]
|
|||
|
|
*/
|
|||
|
|
function LocalPlay() {
|
|||
|
|
g_ocx.QuickOperation(0);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function SnapPicture() {
|
|||
|
|
g_ocx.SnapPicEx(2, "c:\\test", "123.jpg");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function FullScreen() {
|
|||
|
|
g_ocx.OnFullScreenClk();
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
|
|||
|
|
////////////////////////////////////////////////////////////////////////////////
|
|||
|
|
//STEP4：网络回放(直接播放设备上的录像)/////////////////////////////////////////
|
|||
|
|
////////////////////////////////////////////////////////////////////////////////
|
|||
|
|
/**
|
|||
|
|
* [QueryRecord 回放之前先按照这个步骤调用，并查询录像信息；]
|
|||
|
|
*/
|
|||
|
|
function QueryRecord() {
|
|||
|
|
var year = new Date().getFullYear();
|
|||
|
|
var month = new Date().getMonth() + 1;
|
|||
|
|
var date = new Date().getDate();
|
|||
|
|
|
|||
|
|
g_ocx.SetModuleMode(4); //回放模式
|
|||
|
|
// g_ocx.SetWinBindedChannel(4, 0, 0, 3);
|
|||
|
|
|
|||
|
|
var chnlArray = '{'+'"channels"'+ ':[0,2,3,4]}';
|
|||
|
|
//参数1：窗口分割数；参数2：窗口号； 参数3：通道号数组； 参数4：对应通道3解析的字符串
|
|||
|
|
g_ocx.SetWinBindedChannelEx(4, 0, chnlArray, 'channels');
|
|||
|
|
|
|||
|
|
g_ocx.SwitchMonth(year, month, date);
|
|||
|
|
g_ocx.SwitchDay(year, month, date);
|
|||
|
|
htmlStChn1 = '';
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* [TransEvent 控件状态事件]
|
|||
|
|
* @param {[type]} jsonStr [状态事件信息字符串]
|
|||
|
|
*/
|
|||
|
|
function TransEvent(jsonStr) {
|
|||
|
|
//jsonStr格式：'{"EventName" : "xxx", "EventParam" : { ... }}'
|
|||
|
|
//控件内部的一些状态都会通过该回调上报给js，js根据jsonStr中不同的"EventName"字段判断具体事件
|
|||
|
|
//如："EventName"=="QueryItemInfo"时，调用本例中QueryRecordInfoByTimeEx()会触发，表示录像查询时返回的总的录像记录条数信息
|
|||
|
|
// { "EventName" : "QueryItemInfo",
|
|||
|
|
// "EventParam" : {
|
|||
|
|
// "ItemTotal" : 220, //总的录像记录条数
|
|||
|
|
// "LastItem" : true } } //true时表示查询结束，false表示查询正在进行中
|
|||
|
|
// 录像信息比较多时，会分多次接收该事件，直到 "LastItem" 为true
|
|||
|
|
//
|
|||
|
|
//"EventName"=="NetPlayState"时，回放模式下切换选中窗口会触发，表示当前窗口的回放状态
|
|||
|
|
// {"EventName":"NetPlaySate",
|
|||
|
|
// "EventParam":{
|
|||
|
|
// "MultiScreeninfo":{"Enable":false,"ShowMode":0}, //4K分屏信息：Enable是否使能，ShowMode显示模式
|
|||
|
|
// "channel":2, //通道号
|
|||
|
|
// "direction":"normal", //回放方向：normal 正放；backwards倒放
|
|||
|
|
// "fisheyeinfo":{"Enable",0}, // 鱼眼信息：Enable是否使能
|
|||
|
|
// "isSwitchwin":true, //该值始终为true
|
|||
|
|
// "open":false, //是否正在回放
|
|||
|
|
// "speed":4, //回放速度
|
|||
|
|
// "state":"stop", //回放状况：play播放，pause暂停，stop关闭，speed快进，preFrame前帧，backFrame后帧，backwards倒放
|
|||
|
|
// "winID":0}} //当前窗口号
|
|||
|
|
//
|
|||
|
|
//"EventName"=="ReturnWindInfo"时，监视模式下切换选中窗口会触发，表示当前窗口的监视状态
|
|||
|
|
document.getElementById('trEvent').value = jsonStr;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* [InsertNetRecordFileInfo 接收新的录像信息：由于录像信息比较多，这里会分多次接收]
|
|||
|
|
* @param {[type]} nChannel [录像的通道号]
|
|||
|
|
* @param {[type]} nEnd [该通道是否查询完毕]
|
|||
|
|
* @param {[type]} strRecordInfo [录像信息字符串]
|
|||
|
|
*/
|
|||
|
|
function InsertNetRecordFileInfo(nChannel, nEnd, strRecordInfo) {
|
|||
|
|
//console.log('InsertNetRecordFileInfo')
|
|||
|
|
//strRecordInfo格式：2016011120372620160111203741-14-13824-0-00-00-00-19527-00-00:2016011120372620160111203741-14-13824-0-00-00-00-19527-00-00
|
|||
|
|
//2016011120372620160111203741-14-13824-0-00-00-00-19527-00-00
|
|||
|
|
//录像时间-录像类型-文件大小-文件索引-码流类型-...
|
|||
|
|
var htmlRecordInfo = '';
|
|||
|
|
var recInfo = [];
|
|||
|
|
if (strRecordInfo != '') {
|
|||
|
|
recInfo = strRecordInfo.split(':');
|
|||
|
|
var num = recInfo.length;
|
|||
|
|
for (var i = 0; i < num; i++) {
|
|||
|
|
if (recInfo[i] == '') {
|
|||
|
|
continue;
|
|||
|
|
}
|
|||
|
|
htmlRecordInfo += '<li><a id="StChn' + (i) + '">' + 'channel: ' + nChannel + ' info: ' + recInfo[i] + '</a></li>';
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
document.getElementById('RecInfo').style.display = '';
|
|||
|
|
document.getElementById('DwonLoadPos').style.display = '';
|
|||
|
|
document.getElementById('RecInfoList').innerHTML = htmlRecordInfo;
|
|||
|
|
saveRecordFileInfo(recInfo);
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* [saveRecordFileInfo 保存并处理录像信息]
|
|||
|
|
* @param {[type]} recInfo [录像信息字符串]注：这里的字符串格式是收到的录像信息格式，与下载接口所需要的字符串格式不同。详见本函数中的说明
|
|||
|
|
* @return {[type]} [description]
|
|||
|
|
*/
|
|||
|
|
function saveRecordFileInfo(recInfo) {
|
|||
|
|
var index = 0;
|
|||
|
|
for (var i = 0; i < recInfo.length; i++) {
|
|||
|
|
var tmpInfo = recInfo[i];
|
|||
|
|
if (tmpInfo == '') continue;
|
|||
|
|
var recArry = tmpInfo.split('-');
|
|||
|
|
//原始的文件结构信息(下载文件结构不同)：
|
|||
|
|
//2014102216001120141022160011- 04 - 279 - 53 - 00 -01
|
|||
|
|
//2013041109102020130411100000-type1-size2-nIndex3-stream4-nRecChannel5-nDriveNo6-nStartCluster7
|
|||
|
|
//下载的时候需要传给控件的结构信息：
|
|||
|
|
//开始时间结束时间-type-channel-stream-文件大小2- 磁盘3-起始簇号4
|
|||
|
|
var infoAttach = recArry[0] + '-' + recArry[1] + '-' + recArry[5] + '-' + recArry[4] + (recArry[6] == undefined ? '' : '-' + recArry[2] + '-' + recArry[6] + '-' + recArry[7]);
|
|||
|
|
if (contains(recInfosByFile, infoAttach)) {
|
|||
|
|
continue;
|
|||
|
|
}
|
|||
|
|
recInfosByFile[index] = infoAttach;
|
|||
|
|
index++;
|
|||
|
|
}
|
|||
|
|
//console.log(recInfosByFile)
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
//播放控制
|
|||
|
|
function PlayBack() {
|
|||
|
|
g_ocx.PlayBackByTime(0, '01:00:00');
|
|||
|
|
}
|
|||
|
|
function PlayRec() {
|
|||
|
|
g_ocx.PlayBack();
|
|||
|
|
}
|
|||
|
|
function PauseRec() {
|
|||
|
|
g_ocx.PausePlayBack();
|
|||
|
|
}
|
|||
|
|
function FastPlay() {
|
|||
|
|
if (g_curSpeed >= 8) { //达到最大速度以后再快放就回到正常速度,客户可以按照自己的意愿来处理此时是否灰显快放按钮
|
|||
|
|
g_curSpeed = 4;
|
|||
|
|
} else {
|
|||
|
|
g_curSpeed++;
|
|||
|
|
}
|
|||
|
|
ocx.SpeedPlayBack(g_curSpeed);
|
|||
|
|
}
|
|||
|
|
function SlowPlay() {
|
|||
|
|
if (g_curSpeed <= 0) { //达到最小速度以后再慢放就回到正常速度,客户可以按照自己的意愿来处理此时是否灰显快放按钮
|
|||
|
|
g_curSpeed = 4;
|
|||
|
|
} else {
|
|||
|
|
g_curSpeed--;
|
|||
|
|
}
|
|||
|
|
ocx.SpeedPlayBack(g_curSpeed);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
//可以得到当前的播放时间, 见g_ocx.AddEventListener('NetPlayTimeInform', ShowPlayTime);
|
|||
|
|
function ShowPlayTime(time) {
|
|||
|
|
//时间的格式00020018| |是通道分隔符
|
|||
|
|
var ar = time.split('|');
|
|||
|
|
if (ar[0] == "01010032")
|
|||
|
|
{
|
|||
|
|
ocx.StopPlayBack();
|
|||
|
|
}
|
|||
|
|
g_PlayTime = time;
|
|||
|
|
document.getElementById('playtime').value = g_PlayTime;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
|
|||
|
|
////////////////////////////////////////////////////////////////////////////////
|
|||
|
|
//STEP5：录像下载(直接播放设备上的录像)/////////////////////////////////////////
|
|||
|
|
////////////////////////////////////////////////////////////////////////////////
|
|||
|
|
|
|||
|
|
//查询：按时间查询
|
|||
|
|
function QueryRecordInfoByTimeEx() {
|
|||
|
|
recInfosByFile = [];
|
|||
|
|
//channel：通道号，-1表示查询所有通道
|
|||
|
|
//streamType查询码流类型，0主辅码流，1主码流，2辅码流
|
|||
|
|
//recType:
|
|||
|
|
//RECORD_QUERY = 0, //所有录像文件
|
|||
|
|
//ALARM_QUERY = 1, //外部报警
|
|||
|
|
//MOTION_QUERY = 2, //动态检测报警
|
|||
|
|
//CARD_SEARCH = 4, //卡号查询
|
|||
|
|
//CARD_COM_SEARCH = 5, //卡号查询（串口查询）
|
|||
|
|
//RECORD_POSITION = 6,
|
|||
|
|
//PICTURE_QUERY = 9, //图片查询
|
|||
|
|
//CARD_NET_SEARCH = 10, //卡号查询（网络查询）
|
|||
|
|
//AUDIO_FILE_SEARCH = 18 //音频文件查询(车载)
|
|||
|
|
//13=人脸图片， 14=人脸录像
|
|||
|
|
//maxNumber:每页返回的最大信息条数，接口调用后注册回调InsertNetRecordFileInfo会返回第一页数据；
|
|||
|
|
//调用ocx.QueryGroupRecordInfo(2)接口进行翻页（2：要切到的页码），InsertNetRecordFileInfo会返回第2页数据
|
|||
|
|
|
|||
|
|
//通过AddEventListener()注册的事件监听函数TransEvent(strValue)将总的页数信息传给调用者(["EventName"] = "QueryItemInfo")
|
|||
|
|
//通过AddEventListener()注册的事件监听函数InsertNetRecordFileInfo(nChannel, bEnd, str)将录像文件信息传给调用者，
|
|||
|
|
// 没有满足条件的录像则不触发该监听函数(可通过TransEvent: ["EventName"] = "QueryItemInfo"判断是否有录像)
|
|||
|
|
//TransEvent回调见 function TransEvent
|
|||
|
|
//InsertNetRecordFileInfo回调见 function InsertNetRecordFileInfo
|
|||
|
|
var queryInfo = '{"channel":-1, "streamType":0,"startTime":"2017-6-13 00:00:00","endTime":"2017-6-23 23:59:59","maxNumber":100,"recType":0}'
|
|||
|
|
var bRet = ocx.QueryRecordInfoByTimeEx(queryInfo);
|
|||
|
|
}
|
|||
|
|
function QueryFaceImageRecord() {
|
|||
|
|
recInfosByFile = [];
|
|||
|
|
// recType: 13=人脸图片， 14=人脸录像
|
|||
|
|
var queryInfo = '{"channel":0, "streamType":0,"startTime":"2015-1-10 00:00:00","endTime":"2016-1-15 23:59:59","maxNumber":100,"recType":13}'
|
|||
|
|
var bRet = ocx.QueryRecordInfoByTimeEx(queryInfo);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
//下载：按文件下载 和 按时间下载两种方式
|
|||
|
|
function DownloadRecordByFile() {
|
|||
|
|
// recInfosByFile
|
|||
|
|
if(recInfosByFile.length == 0) {
|
|||
|
|
alert('请先点击“QueryRecordInfoByTime”按钮查询录像。');
|
|||
|
|
return;
|
|||
|
|
}
|
|||
|
|
var params = '{"fileList":"' + recInfosByFile.join(':') + '"}';
|
|||
|
|
var bRet = ocx.DownloadRecordByFileEx(params, "c:\\test\\", "dav")
|
|||
|
|
}
|
|||
|
|
function DownloadByTime() {
|
|||
|
|
//支持JS自定义保存的录像文件名
|
|||
|
|
var str = '{"Protocol":"DownloadByTimeWithFileName","Params":{"ChannelID":1, "BeginTime":"2017-06-13 00:10:00", "EndTime":"2017-06-13 00:18:00", "Path":"C:\/\/RecordFile", "SaveName":"大华二次开发_DHFILE","Format":"dav"}}';
|
|||
|
|
g_ocx.ProtocolPluginWithWebCall(str);
|
|||
|
|
//按时间保存录像文件，不支持自定义文件名
|
|||
|
|
//g_ocx.DownloadRecordByTime(0, '2014-11-04 01:05:00', '2014-11-04 01:18:00', 'C:\\RecordDownload', 'dav');
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
////////////////////////////////////////////////////////////////////////////////
|
|||
|
|
//STEP6：公共接口///////////////////////////////////////////////////////////////
|
|||
|
|
////////////////////////////////////////////////////////////////////////////////
|
|||
|
|
function contains(arr, obj) {
|
|||
|
|
var i = arr.length;
|
|||
|
|
while (i--) {
|
|||
|
|
if (arr[i] == obj) {
|
|||
|
|
return true;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
return false;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function Sleep(n) {
|
|||
|
|
var start = new Date().getTime();
|
|||
|
|
while (true) {
|
|||
|
|
if (new Date().getTime() - start > n) {
|
|||
|
|
break;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function ShowRecInfo(nCh, strRecodInfo) {
|
|||
|
|
document.getElementById('PlayBack').style.display = '';
|
|||
|
|
document.getElementById('PlayRec').style.display = '';
|
|||
|
|
document.getElementById('PauseRec').style.display = '';
|
|||
|
|
document.getElementById('FastPlay').style.display = '';
|
|||
|
|
document.getElementById('SlowPlay').style.display = '';
|
|||
|
|
document.getElementById('download').style.display = '';
|
|||
|
|
document.getElementById('RecInfo').style.display = '';
|
|||
|
|
document.getElementById('ShowPlayTime').style.display = '';
|
|||
|
|
document.getElementById('DwonLoadPos').style.display = '';
|
|||
|
|
g_PlayTime = "";
|
|||
|
|
var readtime = strRecodInfo.split(':');
|
|||
|
|
var num = readtime.length;
|
|||
|
|
for (var i = 0; i < num; i++) {
|
|||
|
|
if (readtime[i] == '')
|
|||
|
|
continue;
|
|||
|
|
htmlStChn1 += '<li><a id="StChn' + (i) + '">' + 'channel: ' + nCh + ' info: ' + readtime[i] + '</a></li>';
|
|||
|
|
}
|
|||
|
|
document.getElementById('RecInfoList').innerHTML = htmlStChn1;
|
|||
|
|
}
|
|||
|
|
</script>
|