|
|
<!DOCTYPE html> |
|
|
<html> |
|
|
|
|
|
<head> |
|
|
<meta http-equiv="cache-control" |
|
|
content="max-age=0" /> |
|
|
<meta http-equiv="cache-control" |
|
|
content="no-store" /> |
|
|
<meta http-equiv="expires" |
|
|
content="-1" /> |
|
|
<meta http-equiv="expires" |
|
|
content="Tue, 01 Jan 1980 1:00:00 GMT" /> |
|
|
<meta http-equiv="pragma" |
|
|
content="no-cache" /> |
|
|
|
|
|
<meta name="viewport" content="width=device-width, initial-scale=1" /> |
|
|
<!--meta http-equiv="refresh" content="300" />--> <!--Refresh each 5s--> |
|
|
<meta charset="utf-8" /> |
|
|
<style> |
|
|
|
|
|
body, |
|
|
html { |
|
|
font-family: "Arial"; |
|
|
} |
|
|
|
|
|
* { |
|
|
box-sizing: border-box; |
|
|
} |
|
|
|
|
|
/* Create two equal columns that floats next to each other */ |
|
|
.column { |
|
|
float: left; |
|
|
overflow: hidden; |
|
|
/*width: 33%;*/ |
|
|
padding-left: 10px; |
|
|
/*height: 300px;*/ |
|
|
margin: auto; |
|
|
/* Should be removed. Only for demonstration */ |
|
|
} |
|
|
|
|
|
/* Clear floats after the columns */ |
|
|
.keyrow { |
|
|
display: flex; |
|
|
/* 水平置中 */ |
|
|
justify-content: center; |
|
|
/* 垂直置中 */ |
|
|
/*align-content: center;*/ |
|
|
flex-wrap: wrap; |
|
|
} |
|
|
|
|
|
|
|
|
.row:after { |
|
|
content: ""; |
|
|
display: table; |
|
|
clear: both; |
|
|
} |
|
|
|
|
|
/* Responsive layout - makes the two columns stack on top of each other instead of next to each other */ |
|
|
@media screen and (max-width: 800px) { |
|
|
.column { |
|
|
width: 100%; |
|
|
} |
|
|
} |
|
|
|
|
|
ul { |
|
|
list-style-type: none; |
|
|
margin: 0px; |
|
|
/* overflow: hidden; */ |
|
|
overflow-y: scroll; |
|
|
} |
|
|
|
|
|
li { |
|
|
margin-left: -40px; |
|
|
} |
|
|
|
|
|
.controls { |
|
|
display: inline-block; |
|
|
} |
|
|
|
|
|
.titlebox { |
|
|
float: left; |
|
|
padding: 0 5px; |
|
|
margin: -30px 0 0 20px; |
|
|
background: #fff; |
|
|
} |
|
|
|
|
|
/*scale y*/ |
|
|
.div-a { |
|
|
position: relative; |
|
|
width: 800px; |
|
|
height: 600px; |
|
|
/*320*/ |
|
|
/*transform: scale(0.85);*/ |
|
|
/* Equal to scaleX(0.7) scaleY(0.7) */ |
|
|
} |
|
|
|
|
|
/*scale x*/ |
|
|
.div-b { |
|
|
position: relative; |
|
|
/*top: -600px; |
|
|
left: 820px;*/ |
|
|
width: 800px; |
|
|
height: 600px; |
|
|
} |
|
|
|
|
|
.div-relative { |
|
|
position: relative; |
|
|
align-items: center; |
|
|
color: #000000; |
|
|
} |
|
|
</style> |
|
|
<!--meta http-equiv="refresh" content="300" />--> |
|
|
<!--Refresh each 5s--> |
|
|
<title>AI Engine</title> |
|
|
<script src="jquery_3_2_1.min.js"></script> |
|
|
<script src="fabric_jquery.easyui.min_compressed_on_nvr.js"></script> |
|
|
<script src="config.js"></script> |
|
|
<script src="cookie.min.js"></script> |
|
|
<script src="lang.js"></script> |
|
|
<script src="lang_cookie.js"></script> |
|
|
<!-- a113n added --> |
|
|
<link rel="stylesheet" href="ruler/ruler.min.css"> |
|
|
<script src="ruler/ruler.min.js"></script> |
|
|
<!-- <script src="ruler/ruler.js"></script> --> |
|
|
|
|
|
<link rel="stylesheet" href="bootstrap.min.css"> |
|
|
<link rel="stylesheet" type="text/css" href="easyui.css"> |
|
|
<!-- 2022-12-28 Merge issue : move all radar related funcs to radar.js, avoid the undefined problem --> |
|
|
<script src="radar_speed_share.js"></script> |
|
|
<script src="radar.js"></script> |
|
|
|
|
|
<script> |
|
|
window.onerror = function (message, url, linenumber) { |
|
|
console.log('[radar.html] JavaScript error: ' + message + ' on line ' + linenumber + ' for ' + url); |
|
|
|
|
|
if (url.search("fabric_jquery.easyui.min_compressed_on_nvr.js") >= 1) { |
|
|
loadScript("fabric_jquery.easyui.min_compressed_on_nvr.js", function () { |
|
|
}); |
|
|
} |
|
|
else if (url.search("jquery_3_2_1.min.js") >= 1) { |
|
|
loadScript("jquery_3_2_1.min.js", function () { |
|
|
}); |
|
|
} |
|
|
else if (url.search("config.js") >= 1) { |
|
|
loadScript("config.js", function () { |
|
|
}); |
|
|
} |
|
|
else if (url.search("cookie.min.js") >= 1) { |
|
|
loadScript("cookie.min.js", function () { |
|
|
}); |
|
|
} |
|
|
else if (url.search("lang.js") >= 1) { |
|
|
loadScript("lang.js", function () { |
|
|
}); |
|
|
} |
|
|
/* |
|
|
else if (url.search("js_3_5_1.js") >= 1) { |
|
|
loadScript("js_3_5_1.js", function () { |
|
|
}); |
|
|
}*/ |
|
|
else if (url.search("lang_cookie.js") >= 1) { |
|
|
loadScript("lang_cookie.js", function () { |
|
|
}); |
|
|
} |
|
|
else if (message.search("slider") >= 1) { |
|
|
loadScript("fabric_jquery.easyui.min_compressed_on_nvr.js", function () { |
|
|
}); |
|
|
} |
|
|
else if (message.search("myport") >= 1) { |
|
|
loadScript("config.js", function () { |
|
|
}); |
|
|
} |
|
|
else if (message.search("cookie") >= 1) { |
|
|
loadScript("cookie.min.js", function () { |
|
|
}); |
|
|
} |
|
|
else { |
|
|
//location.reload(); |
|
|
var replaceUrl = 'http://' + window.location.hostname + ':' + GetUrlPort() + '/Aida/radar.html'; |
|
|
//alert(replaceUrl); |
|
|
window.location.replace(replaceUrl); |
|
|
} |
|
|
} |
|
|
function GetUrlPort() { |
|
|
var url_href = window.location.href; |
|
|
var arr_url = url_href.split(":")[2].split("/")[0]; |
|
|
|
|
|
return arr_url; |
|
|
} |
|
|
if (window.history.replaceState) { |
|
|
window.history.replaceState(null, null, window.location.href); |
|
|
} |
|
|
</script> |
|
|
</head> |
|
|
|
|
|
<body onContextMenu="window.event.returnValue=false"> |
|
|
|
|
|
<div class="progress" style="background-color:white"> |
|
|
<div class="progress-bar progress-bar-striped" style="min-width: 20px;visibility:hidden;"></div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div style="border:1px gray solid;padding:20px; height: 750px;margin:15px 15px 15px 15px"> |
|
|
<div class="titlebox"> |
|
|
<nobr id="TITLEBOX_PAGE14"></nobr> |
|
|
</div> |
|
|
|
|
|
<div class="row"> |
|
|
<div id="radar_view" class="column" style="width:100%;"> |
|
|
<div align="center" class="div-relative"> |
|
|
|
|
|
<div class="div-a" id="ruler_wrapper_radar"> |
|
|
<script> rulerRadar = set_ruler(rulerRadar, "radar"); </script> |
|
|
<canvas id="CanvasTripwire_radar"></canvas> |
|
|
</div> |
|
|
|
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div id="ptz_view" class="column" style="width:50%;display:none;"> |
|
|
<div class="div-relative"> |
|
|
<div class="div-b"> |
|
|
<canvas id="CanvasTripwire_radarPTZ"></canvas> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<!--scale bar--> |
|
|
<br><br> |
|
|
<div class="row"> |
|
|
<div id="radar_dis1" class="column" style="width: 15%;"> |
|
|
<nobr id="IDC_STATIC_DISTANCE" style="display:inline;"></nobr> |
|
|
<nobr id="TEXT_DISTANCE_FORMAT1"></nobr> |
|
|
<br> |
|
|
<nobr id="IDC_STATIC_DISTANCE_XY_SYNC"> </nobr> |
|
|
<input id="xy_sync" type="checkbox" onchange="enable_xy_sync(this);"> |
|
|
<br> |
|
|
<nobr id="IDC_STATIC_RADAR_UNIT"> </nobr> |
|
|
<select id="distance_format" style="display:inline;" onchange="func_changeformat();"> |
|
|
<option value="meter">meter</option> |
|
|
<option value="feet">feet</option> |
|
|
</select> |
|
|
|
|
|
</div> |
|
|
|
|
|
<div id="radar_dis2" class="column" style="width: 5%;"> |
|
|
<!--CHECKBOX: SAME X & Y same scale--> |
|
|
<nobr id="IDC_STATIC_DISTANCE_MEANING_X"></nobr> |
|
|
<br><br><br> |
|
|
<nobr id="IDC_STATIC_DISTANCE_MEANING_Y"></nobr> |
|
|
<br> |
|
|
|
|
|
</div> |
|
|
<div id="radar_dis3" class="column" style="width: 50%;"> |
|
|
<br> |
|
|
<input class="easyui-slider" style="display:inline;" id="slider_distance"> |
|
|
<br> |
|
|
<input class="easyui-slider" style="display:inline;" id="slider_distance_y"> |
|
|
|
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div style="border:1px gray solid;padding:20px;height: 290px;margin:15px 15px 15px 15px"> |
|
|
|
|
|
<div class="titlebox"> |
|
|
<nobr id="TITLEBOX_PAGE15"></nobr> |
|
|
</div> |
|
|
|
|
|
<div class="row"> |
|
|
<div id="radar_settings0" class="column" style="width: 25%;"> |
|
|
|
|
|
|
|
|
|
|
|
</div> |
|
|
<div id="radar_settings" class="column" style="width: 25%;"> |
|
|
<div class="div-relative" style="width: 400px;text-align: left;"> |
|
|
<nobr id="TITLEBOX_PAGE16"> </nobr> |
|
|
|
|
|
<input id="radar_vall" type="button" onclick="func_show_radar_point(this);" value="All" /> |
|
|
<input id="radar_v1" type="button" onclick="func_show_radar_point(this);" value="V1" /> |
|
|
<input id="radar_v2" type="button" onclick="func_show_radar_point(this);" value="V2" /> |
|
|
<input id="radar_v3" type="button" onclick="func_show_radar_point(this);" value="V3" /> |
|
|
<br><br> |
|
|
<!-- <form action="/import_radar_user" method="post" enctype="multipart/form-data"> |
|
|
<input type="file" name="filename" /> |
|
|
<input type="submit" value="Upload" /> |
|
|
</form> --> |
|
|
<input id="radarbg" type="file" onchange=func_upload_radarbg_with_progress(this) style="display: none" /> |
|
|
<button type="button" onclick="radarbg.click()"> Upload </button> |
|
|
<br> |
|
|
<nobr id="IDC_STATIC_TRIAL_LIFE_TIME"> </nobr> |
|
|
<br> |
|
|
<nobr id="IDC_CHECK_CALIBRATION_RADAR"> </nobr> |
|
|
<input id="calibration_radar" type="checkbox" name="calibration_radar" /> |
|
|
<br> |
|
|
<nobr id="IDC_STATIC_RADAR_HEIGHT"> </nobr> |
|
|
<br> |
|
|
<nobr id="IDC_STATIC_RADAR_DEGREE"> </nobr> |
|
|
<!-- |
|
|
<br><br> |
|
|
<nobr id="IDC_STATIC_DISTANCE" style="display:inline;"></nobr> |
|
|
<nobr id="TEXT_DISTANCE_FORMAT1"></nobr> |
|
|
<nobr id="IDC_STATIC_DISTANCE_MEANING_X"></nobr> |
|
|
<br><br> |
|
|
|
|
|
<nobr id="IDC_STATIC_RADAR_UNIT"> </nobr> |
|
|
<select id="distance_format" style="display:inline;" onchange="func_changeformat();"> |
|
|
<option value="meter">meter</option> |
|
|
<option value="feet">feet</option> |
|
|
</select> |
|
|
--> |
|
|
<br> |
|
|
<nobr id="IDC_CHECK_ENABLE_PTZ"> </nobr> |
|
|
<input id="enable_ptz" type="checkbox" onchange=enable_ptz_change(); > |
|
|
<br> |
|
|
<nobr id="IDC_STATIC_RADAR_SECTION_DEGREE"> </nobr> |
|
|
<br> |
|
|
</div> |
|
|
|
|
|
|
|
|
</div> |
|
|
<div id="radar_settings2" class="column" style="width: 50%;"> |
|
|
<br><br><br> |
|
|
<!-- <input id="trial_life_time" type="text" value="" style="width: 50px" />Sec --> |
|
|
<select id="trial_life_time" style="display:inline;"> |
|
|
<option value="0">0</option> |
|
|
<option value="1">1</option> |
|
|
<option value="2">2</option> |
|
|
<option value="3">3</option> |
|
|
<option value="4">4</option> |
|
|
<option value="5">5</option> |
|
|
</select>Sec |
|
|
<br><br> |
|
|
<!-- <input id="radar_height" type="text" value="" style="width: 50px" /> --> |
|
|
<br> |
|
|
<select id="radar_height" style="display:inline;"> |
|
|
<option value="1">1</option> |
|
|
<option value="2">2</option> |
|
|
<option value="3">3</option> |
|
|
<option value="4">4</option> |
|
|
<option value="5">5</option> |
|
|
</select> |
|
|
<nobr id="TEXT_DISTANCE_FORMAT2"></nobr> |
|
|
<br> |
|
|
<span id="world_radar_degree"></span> |
|
|
<br> |
|
|
|
|
|
<!-- |
|
|
<input class="easyui-slider" style="display:inline;" id="slider_distance" /> |
|
|
<br><br><br> |
|
|
--> |
|
|
|
|
|
<br> |
|
|
<input id="radar_section_degree" type="text" value="" style="width: 50px" /> |
|
|
<br> |
|
|
</div> |
|
|
<div id="ptz_setting_block" class="column" style="width:25%;display:none;"> |
|
|
<nobr id="TITLEBOX_PAGE17"> </nobr> |
|
|
<br> |
|
|
<br> |
|
|
<nobr id="IDC_STATIC_IP_SETTING"> </nobr> |
|
|
<input id="enable_ip_setting" type="checkbox" name="enable_ip_setting" /> |
|
|
<br> |
|
|
<nobr id="IDC_STATIC_IP_ADDRESS"> </nobr> |
|
|
<input id="camera_ip" type="text" value="" style="width: 100px" /> |
|
|
<br> |
|
|
<nobr id="IDC_STATIC_IP_USERNAME"> </nobr> |
|
|
<input id="camera_username" type="text" value="" style="width: 200px" /> |
|
|
<br> |
|
|
<nobr id="IDC_CHECK_CALIBRATION_PTZ"> </nobr> |
|
|
<input id="enable_calibration_ptz" type="checkbox" name="enable_calibration_ptz" /> |
|
|
<br> |
|
|
<nobr id="IDC_STATIC_PTZ_HEIGHT"> </nobr> |
|
|
|
|
|
<br> |
|
|
<nobr id="IDC_STATIC_PTZ_DEGREE"> </nobr> |
|
|
<br> |
|
|
<nobr id="IDC_CHECK_ENABLE_PTZ_TRACKING"> </nobr> |
|
|
<input id="enable_ptz_tracking" type="checkbox" /> |
|
|
<br> |
|
|
<input id="setting_radar_home_point" type="button" value="" onclick="func_sethmoepoint()"> |
|
|
|
|
|
|
|
|
</div> |
|
|
<div id="ptz_setting_block2" class="column" style="width:25%;display:none;"> |
|
|
<br><br><br> |
|
|
<nobr id="IDC_STATIC_IP_PORT"> </nobr> |
|
|
<input id="camera_port" type="text" value="" style="width: 100px" /> |
|
|
<br> |
|
|
<nobr id="IDC_STATIC_IP_PASSWORD"> </nobr> |
|
|
<input id="camera_password" type="password" value="" style="width: 200px" /> |
|
|
<br> |
|
|
<br> |
|
|
<input id="ptz_height" type="text" value="" style="width: 50px" /> |
|
|
<nobr id="TEXT_DISTANCE_FORMAT3"></nobr> |
|
|
<br> |
|
|
<input class="easyui-slider" style="display:inline;" id="ptz_degree" /> |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</div> |
|
|
</div> |
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
|
|
|
|
<div> |
|
|
<div align="center"> |
|
|
<input align="center" id="IDOK" type="button" value=" Set " onclick="func_setradar_with_progress();" |
|
|
style="background-color:#6c87d4;color:white;height:36px;width:300px;" /> |
|
|
<input align="center" id="ID_DEFAULT" type="button" value=" Default " onclick="func_setradar_default_with_progress();" |
|
|
style="background-color:#6c87d4;color:white;height:36px;width:300px;" /> |
|
|
</div> |
|
|
</div> |
|
|
<!-- <div> |
|
|
<textarea style="width: 1700px; height: 500px;" id="test_txtbox"></textarea> |
|
|
</div> --> |
|
|
|
|
|
<script> |
|
|
// rulerRadar = set_ruler(rulerRadar, "radar"); |
|
|
loadScript("config.js", function () { |
|
|
loadScript("cookie.min.js", function () { |
|
|
loadScript("lang.js", function () { |
|
|
loadScript("lang_cookie.js", function () { |
|
|
//alert("all load"); |
|
|
|
|
|
}); |
|
|
}); |
|
|
}); |
|
|
}); |
|
|
/*<nobr id="radar section degree"> </nobr>*/ |
|
|
function loadScript(url, callback) { |
|
|
var script = document.createElement("Script"); |
|
|
script.type = "text/javascript"; |
|
|
|
|
|
//IE 验证脚本是否下载完成 |
|
|
if (script.readyState) { |
|
|
script.onreadystatechange = function () { |
|
|
//readyState属性有5种取值 |
|
|
//uninitialized：初始状态 |
|
|
//loading：开始下载 |
|
|
//interactive：数据完成下载但尚不可用 |
|
|
//complete：数据已经准备就绪 |
|
|
//实际使用时，readyState的值并不像我们预想的那样有规律，实践发现使用readyState |
|
|
//最靠谱的方式是同时检查以下2个状态，只要其中1个触发，就认为脚本下载完成。 |
|
|
if (script.readyState == "loaded" || script.readyState == "complete") { |
|
|
//移除事件处理器，确保事件不会处理2次 |
|
|
script.onreadystatechange = null; |
|
|
callback(); |
|
|
} |
|
|
}; |
|
|
} |
|
|
|
|
|
//其他浏览器 |
|
|
else { |
|
|
script.onload = function () { |
|
|
callback(); |
|
|
}; |
|
|
} |
|
|
|
|
|
script.src = url; |
|
|
//把新建的<Script>添加到<head>里比添加到<body>里更保险。 |
|
|
document.getElementsByTagName("head")[0].appendChild(script); |
|
|
} |
|
|
|
|
|
// 2022-12-29 Merge issue : send request to /getradar CGI twice, put the same info to local variable and local storage |
|
|
func_getRadarData(); |
|
|
func_getradarjson(); |
|
|
|
|
|
//UI Interface |
|
|
func_drawRadarSection("radar"); |
|
|
|
|
|
func_get_lang_cookie(); |
|
|
|
|
|
|
|
|
canvasTripwire_radar = createCanvas(canvasTripwire_radar, "radar"); // createCanvasRadar(); |
|
|
canvasTripwire_radarPTZ = createCanvas(canvasTripwire_radarPTZ, "radarPTZ"); // createCanvasPTZ(); |
|
|
|
|
|
TEXT_DISTANCE_FORMAT = localStorage.getItem("distance_format"); |
|
|
document.getElementById("IDC_CHECK_ENABLE_PTZ_TRACKING").innerHTML = IDC_CHECK_ENABLE_PTZ_TRACKING; |
|
|
// document.getElementById("IDC_CHECK_SETTING_HOME_POINT").innerHTML = IDC_CHECK_SETTING_HOME_POINT; |
|
|
document.getElementById("IDC_CHECK_CALIBRATION_PTZ").innerHTML = IDC_CHECK_CALIBRATION_PTZ; |
|
|
document.getElementById("IDC_CHECK_ENABLE_PTZ").innerHTML = IDC_CHECK_ENABLE_PTZ; |
|
|
document.getElementById("IDC_CHECK_CALIBRATION_RADAR").innerHTML = IDC_CHECK_CALIBRATION_RADAR; |
|
|
document.getElementById("IDC_STATIC_IP_SETTING").innerHTML = IDC_STATIC_IP_SETTING; |
|
|
document.getElementById("IDC_STATIC_TRIAL_LIFE_TIME").innerHTML = IDC_STATIC_TRIAL_LIFE_TIME; |
|
|
document.getElementById("IDC_STATIC_RADAR_UNIT").innerHTML = IDC_STATIC_RADAR_UNIT; |
|
|
document.getElementById("IDC_STATIC_PTZ_DEGREE").innerHTML = IDC_STATIC_PTZ_DEGREE; |
|
|
document.getElementById("IDC_STATIC_PTZ_HEIGHT").innerHTML = IDC_STATIC_PTZ_HEIGHT; |
|
|
document.getElementById("IDC_STATIC_RADAR_HEIGHT").innerHTML = IDC_STATIC_RADAR_HEIGHT; |
|
|
document.getElementById("IDC_STATIC_RADAR_DEGREE").innerHTML = IDC_STATIC_RADAR_DEGREE; |
|
|
document.getElementById("IDC_STATIC_DISTANCE").innerHTML = IDC_STATIC_DISTANCE; |
|
|
document.getElementById("TEXT_DISTANCE_FORMAT1").innerHTML = TEXT_DISTANCE_FORMAT; |
|
|
document.getElementById("TEXT_DISTANCE_FORMAT2").innerHTML = TEXT_DISTANCE_FORMAT; |
|
|
document.getElementById("TEXT_DISTANCE_FORMAT3").innerHTML = TEXT_DISTANCE_FORMAT; |
|
|
document.getElementById("IDC_STATIC_RADAR_SECTION_DEGREE").innerHTML = IDC_STATIC_RADAR_SECTION_DEGREE; |
|
|
|
|
|
//ptz |
|
|
document.getElementById("IDC_STATIC_IP_ADDRESS").innerHTML = IDC_STATIC_IP_ADDRESS; |
|
|
document.getElementById("IDC_STATIC_IP_PORT").innerHTML = IDC_STATIC_IP_PORT; |
|
|
document.getElementById("IDC_STATIC_IP_USERNAME").innerHTML = IDC_STATIC_IP_USERNAME; |
|
|
document.getElementById("IDC_STATIC_IP_PASSWORD").innerHTML = IDC_STATIC_IP_PASSWORD; |
|
|
|
|
|
$('#IDOK').val(IDOK);//apply |
|
|
$('#IDC_STATIC_RADAR_UPLOAD').val(IDC_STATIC_RADAR_UPLOAD); |
|
|
$('#setting_radar_home_point').val(IDC_CHECK_SETTING_HOME_POINT); |
|
|
document.getElementById("TITLEBOX_PAGE14").innerHTML = TITLEBOX_PAGE14; |
|
|
document.getElementById("TITLEBOX_PAGE15").innerHTML = TITLEBOX_PAGE15; |
|
|
document.getElementById("TITLEBOX_PAGE16").innerHTML = TITLEBOX_PAGE16; |
|
|
document.getElementById("TITLEBOX_PAGE17").innerHTML = TITLEBOX_PAGE17; |
|
|
document.getElementById("IDC_STATIC_DISTANCE_MEANING_X").innerHTML = IDC_STATIC_DISTANCE_MEANING_X; |
|
|
document.getElementById("IDC_STATIC_DISTANCE_MEANING_Y").innerHTML = IDC_STATIC_DISTANCE_MEANING_Y; |
|
|
document.getElementById("IDC_STATIC_DISTANCE_XY_SYNC").innerHTML = IDC_STATIC_DISTANCE_XY_SYNC; |
|
|
|
|
|
$("#slider_distance").slider({ |
|
|
width: 400, |
|
|
//height: 300, |
|
|
//value: 12, |
|
|
mode: 'h',//v,h |
|
|
showTip: true, |
|
|
//将最大最小值对调 |
|
|
// reversed:true, |
|
|
//disabled:true, |
|
|
min: 3, |
|
|
max: 300, |
|
|
// step:2.5, |
|
|
//提示格式函数 |
|
|
tipFormatter: function (value) { |
|
|
// return '['+value+']'; |
|
|
return value; |
|
|
}, |
|
|
onChange: function (newValue, oldValue) { |
|
|
if (enalbe_radar_xy_sync == 1) { |
|
|
//var distance_meter_x = document.getElementById("slider_distance").value; |
|
|
//$('#slider_distance_y').slider('setValue', distance_meter_x); |
|
|
$('#slider_distance_y').slider('setValue', newValue); |
|
|
} |
|
|
|
|
|
// alert(newValue+" | "+oldValue); |
|
|
}, |
|
|
onSlideStart: function (value) { |
|
|
// alert(value); |
|
|
}, |
|
|
onSlideEnd: function (value) { |
|
|
// alert(value); |
|
|
sent_ruler_scale_value(); |
|
|
} |
|
|
|
|
|
}); |
|
|
$("#slider_distance_y").slider({ |
|
|
width: 400, |
|
|
//height: 300, |
|
|
//value: 12, |
|
|
mode: 'h',//v,h |
|
|
showTip: true, |
|
|
//将最大最小值对调 |
|
|
// reversed:true, |
|
|
//disabled:true, |
|
|
min: 3, |
|
|
max: 300, |
|
|
// step:2.5, |
|
|
//提示格式函数 |
|
|
tipFormatter: function (value) { |
|
|
// return '['+value+']'; |
|
|
return value; |
|
|
}, |
|
|
onChange: function (newValue, oldValue) { |
|
|
if (enalbe_radar_xy_sync == 1) { |
|
|
//var distance_meter_y = document.getElementById("slider_distance_y").value; |
|
|
//$('#slider_distance').slider('setValue', distance_meter_y); |
|
|
$('#slider_distance').slider('setValue', newValue); |
|
|
} |
|
|
|
|
|
// alert(newValue+" | "+oldValue); |
|
|
}, |
|
|
onSlideStart: function (value) { |
|
|
// alert(value); |
|
|
}, |
|
|
onSlideEnd: function (value) { |
|
|
//alert(value+" | "+value); |
|
|
} |
|
|
|
|
|
}); |
|
|
$("#ptz_degree").slider({ |
|
|
width: 200, |
|
|
//height: 300, |
|
|
//value: 12, |
|
|
mode: 'h',//v,h |
|
|
showTip: true, |
|
|
//将最大最小值对调 |
|
|
// reversed:true, |
|
|
// disabled:true, |
|
|
min: 0, |
|
|
max: 179, |
|
|
// step:2.5, |
|
|
//提示格式函数 |
|
|
tipFormatter: function (value) { |
|
|
// return '['+value+']'; |
|
|
return value; |
|
|
}, |
|
|
onChange: function (newValue, oldValue) { |
|
|
// alert(newValue+" | "+oldValue); |
|
|
}, |
|
|
onSlideStart: function (value) { |
|
|
// alert(value); |
|
|
}, |
|
|
onSlideEnd: function (value) { |
|
|
// alert(value); |
|
|
} |
|
|
|
|
|
}); |
|
|
|
|
|
|
|
|
// 2022-12-29 Merge issue : repeatedly call this function |
|
|
canvasTripwire_radarPTZ, radarShowImgInterval = func_getRadarInfo("radar", canvasTripwire_radarPTZ, radarShowImgInterval); |
|
|
|
|
|
function func_changeformat() { |
|
|
localStorage.setItem("distance_format", document.getElementById("distance_format").value); |
|
|
TEXT_DISTANCE_FORMAT = document.getElementById("distance_format").value; |
|
|
canvasTripwire_radarPTZ, radarShowImgInterval = func_getRadarInfo("radar", canvasTripwire_radarPTZ, radarShowImgInterval); |
|
|
} |
|
|
|
|
|
//make progress |
|
|
|
|
|
$(".progress-bar").css("visibility", "hidden"); |
|
|
function upload_radarbg_with_progress(e) { |
|
|
console.log("upload_radarbg_with_progress",k_index); |
|
|
if (k_index < 100 && k_index >= 0) { |
|
|
k_index = k_index + 1; |
|
|
$(".progress-bar").css("visibility","visible"); |
|
|
//$(".progress-bar").css("width", k_index + "%").text(k_index + " %"); |
|
|
$(".progress-bar").css("width", k_index + "%"); |
|
|
|
|
|
if (k_index == 1) { |
|
|
upload_radarbg(e); |
|
|
k_index = 97; |
|
|
} |
|
|
else if (k_index == 100) { |
|
|
$(".progress-bar").css("visibility", "hidden"); |
|
|
//$(".progress-bar").css("width", "0%").text("0 %"); |
|
|
$(".progress-bar").css("width", "0%"); |
|
|
k_index = -1; |
|
|
|
|
|
|
|
|
} |
|
|
// Wait for sometime before running this script again |
|
|
setTimeout("upload_radarbg_with_progress()", 200); |
|
|
} |
|
|
} |
|
|
|
|
|
function func_upload_radarbg_with_progress(e) { |
|
|
// makeProgress(); |
|
|
k_index = 0; |
|
|
upload_radarbg_with_progress(e); |
|
|
} |
|
|
|
|
|
// function makeProgress() { |
|
|
// if (k_index < 100 && k_index >= 0) { |
|
|
// k_index = k_index + 1; |
|
|
// $(".progress-bar").css("visibility","visible"); |
|
|
// //$(".progress-bar").css("width", k_index + "%").text(k_index + " %"); |
|
|
// $(".progress-bar").css("width", k_index + "%"); |
|
|
|
|
|
// if (k_index == 1) { |
|
|
|
|
|
// k_index = 94; |
|
|
// } |
|
|
// else if (k_index == 95) { |
|
|
// // waitSeconds(500); |
|
|
// } |
|
|
// else if (k_index == 100) { |
|
|
// $(".progress-bar").css("visibility", "hidden"); |
|
|
// //$(".progress-bar").css("width", "0%").text("0 %"); |
|
|
// $(".progress-bar").css("width", "0%"); |
|
|
// k_index = -1; |
|
|
|
|
|
|
|
|
// } |
|
|
// // Wait for sometime before running this script again |
|
|
// setTimeout("makeProgress()", 200); |
|
|
// } |
|
|
// } |
|
|
|
|
|
|
|
|
function enable_ptz_change(){ |
|
|
if ($('#enable_ptz').is(":checked")) { |
|
|
enable_ptz_temp = "Yes"; |
|
|
document.getElementById("ptz_view").style.display = "block"; |
|
|
document.getElementById("radar_view").style.width = "50%"; |
|
|
document.getElementById("radar_settings").style.width = "25%"; |
|
|
document.getElementById("radar_settings2").style.width = "25%"; |
|
|
document.getElementById("ptz_setting_block").style.display = "block"; |
|
|
document.getElementById("ptz_setting_block2").style.display = "block"; |
|
|
document.getElementById("radar_settings0").style.display = "none"; |
|
|
} |
|
|
else { |
|
|
enable_ptz_temp = "No"; |
|
|
document.getElementById("ptz_view").style.display = "none"; |
|
|
document.getElementById("radar_view").style.width = "100%"; |
|
|
document.getElementById("radar_settings").style.width = "25%"; |
|
|
document.getElementById("radar_settings2").style.width = "25%"; |
|
|
document.getElementById("ptz_setting_block").style.display = "none"; |
|
|
document.getElementById("ptz_setting_block2").style.display = "none"; |
|
|
document.getElementById("radar_settings0").style.display = "block"; |
|
|
} |
|
|
func_setelement("enable_camera", enable_ptz_temp); |
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
//make progress setradar |
|
|
$(".progress-bar").css("visibility", "hidden"); |
|
|
function makeProgress_setradar() { |
|
|
console.log("makeProgress_setradar",k_index); |
|
|
if (k_index < 100 && k_index >= 0) { |
|
|
k_index = k_index + 1; |
|
|
$(".progress-bar").css("visibility","visible"); |
|
|
//$(".progress-bar").css("width", k_index + "%").text(k_index + " %"); |
|
|
$(".progress-bar").css("width", k_index + "%"); |
|
|
|
|
|
if (k_index == 1) { |
|
|
|
|
|
k_index = 94; |
|
|
} |
|
|
else if (k_index == 95) { |
|
|
// waitSeconds(500); |
|
|
//setradar start |
|
|
|
|
|
if ($('#enable_ptz').is(":checked")) { |
|
|
enable_ptz_temp = "Yes"; |
|
|
document.getElementById("ptz_view").style.display = "block"; |
|
|
document.getElementById("radar_view").style.width = "50%"; |
|
|
document.getElementById("radar_settings").style.width = "25%"; |
|
|
document.getElementById("radar_settings2").style.width = "25%"; |
|
|
document.getElementById("ptz_setting_block").style.display = "block"; |
|
|
document.getElementById("ptz_setting_block2").style.display = "block"; |
|
|
document.getElementById("radar_settings0").style.display = "none"; |
|
|
} |
|
|
else { |
|
|
enable_ptz_temp = "No"; |
|
|
document.getElementById("ptz_view").style.display = "none"; |
|
|
document.getElementById("radar_view").style.width = "100%"; |
|
|
document.getElementById("radar_settings").style.width = "25%"; |
|
|
document.getElementById("radar_settings2").style.width = "25%"; |
|
|
document.getElementById("ptz_setting_block").style.display = "none"; |
|
|
document.getElementById("ptz_setting_block2").style.display = "none"; |
|
|
document.getElementById("radar_settings0").style.display = "block"; |
|
|
} |
|
|
|
|
|
if ($('#calibration_radar').is(":checked")) { |
|
|
enable_calibration_radar_temp = "Yes"; |
|
|
// mix_scale_radar_visible(); |
|
|
radar_circle.set({ 'evented': true ,'selectable': true}); |
|
|
circle_radar.set({ 'evented': true ,'selectable': true}); |
|
|
} |
|
|
else { |
|
|
enable_calibration_radar_temp = "No"; |
|
|
// mix_scale_radar_hidden(); |
|
|
radar_circle.set({ 'evented': false ,'selectable': false}); |
|
|
circle_radar.set({ 'evented': false ,'selectable': false}); |
|
|
} |
|
|
if ($('#enable_calibration_ptz').is(":checked")) { |
|
|
enable_calibration_ptz_temp = "Yes"; |
|
|
circle_ptz_visible(); |
|
|
} |
|
|
else { |
|
|
enable_calibration_ptz_temp = "No"; |
|
|
circle_ptz_hidden(); |
|
|
} |
|
|
if ($('#enable_ptz_tracking').is(":checked")) { |
|
|
enable_ptz_tracking_temp = "Yes"; |
|
|
} |
|
|
else { |
|
|
enable_ptz_tracking_temp = "No"; |
|
|
} |
|
|
if ($('#enable_ip_setting').is(":checked")) { |
|
|
enable_ip_setting_temp = "true"; |
|
|
localStorage.setItem("enable_ip_setting", "true"); |
|
|
|
|
|
// showPTZimage( |
|
|
// document.getElementById("camera_ip").value, // remoteIP |
|
|
// document.getElementById("camera_username").value, // account |
|
|
// document.getElementById("camera_password").value // password |
|
|
// ); |
|
|
|
|
|
canvasTripwire_radarPTZ, radarShowImgInterval = showRGBimage( |
|
|
canvasTripwire_radarPTZ, |
|
|
radarShowImgInterval, |
|
|
document.getElementById("camera_ip").value, // remoteIP |
|
|
document.getElementById("camera_username").value, // account |
|
|
document.getElementById("camera_password").value // password |
|
|
); |
|
|
} |
|
|
else { |
|
|
enable_ip_setting_temp = "false"; |
|
|
localStorage.setItem("enable_ip_setting", "false"); |
|
|
|
|
|
clearInterval(radarShowImgInterval); |
|
|
// clearInterval(g_getPtzImg); |
|
|
|
|
|
var cxt=document.getElementById("CanvasTripwire_radarPTZ").getContext("2d"); |
|
|
cxt.clearRect(0,0,canvasTripwire_radarPTZ.width,canvasTripwire_radarPTZ.height); |
|
|
} |
|
|
//trial life time |
|
|
json_trial_life_time = document.getElementById("trial_life_time").value; |
|
|
json_radar_section_degree = document.getElementById("radar_section_degree").value; |
|
|
func_setelement("calibration_camera", enable_calibration_ptz_temp); |
|
|
func_setelement("calibration_radar", enable_calibration_radar_temp); |
|
|
func_setelement("enable_camera", enable_ptz_temp); |
|
|
//kuan add |
|
|
func_setelement("trial_life_time", document.getElementById("trial_life_time").value); |
|
|
func_setelement("world_radar_height", document.getElementById("radar_height").value); |
|
|
func_setelement("distance_meter", document.getElementById("slider_distance").value); |
|
|
func_setelement("world_camera_height", document.getElementById("ptz_height").value); |
|
|
func_setelement("world_camera_degree", document.getElementById("ptz_degree").value); |
|
|
func_setelement("ip_setting", enable_ip_setting_temp); |
|
|
func_setelement("enable_camera_tracking", enable_ptz_tracking_temp); |
|
|
func_setelement("distance_format", document.getElementById("distance_format").value); |
|
|
func_setelement("radar_section_degree", document.getElementById("radar_section_degree").value); |
|
|
//ptz ip |
|
|
func_setelement("camera_ip", document.getElementById("camera_ip").value); |
|
|
func_setelement("camera_port", document.getElementById("camera_port").value); |
|
|
func_setelement("camera_username", document.getElementById("camera_username").value); |
|
|
func_setelement("camera_password", document.getElementById("camera_password").value); |
|
|
|
|
|
// a113n |
|
|
rescale_ruler(rulerRadar); |
|
|
|
|
|
console.log("makeProgress_setradar END"); |
|
|
//setradar end |
|
|
|
|
|
} |
|
|
else if (k_index == 100) { |
|
|
$(".progress-bar").css("visibility", "hidden"); |
|
|
//$(".progress-bar").css("width", "0%").text("0 %"); |
|
|
$(".progress-bar").css("width", "0%"); |
|
|
k_index = -1; |
|
|
|
|
|
|
|
|
} |
|
|
// Wait for sometime before running this script again |
|
|
setTimeout("makeProgress_setradar()", 200); |
|
|
} |
|
|
} |
|
|
|
|
|
// var k_index = -1; |
|
|
//checkbox |
|
|
function func_setradar_with_progress() { |
|
|
// makeProgress(); |
|
|
k_index = 0; |
|
|
makeProgress_setradar(); |
|
|
} |
|
|
|
|
|
//make progress setradar |
|
|
// $(".progress-bar").css("visibility", "hidden"); |
|
|
function makeProgress_setradar_default() { |
|
|
console.log("makeProgress_setradar_default",k_index); |
|
|
if (k_index < 100 && k_index >= 0) { |
|
|
k_index = k_index + 1; |
|
|
$(".progress-bar").css("visibility","visible"); |
|
|
//$(".progress-bar").css("width", k_index + "%").text(k_index + " %"); |
|
|
$(".progress-bar").css("width", k_index + "%"); |
|
|
|
|
|
if (k_index == 1) { |
|
|
|
|
|
k_index = 94; |
|
|
} |
|
|
else if (k_index == 95) { |
|
|
// waitSeconds(500); |
|
|
//setradar default start |
|
|
// func_setradar_default(400, 500, 400, 100, 10, 90); |
|
|
func_setradar_default(); |
|
|
//setradar default end |
|
|
|
|
|
} |
|
|
else if (k_index == 100) { |
|
|
$(".progress-bar").css("visibility", "hidden"); |
|
|
//$(".progress-bar").css("width", "0%").text("0 %"); |
|
|
$(".progress-bar").css("width", "0%"); |
|
|
k_index = -1; |
|
|
|
|
|
|
|
|
} |
|
|
// Wait for sometime before running this script again |
|
|
setTimeout("makeProgress_setradar_default()", 200); |
|
|
} |
|
|
} |
|
|
|
|
|
function func_setradar_default_with_progress() { |
|
|
// makeProgress(); |
|
|
k_index = 0; |
|
|
makeProgress_setradar_default(); |
|
|
} |
|
|
|
|
|
|
|
|
function sleep(milliseconds) { |
|
|
var start = new Date().getTime(); |
|
|
for (var i = 0; i < 1e7; i++) { |
|
|
if ((new Date().getTime() - start) > milliseconds) { |
|
|
break; |
|
|
} |
|
|
} |
|
|
} |
|
|
|
|
|
function func_setelement(name_, value_) { |
|
|
$.ajax({ |
|
|
url: "/setradarconfig?ch=1&" + name_ + "=" + value_, |
|
|
method: "GET", |
|
|
async: false, |
|
|
beforeSend: function (xmlHttp) { |
|
|
xmlHttp.setRequestHeader("If-Modified-Since", "0"); |
|
|
xmlHttp.setRequestHeader("Cache-Control", "no-cache"); |
|
|
//xmlHttp.setRequestHeader("Authorization", "Basic " + btoa("username:password")); |
|
|
}, |
|
|
success: function (res) { |
|
|
// console.info(res); |
|
|
}, |
|
|
error: function (err) { |
|
|
console.warn(err); |
|
|
} |
|
|
}); |
|
|
return false; |
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
var count_reload = 0; |
|
|
function func_getreload() { |
|
|
$.ajax({ |
|
|
url: "/getconfig?reload=1", |
|
|
method: "GET", |
|
|
async: false, |
|
|
beforeSend: function (xmlHttp) { |
|
|
xmlHttp.setRequestHeader("If-Modified-Since", "0"); |
|
|
xmlHttp.setRequestHeader("Cache-Control", "no-cache"); |
|
|
//xmlHttp.setRequestHeader("Authorization", "Basic " + btoa("username:password")); |
|
|
}, |
|
|
//data : JSON.stringify(data), |
|
|
success: function (retdata) { |
|
|
count_reload++; |
|
|
if (retdata === "Reload OK.") { |
|
|
count_reload = 0; |
|
|
//console.log("Reload OK."); |
|
|
} |
|
|
else { |
|
|
if (count_reload <= 3) { |
|
|
setTimeout(func_getreload(), 2000); |
|
|
} |
|
|
else { |
|
|
count_reload = 0; |
|
|
} |
|
|
} |
|
|
//console.info(); |
|
|
}, |
|
|
error: function () { |
|
|
console.warn(); |
|
|
} |
|
|
}); |
|
|
return false; |
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
mix_scale_radar_visible(); |
|
|
change_show_radar_button_color(); |
|
|
if (canvasTripwire_radarPTZ) { |
|
|
canvasTripwire_radarPTZ.renderAll(); |
|
|
} |
|
|
// 2022-12-29 Merge issue : repeatedly call this function |
|
|
canvasTripwire_radarPTZ, radarShowImgInterval = func_getRadarInfo("radar", canvasTripwire_radarPTZ, radarShowImgInterval); |
|
|
|
|
|
rescale_ruler(rulerRadar); |
|
|
|
|
|
radarGetRequest(); // remove redundant getValue() function |
|
|
|
|
|
|
|
|
// Radar_draw_Request(); |
|
|
var radarDrawPointInterval = null; |
|
|
func_drawRadarPoint(radarDrawPointInterval, canvasTripwire_radar, localStorage.getItem('current_page')); // reconstruct the Radar_draw_Request() |
|
|
|
|
|
localStorage.setItem('radar_success', 'OK'); |
|
|
console.log("localStorage.getItem('radar_success') : ", localStorage.getItem('radar_success')); |
|
|
|
|
|
|
|
|
</script> |
|
|
</body> |
|
|
|
|
|
</html> |
