Files
SIPAIIS_WMS_JSSW/WebRoot/jsp/work/scadapic/processVideoView_Dahua.jsp
2026-01-16 14:13:44 +08:00

548 lines
25 KiB
Plaintext
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!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:350px;">
</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);
// 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" : { ... }}'
//控件内部的一些状态都会通过该回调上报给jsjs根据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>