|
|
var canvasTripwire; |
|
|
var canvasTripwire_all; |
|
|
var click_canvas_all = 0; |
|
|
var click_cold_set = 0; |
|
|
var canvasTripwire1; |
|
|
var canvasTripwire2; |
|
|
var canvasTripwire3; |
|
|
var canvasTripwire4; |
|
|
var canvasTripwire5; |
|
|
var canvasTripwire6; |
|
|
var canvasTripwire7; |
|
|
var canvasTripwire8; |
|
|
var canvasTripwire_default; |
|
|
var TripwireTrafficMode = 0;//0:Traffic Light,1:Tripwire |
|
|
var TrafficLineMode = 0;//0:Rect,1:Line |
|
|
var g_Ctrl_InfoTrafficLight = [];//0:index,1:left,2:top,3:width,4:height,5:direct,6:Traffic Light |
|
|
var MAX_SIZE_POINTS = 6; |
|
|
var MAX_DETECTION_ZONE = 8; |
|
|
|
|
|
var MAX_COLDOBJECTS = 8; |
|
|
|
|
|
var G_VIEW_CANVAS_X = 480; |
|
|
var G_VIEW_CANVAS_Y = 320; |
|
|
var G_CAM_VIDEO_RES_WIDTH = 1920; |
|
|
var G_CAM_VIDEO_RES_HEIGHT = 1080; |
|
|
var MAX_MOVE_RADIUS = 30; |
|
|
|
|
|
var MAX_HEIGHT = G_VIEW_CANVAS_Y; |
|
|
var MAX_WIDTH = G_VIEW_CANVAS_X; |
|
|
|
|
|
var g_check_cross = 0; |
|
|
|
|
|
var current_state_hide_or_open_label = 0; |
|
|
var current_state_hide_or_open_direction = 0; |
|
|
var current_state_hide_or_open_speed = 0; |
|
|
|
|
|
var currentPointPosition1 = new Array(MAX_SIZE_POINTS); |
|
|
var currentPointPosition2 = new Array(MAX_SIZE_POINTS); |
|
|
var currentPointPosition3 = new Array(MAX_SIZE_POINTS); |
|
|
var currentPointPosition4 = new Array(MAX_SIZE_POINTS); |
|
|
var currentPointPosition5 = new Array(MAX_SIZE_POINTS); |
|
|
var currentPointPosition6 = new Array(MAX_SIZE_POINTS); |
|
|
var currentPointPosition7 = new Array(MAX_SIZE_POINTS); |
|
|
var currentPointPosition8 = new Array(MAX_SIZE_POINTS); |
|
|
|
|
|
var coldobjects_X = new Array(MAX_COLDOBJECTS); |
|
|
var coldobjects_Y = new Array(MAX_COLDOBJECTS); |
|
|
var coldobjects_W = new Array(MAX_COLDOBJECTS); |
|
|
var coldobjects_H = new Array(MAX_COLDOBJECTS); |
|
|
var coldobjects_Object = new Array(MAX_COLDOBJECTS); |
|
|
var check_if_existing_coldobjects = 0; |
|
|
|
|
|
{ |
|
|
for (var i = 0; i < MAX_COLDOBJECTS; i++) { |
|
|
coldobjects_X[i] = 0; |
|
|
coldobjects_Y[i] = 0; |
|
|
coldobjects_W[i] = 0; |
|
|
coldobjects_H[i] = 0; |
|
|
coldobjects_Object[i] = ""; |
|
|
} |
|
|
} |
|
|
|
|
|
var counter_count_msg = ""; |
|
|
|
|
|
var different_index = 0; |
|
|
|
|
|
var g_drawing_canvas = |
|
|
{ |
|
|
bounding_left: -1, |
|
|
bounding_top: -1, |
|
|
down_x: -1, |
|
|
down_y: -1, |
|
|
move_x: -1, |
|
|
move_y: -1, |
|
|
draw_x: -1, |
|
|
draw_y: -1, |
|
|
draw_w: -1, |
|
|
draw_h: -1, |
|
|
direct: 1 |
|
|
}; |
|
|
|
|
|
var g_max_protected_objects = 0; |
|
|
|
|
|
//var data_alarm = ""; |
|
|
|
|
|
/** |
|
|
* @ Update Objects Info in g_Ctrl_InfoTrafficLight |
|
|
* |
|
|
* @ Input : |
|
|
* @ Return : |
|
|
*/ |
|
|
var reconnect_websocket = null; |
|
|
|
|
|
var request_live = null; |
|
|
function getalarmmotion_value() { |
|
|
|
|
|
var ipStr = '/getalarmmotion'; |
|
|
|
|
|
if (this.status == 404) { |
|
|
// request_live = setInterval(function () { |
|
|
/* |
|
|
if (navigator.userAgent.match("MSIE") || (!!window.ActiveXObject || "ActiveXObject" in window)) |
|
|
GetRequest_Http(); |
|
|
else*/ |
|
|
// GetRequest_WebSocket(); |
|
|
var replaceUrl = 'http://' + window.location.hostname + ':' + GetUrlPort() + '/Aida/heatmap.html'; |
|
|
//alert(replaceUrl); |
|
|
parent.window.location.replace(replaceUrl); |
|
|
//}, 5000); |
|
|
} |
|
|
else { |
|
|
/* |
|
|
if (navigator.userAgent.match("MSIE") || (!!window.ActiveXObject || "ActiveXObject" in window)) |
|
|
GetRequest_Http(); |
|
|
else*/ |
|
|
GetRequest_WebSocket(); |
|
|
} |
|
|
} |
|
|
|
|
|
var len_alarm = 0; |
|
|
var bbox_count = 0; |
|
|
var plate_count = 0; |
|
|
var plate_idx = 0; |
|
|
|
|
|
var complete_flag = 0; |
|
|
var content_len = 0; |
|
|
|
|
|
var wait_count = 0; |
|
|
|
|
|
var clear_count = 0; //sophia add 20201207 |
|
|
var clear_count_2 = 0; //檢查畫布畫久一點 |
|
|
|
|
|
var index_ = 0; |
|
|
|
|
|
//var points_list = ""; |
|
|
var linelengths_list = ""; |
|
|
var points_array = new Array(MAX_SIZE_POINTS); |
|
|
|
|
|
var g_zone_id = 0; |
|
|
var g_enable_show_pixel = 0; |
|
|
var g_enable_show_direction = 0; |
|
|
var g_mydirection = new Array(MAX_DETECTION_ZONE); |
|
|
|
|
|
{ |
|
|
for (var i = 0; i < MAX_DETECTION_ZONE; i++) { |
|
|
g_mydirection[i] = 1; |
|
|
} |
|
|
} |
|
|
|
|
|
function enable_show_direction() { |
|
|
g_enable_show_direction = 1; |
|
|
Edit_Arrow(); |
|
|
} |
|
|
|
|
|
function disable_show_direction() { |
|
|
g_enable_show_direction = 0; |
|
|
Edit_Arrow(); |
|
|
} |
|
|
|
|
|
function updateObjects() { |
|
|
g_Ctrl_InfoTrafficLight.length = 0; |
|
|
var j = 0; |
|
|
if (TripwireTrafficMode == 1) { |
|
|
g_Ctrl_InfoTrafficLight[j] = []; |
|
|
g_Ctrl_InfoTrafficLight[j][0] = j; |
|
|
g_Ctrl_InfoTrafficLight[j][1] = 50; |
|
|
g_Ctrl_InfoTrafficLight[j][2] = 50; |
|
|
g_Ctrl_InfoTrafficLight[j][3] = 30; |
|
|
g_Ctrl_InfoTrafficLight[j][4] = 30; |
|
|
g_Ctrl_InfoTrafficLight[j][5] = 1; |
|
|
g_Ctrl_InfoTrafficLight[j][6] = 1; |
|
|
j++; |
|
|
} |
|
|
for (var i = 0; i < canvasTripwire.getObjects().length; i++) { |
|
|
g_Ctrl_InfoTrafficLight[j] = []; |
|
|
g_Ctrl_InfoTrafficLight[j][0] = j; |
|
|
g_Ctrl_InfoTrafficLight[j][1] = canvasTripwire.item(i).left; |
|
|
g_Ctrl_InfoTrafficLight[j][2] = canvasTripwire.item(i).top; |
|
|
g_Ctrl_InfoTrafficLight[j][3] = canvasTripwire.item(i).width; |
|
|
g_Ctrl_InfoTrafficLight[j][4] = canvasTripwire.item(i).height; |
|
|
g_Ctrl_InfoTrafficLight[j][5] = canvasTripwire.item(i).direction; |
|
|
g_Ctrl_InfoTrafficLight[j][6] = canvasTripwire.item(i).trafficlight; |
|
|
j++; |
|
|
} |
|
|
} |
|
|
/** |
|
|
* @ create a rectangle object |
|
|
* |
|
|
* @ Input : |
|
|
* :1.r_left:left |
|
|
* :2.r_top:top |
|
|
* :3.r_width:width |
|
|
* :4.r_height:height |
|
|
* :5.r_direct:direction |
|
|
* :6.trafficlight:trafficlight |
|
|
* @ Return : rectangle object |
|
|
*/ |
|
|
function insertTrafficLightRectangle(r_left, r_top, r_width, r_height, r_direct, r_tlight, r_name, r_number_row) { |
|
|
var rectangle; |
|
|
|
|
|
var color_type = '#00FF00'; |
|
|
|
|
|
if (r_name != "object" && |
|
|
r_name != "L._Plate_USA" && |
|
|
r_name != "L._Plate_MAC/MYS" && |
|
|
r_name != "L._Plate_VNM" && |
|
|
r_name != "L._Plate_EUR" && |
|
|
r_name != "L._Plate_GBR" && |
|
|
r_name != "L._Plate_JPN" && |
|
|
r_name != "L._Plate_THA" && |
|
|
r_name != "L._Plate_IDN" && |
|
|
r_name != "L._Plate_IDN2" && |
|
|
r_name != "L._Plate_BGD" && |
|
|
r_name != "L._Plate_MEA" && |
|
|
r_name != "L._Plate_PHL" && |
|
|
r_name != "L._Plate_AUS" && |
|
|
r_name != "L._Plate_CNT_1LINE" && |
|
|
r_name != "L._Plate_CNT_2LINES" && |
|
|
r_name != "L._Plate_CNT_3LINES" && |
|
|
r_name != "L._Plate_CNT_VERTICAL" && |
|
|
r_name != "L._Plate_CNT_USDOT" && |
|
|
r_name != "ambulance" && |
|
|
r_name != "face" && |
|
|
r_name != "blank" && |
|
|
r_name != "stop_sign" && |
|
|
r_name != "qrcode" && |
|
|
r_name != "barcode" && |
|
|
r_name != "L._Plate_TWN" && |
|
|
r_name != "") { |
|
|
if (r_name == "person") { |
|
|
color_type = '#FF8C00'; |
|
|
} |
|
|
else { |
|
|
color_type = '#800080'; |
|
|
} |
|
|
} |
|
|
else if (r_number_row == 2) { |
|
|
color_type = '#FFFF00'; |
|
|
} |
|
|
|
|
|
if ((r_left != null) && (r_top != null) && (r_width != null) && (r_height != null)) { |
|
|
|
|
|
if (click_canvas_all >= 1 && click_cold_set >= 1) { |
|
|
} |
|
|
else { |
|
|
if (r_name != "object" && |
|
|
r_name != "L._Plate_USA" && |
|
|
r_name != "L._Plate_MAC/MYS" && |
|
|
r_name != "L._Plate_VNM" && |
|
|
r_name != "L._Plate_EUR" && |
|
|
r_name != "L._Plate_GBR" && |
|
|
r_name != "L._Plate_JPN" && |
|
|
r_name != "L._Plate_THA" && |
|
|
r_name != "L._Plate_IDN" && |
|
|
r_name != "L._Plate_IDN2" && |
|
|
r_name != "L._Plate_BGD" && |
|
|
r_name != "L._Plate_MEA" && |
|
|
r_name != "L._Plate_PHL" && |
|
|
r_name != "L._Plate_AUS" && |
|
|
r_name != "L._Plate_CNT_1LINE" && |
|
|
r_name != "L._Plate_CNT_2LINES" && |
|
|
r_name != "L._Plate_CNT_3LINES" && |
|
|
r_name != "L._Plate_CNT_VERTICAL" && |
|
|
r_name != "L._Plate_CNT_USDOT" && |
|
|
r_name != "ambulance" && |
|
|
r_name != "face" && |
|
|
r_name != "blank" && |
|
|
r_name != "stop_sign" && |
|
|
r_name != "qrcode" && |
|
|
r_name != "barcode" && |
|
|
r_name != "L._Plate_TWN" && |
|
|
r_name != "") { |
|
|
|
|
|
var temp_width = r_width; |
|
|
var temp_height = r_height; |
|
|
r_width = r_width * 1.095; |
|
|
r_height = r_height * 1.095; |
|
|
r_left = r_left - (r_width - temp_width) / 2; |
|
|
r_top = r_top - (r_height - temp_height) / 2; |
|
|
} |
|
|
} |
|
|
|
|
|
rectangle = new fabric.Rect({ objectCaching: false, trafficlight: r_tlight, direction: r_direct, left: r_left, top: r_top, stroke: color_type, strokeWidth: 1.5, fill: 'transparent', width: r_width, height: r_height, opacity: 1, hasRotatingPoint: false, transparentCorners: false, cornerStyle: 'circle', cornerSize: 10, cornerColor: '#BDB76B' }); |
|
|
|
|
|
} |
|
|
else { |
|
|
rectangle = new fabric.Rect({ objectCaching: false, trafficlight: 1, direction: 1, left: 50, top: 50, stroke: color_type, strokeWidth: 1.5, fill: 'transparent', width: 30, height: 30, opacity: 1, hasRotatingPoint: false, transparentCorners: false, cornerStyle: 'circle', cornerSize: 10, cornerColor: '#BDB76B' }); |
|
|
} |
|
|
|
|
|
rectangle.setControlsVisibility({ |
|
|
bl: true, |
|
|
br: true, |
|
|
tl: true, |
|
|
tr: true, |
|
|
mt: true, |
|
|
mb: true, |
|
|
ml: true, |
|
|
mr: true, |
|
|
}); |
|
|
|
|
|
if (r_name.length >= 1 && click_canvas_all >= 1 && click_cold_set >= 1) { |
|
|
rectangle.on('selected', function (e) { |
|
|
var selected_left = r_left * G_CAM_VIDEO_RES_WIDTH / MAX_WIDTH-20; |
|
|
var selected_top = r_top * G_CAM_VIDEO_RES_HEIGHT / MAX_HEIGHT-20; |
|
|
var selected_width = r_width * G_CAM_VIDEO_RES_WIDTH / MAX_WIDTH+40; |
|
|
var selected_height = r_height * G_CAM_VIDEO_RES_HEIGHT / MAX_HEIGHT+40; |
|
|
|
|
|
if (selected_left < 10) |
|
|
selected_left = 10; |
|
|
if (selected_top < 10) |
|
|
selected_top = 10; |
|
|
if (selected_width > G_CAM_VIDEO_RES_WIDTH - 20) |
|
|
selected_width = G_CAM_VIDEO_RES_WIDTH - 20; |
|
|
if (selected_height > G_CAM_VIDEO_RES_HEIGHT - 20) |
|
|
selected_height = G_CAM_VIDEO_RES_HEIGHT - 20; |
|
|
|
|
|
func_set_coldobjects(selected_left, selected_top, selected_width, selected_height, r_name); |
|
|
}) |
|
|
} |
|
|
|
|
|
if (click_canvas_all >= 1 && click_cold_set >= 1) { |
|
|
//disabelIteraction(rectangle); |
|
|
} |
|
|
else { |
|
|
disabelIteraction(rectangle); |
|
|
} |
|
|
|
|
|
return rectangle; |
|
|
} |
|
|
|
|
|
function insertTrafficLightRectangle_Red(r_left, r_top, r_width, r_height, r_direct, r_tlight, r_name) { |
|
|
var rectangle2; |
|
|
if ((r_left != null) && (r_top != null) && (r_width != null) && (r_height != null)) { |
|
|
|
|
|
if (click_canvas_all >= 1 && click_cold_set >= 1) { |
|
|
} |
|
|
else { |
|
|
if (r_name != "object" && |
|
|
r_name != "L._Plate_USA" && |
|
|
r_name != "L._Plate_MAC/MYS" && |
|
|
r_name != "L._Plate_VNM" && |
|
|
r_name != "L._Plate_EUR" && |
|
|
r_name != "L._Plate_GBR" && |
|
|
r_name != "L._Plate_JPN" && |
|
|
r_name != "L._Plate_THA" && |
|
|
r_name != "L._Plate_IDN" && |
|
|
r_name != "L._Plate_IDN2" && |
|
|
r_name != "L._Plate_BGD" && |
|
|
r_name != "L._Plate_MEA" && |
|
|
r_name != "L._Plate_PHL" && |
|
|
r_name != "L._Plate_AUS" && |
|
|
r_name != "L._Plate_CNT_1LINE" && |
|
|
r_name != "L._Plate_CNT_2LINES" && |
|
|
r_name != "L._Plate_CNT_3LINES" && |
|
|
r_name != "L._Plate_CNT_VERTICAL" && |
|
|
r_name != "L._Plate_CNT_USDOT" && |
|
|
r_name != "ambulance" && |
|
|
r_name != "face" && |
|
|
r_name != "blank" && |
|
|
r_name != "stop_sign" && |
|
|
r_name != "qrcode" && |
|
|
r_name != "barcode" && |
|
|
r_name != "L._Plate_TWN" && |
|
|
r_name != "") { |
|
|
|
|
|
var temp_width = r_width; |
|
|
var temp_height = r_height; |
|
|
r_width = r_width * 1.095; |
|
|
r_height = r_height * 1.095; |
|
|
r_left = r_left - (r_width - temp_width) / 2; |
|
|
r_top = r_top - (r_height - temp_height) / 2; |
|
|
} |
|
|
} |
|
|
|
|
|
rectangle2 = new fabric.Rect({ objectCaching: false,trafficlight: r_tlight, direction: r_direct, left: r_left, top: r_top, stroke: '#FF0000', strokeWidth: 1.5, fill: 'transparent', width: r_width, height: r_height, opacity: 1, hasRotatingPoint: false, transparentCorners: false, cornerStyle: 'circle', cornerSize: 10, cornerColor: '#BDB76B' }); |
|
|
|
|
|
} |
|
|
else { |
|
|
rectangle2 = new fabric.Rect({ objectCaching: false,trafficlight: 1, direction: 1, left: 50, top: 50, stroke: '#FF0000', strokeWidth: 1.5, fill: 'transparent', width: 30, height: 30, opacity: 1, hasRotatingPoint: false, transparentCorners: false, cornerStyle: 'circle', cornerSize: 10, cornerColor: '#BDB76B' }); |
|
|
} |
|
|
|
|
|
rectangle2.setControlsVisibility({ |
|
|
bl: true, |
|
|
br: true, |
|
|
tl: true, |
|
|
tr: true, |
|
|
mt: true, |
|
|
mb: true, |
|
|
ml: true, |
|
|
mr: true, |
|
|
}); |
|
|
|
|
|
if (r_name.length >= 1 && click_canvas_all >= 1 && click_cold_set >= 1) { |
|
|
rectangle2.on('selected', function (e) { |
|
|
var selected_left = r_left * G_CAM_VIDEO_RES_WIDTH / MAX_WIDTH; |
|
|
var selected_top = r_top * G_CAM_VIDEO_RES_HEIGHT / MAX_HEIGHT; |
|
|
var selected_width = r_width * G_CAM_VIDEO_RES_WIDTH / MAX_WIDTH; |
|
|
var selected_height = r_height * G_CAM_VIDEO_RES_HEIGHT / MAX_HEIGHT; |
|
|
|
|
|
func_set_coldobjects(selected_left, selected_top, selected_width, selected_height, r_name); |
|
|
}) |
|
|
} |
|
|
|
|
|
if (click_canvas_all >= 1 && click_cold_set >= 1) { |
|
|
//disabelIteraction(rectangle2); |
|
|
} |
|
|
else { |
|
|
disabelIteraction(rectangle2); |
|
|
} |
|
|
|
|
|
return rectangle2; |
|
|
} |
|
|
|
|
|
function insertTrafficLightRectangle_Blue(r_left, r_top, r_width, r_height, r_direct, r_tlight) { |
|
|
var rectangle3; |
|
|
if ((r_left != null) && (r_top != null) && (r_width != null) && (r_height != null)) { |
|
|
rectangle3 = new fabric.Rect({ objectCaching: false, trafficlight: r_tlight, direction: r_direct, left: r_left, top: r_top, stroke: '#0000ff', strokeWidth: 1.5, fill: 'transparent', width: r_width, height: r_height, opacity: 1, hasRotatingPoint: false, transparentCorners: false, cornerStyle: 'circle', cornerSize: 10, cornerColor: '#BDB76B' }); |
|
|
|
|
|
} |
|
|
else { |
|
|
rectangle3 = new fabric.Rect({ objectCaching: false, trafficlight: 1, direction: 1, left: 50, top: 50, stroke: '#0000ff', strokeWidth: 1.5, fill: 'transparent', width: 30, height: 30, opacity: 1, hasRotatingPoint: false, transparentCorners: false, cornerStyle: 'circle', cornerSize: 10, cornerColor: '#BDB76B' }); |
|
|
} |
|
|
|
|
|
rectangle3.setControlsVisibility({ |
|
|
bl: true, |
|
|
br: true, |
|
|
tl: true, |
|
|
tr: true, |
|
|
mt: true, |
|
|
mb: true, |
|
|
ml: true, |
|
|
mr: true, |
|
|
}); |
|
|
|
|
|
disabelIteraction(rectangle3); |
|
|
|
|
|
return rectangle3; |
|
|
} |
|
|
|
|
|
/** |
|
|
* @ create a text object |
|
|
* |
|
|
* @ Input : |
|
|
* :1.r_left:left |
|
|
* :2.r_top:top |
|
|
* :3.r_width:width |
|
|
* :4.r_height:height |
|
|
* :5.r_direct:direction |
|
|
* :6.trafficlight:trafficlight |
|
|
* @ Return : text object |
|
|
*/ |
|
|
function insertTextLabel(r_left, r_top, r_width, r_height, showtext) { |
|
|
var textcontent; |
|
|
if ((r_left != null) && (r_top != null) && (r_width != null) && (r_height != null)) { |
|
|
textcontent = new fabric.Text(showtext, { |
|
|
objectCaching: false, |
|
|
left: r_left, |
|
|
top: r_top, |
|
|
width: r_width, |
|
|
height: r_height, |
|
|
fontFamily: 'helvetica', // 字型 |
|
|
fontSize: 15, // 字体大小 |
|
|
fontWeight: '', // 字体粗细 |
|
|
shadow: { color: 'black' ,blur: 5}, |
|
|
fill: '#CCFF33' |
|
|
}); |
|
|
|
|
|
} |
|
|
else { |
|
|
textcontent = new fabric.Text(showtext, { |
|
|
objectCaching: false, |
|
|
left: 50, |
|
|
top: 50, |
|
|
width: 50, |
|
|
height: 50, |
|
|
fontFamily: 'helvetica', // 字型 |
|
|
fontSize: 15, // 字体大小 |
|
|
fontWeight: '', // 字体粗细 |
|
|
shadow: { color: 'black', blur: 5 }, |
|
|
fill: '#CCFF33' |
|
|
}); |
|
|
} |
|
|
//const text = new fabric.Text('Day 7 fabricjs') |
|
|
//canvas.add(text) |
|
|
/* |
|
|
{ |
|
|
trafficlight: 1, |
|
|
direction:1, |
|
|
left: 50, |
|
|
top: 50, |
|
|
stroke: '#00FF00', |
|
|
strokeWidth: 1.5, |
|
|
fill: 'transparent', |
|
|
width: 30, |
|
|
height: 30, |
|
|
opacity: 1, |
|
|
hasRotatingPoint: false, |
|
|
transparentCorners: false, |
|
|
cornerStyle: 'circle', |
|
|
cornerSize: 10, |
|
|
cornerColor: '#BDB76B' |
|
|
} |
|
|
*/ |
|
|
textcontent.setControlsVisibility({ |
|
|
bl: true, |
|
|
br: true, |
|
|
tl: true, |
|
|
tr: true, |
|
|
mt: true, |
|
|
mb: true, |
|
|
ml: true, |
|
|
mr: true, |
|
|
}); |
|
|
|
|
|
disabelIteraction(textcontent); |
|
|
|
|
|
return textcontent; |
|
|
} |
|
|
|
|
|
function insertTextLabel_Orange(r_left, r_top, r_width, r_height, showtext) { |
|
|
var textcontent; |
|
|
if ((r_left != null) && (r_top != null) && (r_width != null) && (r_height != null)) { |
|
|
textcontent = new fabric.Text(showtext, { |
|
|
objectCaching: false, |
|
|
left: r_left, |
|
|
top: r_top, |
|
|
width: r_width, |
|
|
height: r_height, |
|
|
fontFamily: 'helvetica', // 字型 |
|
|
fontSize: 22, // 字体大小 |
|
|
fontWeight: '900', // 字体粗细 |
|
|
shadow: { color: 'black', blur: 5 }, |
|
|
fill: '#ff8c00' |
|
|
}); |
|
|
|
|
|
} |
|
|
else { |
|
|
textcontent = new fabric.Text(showtext, { |
|
|
objectCaching: false, |
|
|
left: 50, |
|
|
top: 50, |
|
|
width: 50, |
|
|
height: 50, |
|
|
fontFamily: 'helvetica', // 字型 |
|
|
fontSize: 22, // 字体大小 |
|
|
fontWeight: '900', // 字体粗细 |
|
|
shadow: { color: 'black', blur: 5 }, |
|
|
fill: '#ff8c00' |
|
|
}); |
|
|
} |
|
|
//const text = new fabric.Text('Day 7 fabricjs') |
|
|
//canvas.add(text) |
|
|
/* |
|
|
{ |
|
|
trafficlight: 1, |
|
|
direction:1, |
|
|
left: 50, |
|
|
top: 50, |
|
|
stroke: '#00FF00', |
|
|
strokeWidth: 1.5, |
|
|
fill: 'transparent', |
|
|
width: 30, |
|
|
height: 30, |
|
|
opacity: 1, |
|
|
hasRotatingPoint: false, |
|
|
transparentCorners: false, |
|
|
cornerStyle: 'circle', |
|
|
cornerSize: 10, |
|
|
cornerColor: '#BDB76B' |
|
|
} |
|
|
*/ |
|
|
textcontent.setControlsVisibility({ |
|
|
bl: true, |
|
|
br: true, |
|
|
tl: true, |
|
|
tr: true, |
|
|
mt: true, |
|
|
mb: true, |
|
|
ml: true, |
|
|
mr: true, |
|
|
}); |
|
|
|
|
|
disabelIteraction(textcontent); |
|
|
|
|
|
return textcontent; |
|
|
} |
|
|
|
|
|
function insertTextLabel_Red(r_left, r_top, r_width, r_height, showtext) { |
|
|
var textcontent; |
|
|
if ((r_left != null) && (r_top != null) && (r_width != null) && (r_height != null)) { |
|
|
textcontent = new fabric.Text(showtext, { |
|
|
objectCaching: false, |
|
|
left: r_left, |
|
|
top: r_top, |
|
|
width: r_width, |
|
|
height: r_height, |
|
|
fontFamily: 'helvetica', // 字型 |
|
|
fontSize: 15, // 字体大小 |
|
|
fontWeight: '', // 字体粗细 |
|
|
shadow: { color: 'black', blur: 5 }, |
|
|
fill: '#ff0000' |
|
|
}); |
|
|
|
|
|
} |
|
|
else { |
|
|
textcontent = new fabric.Text(showtext, { |
|
|
objectCaching: false, |
|
|
left: 50, |
|
|
top: 50, |
|
|
width: 50, |
|
|
height: 50, |
|
|
fontFamily: 'helvetica', // 字型 |
|
|
fontSize: 15, // 字体大小 |
|
|
fontWeight: '', // 字体粗细 |
|
|
shadow: { color: 'black', blur: 5 }, |
|
|
fill: '#ff0000' |
|
|
}); |
|
|
} |
|
|
//const text = new fabric.Text('Day 7 fabricjs') |
|
|
//canvas.add(text) |
|
|
/* |
|
|
{ |
|
|
trafficlight: 1, |
|
|
direction:1, |
|
|
left: 50, |
|
|
top: 50, |
|
|
stroke: '#00FF00', |
|
|
strokeWidth: 1.5, |
|
|
fill: 'transparent', |
|
|
width: 30, |
|
|
height: 30, |
|
|
opacity: 1, |
|
|
hasRotatingPoint: false, |
|
|
transparentCorners: false, |
|
|
cornerStyle: 'circle', |
|
|
cornerSize: 10, |
|
|
cornerColor: '#BDB76B' |
|
|
} |
|
|
*/ |
|
|
textcontent.setControlsVisibility({ |
|
|
bl: true, |
|
|
br: true, |
|
|
tl: true, |
|
|
tr: true, |
|
|
mt: true, |
|
|
mb: true, |
|
|
ml: true, |
|
|
mr: true, |
|
|
}); |
|
|
|
|
|
disabelIteraction(textcontent); |
|
|
|
|
|
return textcontent; |
|
|
} |
|
|
|
|
|
function insertTextLabel_Blue(r_left, r_top, r_width, r_height, showtext) { |
|
|
var textcontent; |
|
|
if ((r_left != null) && (r_top != null) && (r_width != null) && (r_height != null)) { |
|
|
textcontent = new fabric.Text(showtext, { |
|
|
objectCaching: false, |
|
|
left: r_left, |
|
|
top: r_top, |
|
|
width: r_width, |
|
|
height: r_height, |
|
|
fontFamily: 'helvetica', // 字型 |
|
|
fontSize: 12, // 字体大小 |
|
|
fontWeight: '', // 字体粗细 |
|
|
shadow: { color: 'black', blur: 5 }, |
|
|
fill: '#0000ff' |
|
|
}); |
|
|
|
|
|
} |
|
|
else { |
|
|
textcontent = new fabric.Text(showtext, { |
|
|
objectCaching: false, |
|
|
left: 50, |
|
|
top: 50, |
|
|
width: 50, |
|
|
height: 50, |
|
|
fontFamily: 'helvetica', // 字型 |
|
|
fontSize: 12, // 字体大小 |
|
|
fontWeight: '', // 字体粗细 |
|
|
shadow: { color: 'black', blur: 5 }, |
|
|
fill: '#0000ff' |
|
|
}); |
|
|
} |
|
|
//const text = new fabric.Text('Day 7 fabricjs') |
|
|
//canvas.add(text) |
|
|
/* |
|
|
{ |
|
|
trafficlight: 1, |
|
|
direction:1, |
|
|
left: 50, |
|
|
top: 50, |
|
|
stroke: '#00FF00', |
|
|
strokeWidth: 1.5, |
|
|
fill: 'transparent', |
|
|
width: 30, |
|
|
height: 30, |
|
|
opacity: 1, |
|
|
hasRotatingPoint: false, |
|
|
transparentCorners: false, |
|
|
cornerStyle: 'circle', |
|
|
cornerSize: 10, |
|
|
cornerColor: '#BDB76B' |
|
|
} |
|
|
*/ |
|
|
textcontent.setControlsVisibility({ |
|
|
bl: true, |
|
|
br: true, |
|
|
tl: true, |
|
|
tr: true, |
|
|
mt: true, |
|
|
mb: true, |
|
|
ml: true, |
|
|
mr: true, |
|
|
}); |
|
|
|
|
|
disabelIteraction(textcontent); |
|
|
|
|
|
return textcontent; |
|
|
} |
|
|
|
|
|
//20201204 sophia add |
|
|
function disabelIteraction(element) { |
|
|
//https://github.com/fabricjs/fabric.js/wiki/Preventing-object-modification |
|
|
element.lockMovementX = true; //Prevents horizontal movement |
|
|
element.lockMovementY = true; //Prevents vertical movement |
|
|
element.lockScalingX = true; //Prevents horizontal scaling |
|
|
element.lockScalingY = true; //Prevents vertical scaling |
|
|
element.lockUniScaling = true; //Prevents scaling in either X or Y direction but not in both. In other words, prevents non-proportional scaling of an object. |
|
|
element.lockRotation = true; //Prevents rotation |
|
|
element.selectable = false; |
|
|
element.evented = false; |
|
|
} |
|
|
|
|
|
function enableIteraction(element) { |
|
|
element.lockScalingX = false; //Prevents horizontal scaling |
|
|
element.lockScalingY = false; //Prevents vertical scaling |
|
|
element.lockUniScaling = false; //Prevents scaling in either X or Y direction but not in both. In other words, prevents non-proportional scaling of an object. |
|
|
element.lockRotation = false; //Prevents rotation |
|
|
element.evented = true; |
|
|
element.selectable = true; |
|
|
} |
|
|
/** |
|
|
* @ create a line object |
|
|
* |
|
|
* @ Input : |
|
|
* :1.coords:coordinate |
|
|
* :2.r_direct:direction |
|
|
* @ Return : line object |
|
|
*/ |
|
|
function TrafficLine(coords, r_direct) { |
|
|
return new fabric.Line(coords, { |
|
|
fill: 'transparent', |
|
|
stroke: '#00FF00', |
|
|
selectable: true, |
|
|
hasRotatingPoint: false, |
|
|
strokeWidth: 1.5, opacity: 1, transparentCorners: false, cornerStyle: 'circle', cornerSize: 10, cornerColor: '#BDB76B', direction: r_direct, trafficlight: 0 |
|
|
}); |
|
|
} |
|
|
|
|
|
function cal_slope(p1_x,p1_y,p2_x,p2_y) { |
|
|
return p1_y != p2_y ? (p1_x - p2_x) / (p1_y - p2_y) * (-1) : 99; |
|
|
} |
|
|
|
|
|
function angle(cx, cy, ex, ey) { |
|
|
var dy = ey - cy; |
|
|
var dx = ex - cx; |
|
|
var theta = Math.atan2(dy, dx); // range (-PI, PI] |
|
|
theta *= 180 / Math.PI; // rads to degs, range (-180, 180] |
|
|
if (theta < 0) theta = 360 + theta; // range [0, 360) |
|
|
return theta; |
|
|
} |
|
|
|
|
|
|
|
|
function AddArrowObject(p1x,p1y,p2x,p2y) { |
|
|
var start_x = p1x; |
|
|
var start_y = p1y; |
|
|
var end_x = p2x; |
|
|
var end_y = p2y; |
|
|
var angle_temp = angle(start_x, start_y, end_x, end_y); |
|
|
var left_temp = Math.abs(start_x + end_x) / 2; |
|
|
var top_temp = Math.abs(start_y + end_y) / 2; |
|
|
|
|
|
var strokeWidth_line = 5; |
|
|
var line = new fabric.Line([start_x, start_y, end_x, end_y], { |
|
|
strokeWidth: strokeWidth_line, |
|
|
fill: 'red', |
|
|
stroke: 'red', |
|
|
originX: 'center', |
|
|
originY: 'center' |
|
|
}); |
|
|
|
|
|
var triangle = new fabric.Triangle({ |
|
|
width: 20, height: 20, |
|
|
left: left_temp, |
|
|
top: top_temp, fill: 'red', |
|
|
angle: angle_temp, |
|
|
originX: 'center', |
|
|
originY: 'center' |
|
|
}); |
|
|
|
|
|
var arrow_temp = [line, triangle]; |
|
|
var arrow = new fabric.Group(arrow_temp); |
|
|
|
|
|
arrow.left = (start_x < end_x ? start_x : end_x) - strokeWidth_line / 2; |
|
|
arrow.top = (start_y < end_y ? start_y : end_y) - strokeWidth_line / 2; |
|
|
arrow.angle = 0; |
|
|
|
|
|
if (g_enable_show_direction === 0) { |
|
|
arrow.visible = false; |
|
|
} |
|
|
else { |
|
|
arrow.visible = true; |
|
|
} |
|
|
|
|
|
disabelIteraction(arrow); |
|
|
return arrow; |
|
|
} |
|
|
|
|
|
|
|
|
var polygon_zone1; |
|
|
var polygon_zone2; |
|
|
var polygon_zone3; |
|
|
var polygon_zone4; |
|
|
var polygon_zone5; |
|
|
var polygon_zone6; |
|
|
var polygon_zone7; |
|
|
var polygon_zone8; |
|
|
|
|
|
function createCanvasTrafficLight_heatmap() { |
|
|
|
|
|
canvasTripwire1 = new fabric.Canvas('CanvasTripwire1', { |
|
|
height: G_VIEW_CANVAS_Y,//window.innerHeight |
|
|
width: G_VIEW_CANVAS_X//window.innerWidth |
|
|
}); |
|
|
|
|
|
} |
|
|
|
|
|
function GetPointLocation(zone_id) { |
|
|
if (zone_id === 0) |
|
|
return currentPointPosition1; |
|
|
else if (zone_id === 1) |
|
|
return currentPointPosition2; |
|
|
else if (zone_id === 2) |
|
|
return currentPointPosition3; |
|
|
else if (zone_id === 3) |
|
|
return currentPointPosition4; |
|
|
else if (zone_id === 4) |
|
|
return currentPointPosition5; |
|
|
else if (zone_id === 5) |
|
|
return currentPointPosition6; |
|
|
else if (zone_id === 6) |
|
|
return currentPointPosition7; |
|
|
else if (zone_id === 7) |
|
|
return currentPointPosition8; |
|
|
} |
|
|
|
|
|
function polygonPositionHandler(dim, finalMatrix, fabricObject) { |
|
|
var x = (fabricObject.points[this.pointIndex].x - fabricObject.pathOffset.x), |
|
|
y = (fabricObject.points[this.pointIndex].y - fabricObject.pathOffset.y); |
|
|
return fabric.util.transformPoint( |
|
|
{ x: x, y: y }, |
|
|
fabric.util.multiplyTransformMatrices( |
|
|
fabricObject.canvas.viewportTransform, |
|
|
fabricObject.calcTransformMatrix() |
|
|
) |
|
|
); |
|
|
} |
|
|
|
|
|
function isPointInLine(point, point2, linePoint1, linePoint2) { |
|
|
|
|
|
//判斷兩條線是否平行或者共線 |
|
|
|
|
|
var denominator = (point.y - point2.y) * (linePoint1.x - linePoint2.x) - (point2.x - point.x) * (linePoint2.y - linePoint1.y); |
|
|
|
|
|
if (denominator == 0) |
|
|
|
|
|
return false; |
|
|
|
|
|
//獲取兩條線延伸後的交點座標 |
|
|
|
|
|
var x = ((point.x - point2.x) * (linePoint1.x - linePoint2.x) * (linePoint2.y - point2.y) + |
|
|
|
|
|
(point.y - point2.y) * (linePoint1.x - linePoint2.x) * point2.x - (linePoint1.y - linePoint2.y) * (point.x - point2.x) * linePoint2.x) / denominator; |
|
|
|
|
|
var y = -((point.y - point2.y) * (linePoint1.y - linePoint2.y) * (linePoint2.x - point2.x) + |
|
|
|
|
|
(point.x - point2.x) * (linePoint1.y - linePoint2.y) * point2.y - (linePoint1.x - linePoint2.x) * (point.y - point2.y) * linePoint2.y) / denominator; |
|
|
|
|
|
//判斷交點是否線上段上 |
|
|
|
|
|
if ((x - point2.x) * (x - point.x) <= 0 && (y - point2.y) * (y - point.y) <= 0 && (x - linePoint2.x) * (x - linePoint1.x) <= 0 && (y - linePoint2.y) * (y - linePoint1.y) <= 0) |
|
|
return true; |
|
|
return false; |
|
|
|
|
|
} |
|
|
|
|
|
// define a function that will define what the control does |
|
|
// this function will be called on every mouse move after a control has been |
|
|
// clicked and is being dragged. |
|
|
// The function receive as argument the mouse event, the current trasnform object |
|
|
// and the current position in canvas coordinate |
|
|
// transform.target is a reference to the current object being transformed, |
|
|
function func_actionHandler(eventData, transform, x, y) { |
|
|
var polygon = transform.target, |
|
|
currentControl = polygon.controls[polygon.__corner], |
|
|
mouseLocalPosition = polygon.toLocalPoint(new fabric.Point(x, y), 'center', 'center'), |
|
|
polygonBaseSize = polygon._getNonTransformedDimensions(), |
|
|
size = polygon._getTransformedDimensions( 0, 0), |
|
|
finalPointPosition = { |
|
|
x: Math.round(mouseLocalPosition.x * polygonBaseSize.x / size.x + polygon.pathOffset.x), |
|
|
y: Math.round(mouseLocalPosition.y * polygonBaseSize.y / size.y + polygon.pathOffset.y) |
|
|
}; |
|
|
|
|
|
var check_cross = 0; |
|
|
var check_move = 0; |
|
|
|
|
|
var max_size_of_points = g_enable_show_direction == 1 ? 4 : 6; |
|
|
|
|
|
var current_point_index = currentControl.pointIndex; |
|
|
var next_point_index = currentControl.pointIndex + 1 < max_size_of_points ? currentControl.pointIndex + 1 : 0; |
|
|
var last_point_index = currentControl.pointIndex - 1 >= 0 ? currentControl.pointIndex - 1 : max_size_of_points - 1; |
|
|
|
|
|
for (var i = 0; i < max_size_of_points; i++) { |
|
|
var current_index = i; |
|
|
var next_index = i + 1 < max_size_of_points ? i + 1 : 0; |
|
|
if (current_index != current_point_index && current_index != next_point_index && next_index != current_point_index && next_index != next_point_index) { |
|
|
if (isPointInLine(finalPointPosition, polygon.points[next_point_index], polygon.points[current_index], polygon.points[next_index])) { |
|
|
check_cross = 1; |
|
|
} |
|
|
if (isPointInLine(finalPointPosition, polygon.points[current_point_index], polygon.points[current_index], polygon.points[next_index])) { |
|
|
check_cross = 1; |
|
|
} |
|
|
} |
|
|
} |
|
|
for (var i = 0; i < max_size_of_points; i++) { |
|
|
var current_index = i; |
|
|
var last_index = i - 1 >= 0 ? i - 1 : max_size_of_points-1; |
|
|
if (current_index != current_point_index && current_index != last_point_index && last_index != current_point_index && last_index != last_point_index) { |
|
|
if (isPointInLine(finalPointPosition, polygon.points[last_point_index], polygon.points[current_index], polygon.points[last_index])) { |
|
|
check_cross = 1; |
|
|
} |
|
|
if (isPointInLine(finalPointPosition, polygon.points[current_point_index], polygon.points[current_index], polygon.points[last_index])) { |
|
|
check_cross = 1; |
|
|
} |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
if (Math.sqrt(Math.pow(finalPointPosition.x - polygon.points[current_point_index].x, 2) + Math.pow(finalPointPosition.y - polygon.points[current_point_index].y, 2)) >= MAX_MOVE_RADIUS) { |
|
|
check_move = 1; |
|
|
} |
|
|
//console.log("polygon.pathOffset.x:" + polygon.pathOffset.x + "; polygon.pathOffset.y:" + polygon.pathOffset.y); |
|
|
|
|
|
if (check_cross == 0 && check_move == 0) { |
|
|
if (finalPointPosition.x < 10) { |
|
|
finalPointPosition.x = 10; |
|
|
} |
|
|
|
|
|
if (finalPointPosition.x > MAX_WIDTH - 10) { |
|
|
finalPointPosition.x = MAX_WIDTH - 10; |
|
|
} |
|
|
|
|
|
if (finalPointPosition.y < 10) { |
|
|
finalPointPosition.y = 10; |
|
|
} |
|
|
|
|
|
if (finalPointPosition.y > MAX_HEIGHT - 10) { |
|
|
finalPointPosition.y = MAX_HEIGHT - 10; |
|
|
} |
|
|
polygon.points[currentControl.pointIndex] = finalPointPosition; |
|
|
} |
|
|
|
|
|
g_check_cross = check_cross; |
|
|
|
|
|
/* |
|
|
for (var i = 0; i < 6; i++) { |
|
|
console.log("(" + i.toString() + ")" + polygon.points[i].x + "," + polygon.points[i].y); |
|
|
}*/ |
|
|
|
|
|
return true; |
|
|
} |
|
|
|
|
|
function GetMaxWidth() { |
|
|
return MAX_WIDTH; |
|
|
} |
|
|
|
|
|
function GetMaxHeight() { |
|
|
return MAX_HEIGHT; |
|
|
} |
|
|
// define a function that can keep the polygon in the same position when we change its |
|
|
// width/height/top/left. |
|
|
|
|
|
function anchorWrapper1(anchorIndex, fn) { |
|
|
return function (eventData, transform, x, y) { |
|
|
var fabricObject = transform.target, |
|
|
absolutePoint = fabric.util.transformPoint({ |
|
|
x: (fabricObject.points[anchorIndex].x - fabricObject.pathOffset.x), |
|
|
y: (fabricObject.points[anchorIndex].y - fabricObject.pathOffset.y), |
|
|
}, fabricObject.calcTransformMatrix()), |
|
|
actionPerformed = fn(eventData, transform, x, y), |
|
|
newDim = fabricObject._setPositionDimensions({}), |
|
|
polygonBaseSize = fabricObject._getNonTransformedDimensions(), |
|
|
newX = (fabricObject.points[anchorIndex].x - fabricObject.pathOffset.x) / polygonBaseSize.x, |
|
|
newY = (fabricObject.points[anchorIndex].y - fabricObject.pathOffset.y) / polygonBaseSize.y; |
|
|
//fabricObject.setPositionByOrigin(absolutePoint, newX + 0.5, newY + 0.5); |
|
|
fabricObject.setPositionByOrigin(absolutePoint, newX + 0.5, newY + 0.5); |
|
|
|
|
|
for (var index_point = 0; index_point < MAX_SIZE_POINTS; index_point++) |
|
|
currentPointPosition1[index_point] = fabricObject.points[index_point]; |
|
|
|
|
|
if (g_check_cross == 1) { |
|
|
currentPointPosition1[0].x = 156; |
|
|
currentPointPosition1[0].y = 64; |
|
|
currentPointPosition1[1].x = 156; |
|
|
currentPointPosition1[1].y = 160; |
|
|
currentPointPosition1[2].x = 156; |
|
|
currentPointPosition1[2].y = 256; |
|
|
|
|
|
currentPointPosition1[3].x = 313; |
|
|
currentPointPosition1[3].y = 256; |
|
|
currentPointPosition1[4].x = 313; |
|
|
currentPointPosition1[4].y = 160; |
|
|
currentPointPosition1[5].x = 313; |
|
|
currentPointPosition1[5].y = 64; |
|
|
|
|
|
g_check_cross = 0; |
|
|
} |
|
|
|
|
|
if (g_enable_show_direction == 1) { |
|
|
currentPointPosition1[4].x = (currentPointPosition1[0].x * 1 + currentPointPosition1[3].x * 2) / 3; |
|
|
currentPointPosition1[4].y = (currentPointPosition1[0].y * 1 + currentPointPosition1[3].y * 2) / 3; |
|
|
currentPointPosition1[5].x = (currentPointPosition1[0].x * 2 + currentPointPosition1[3].x * 1) / 3; |
|
|
currentPointPosition1[5].y = (currentPointPosition1[0].y * 2 + currentPointPosition1[3].y * 1) / 3; |
|
|
} |
|
|
|
|
|
different_index = anchorIndex; |
|
|
show_pixels_for_zone(); |
|
|
Edit_Arrow(); |
|
|
return actionPerformed; |
|
|
} |
|
|
} |
|
|
|
|
|
function anchorWrapper2(anchorIndex, fn) { |
|
|
return function (eventData, transform, x, y) { |
|
|
var fabricObject = transform.target, |
|
|
absolutePoint = fabric.util.transformPoint({ |
|
|
x: (fabricObject.points[anchorIndex].x - fabricObject.pathOffset.x), |
|
|
y: (fabricObject.points[anchorIndex].y - fabricObject.pathOffset.y), |
|
|
}, fabricObject.calcTransformMatrix()), |
|
|
actionPerformed = fn(eventData, transform, x, y), |
|
|
newDim = fabricObject._setPositionDimensions({}), |
|
|
polygonBaseSize = fabricObject._getNonTransformedDimensions(), |
|
|
newX = (fabricObject.points[anchorIndex].x - fabricObject.pathOffset.x) / polygonBaseSize.x, |
|
|
newY = (fabricObject.points[anchorIndex].y - fabricObject.pathOffset.y) / polygonBaseSize.y; |
|
|
fabricObject.setPositionByOrigin(absolutePoint, newX + 0.5, newY + 0.5); |
|
|
|
|
|
for (var index_point = 0; index_point < MAX_SIZE_POINTS; index_point++) |
|
|
currentPointPosition2[index_point] = fabricObject.points[index_point]; |
|
|
|
|
|
if (g_check_cross == 1) { |
|
|
currentPointPosition2[0].x = 156; |
|
|
currentPointPosition2[0].y = 64; |
|
|
currentPointPosition2[1].x = 156; |
|
|
currentPointPosition2[1].y = 160; |
|
|
currentPointPosition2[2].x = 156; |
|
|
currentPointPosition2[2].y = 256; |
|
|
|
|
|
currentPointPosition2[3].x = 313; |
|
|
currentPointPosition2[3].y = 256; |
|
|
currentPointPosition2[4].x = 313; |
|
|
currentPointPosition2[4].y = 160; |
|
|
currentPointPosition2[5].x = 313; |
|
|
currentPointPosition2[5].y = 64; |
|
|
|
|
|
g_check_cross = 0; |
|
|
} |
|
|
|
|
|
if (g_enable_show_direction == 1) { |
|
|
currentPointPosition2[4].x = (currentPointPosition2[0].x * 1 + currentPointPosition2[3].x * 2) / 3; |
|
|
currentPointPosition2[4].y = (currentPointPosition2[0].y * 1 + currentPointPosition2[3].y * 2) / 3; |
|
|
currentPointPosition2[5].x = (currentPointPosition2[0].x * 2 + currentPointPosition2[3].x * 1) / 3; |
|
|
currentPointPosition2[5].y = (currentPointPosition2[0].y * 2 + currentPointPosition2[3].y * 1) / 3; |
|
|
} |
|
|
|
|
|
different_index = anchorIndex; |
|
|
show_pixels_for_zone(); |
|
|
Edit_Arrow(); |
|
|
return actionPerformed; |
|
|
} |
|
|
} |
|
|
|
|
|
function anchorWrapper3(anchorIndex, fn) { |
|
|
return function (eventData, transform, x, y) { |
|
|
var fabricObject = transform.target, |
|
|
absolutePoint = fabric.util.transformPoint({ |
|
|
x: (fabricObject.points[anchorIndex].x - fabricObject.pathOffset.x), |
|
|
y: (fabricObject.points[anchorIndex].y - fabricObject.pathOffset.y), |
|
|
}, fabricObject.calcTransformMatrix()), |
|
|
actionPerformed = fn(eventData, transform, x, y), |
|
|
newDim = fabricObject._setPositionDimensions({}), |
|
|
polygonBaseSize = fabricObject._getNonTransformedDimensions(), |
|
|
newX = (fabricObject.points[anchorIndex].x - fabricObject.pathOffset.x) / polygonBaseSize.x, |
|
|
newY = (fabricObject.points[anchorIndex].y - fabricObject.pathOffset.y) / polygonBaseSize.y; |
|
|
fabricObject.setPositionByOrigin(absolutePoint, newX + 0.5, newY + 0.5); |
|
|
|
|
|
for (var index_point = 0; index_point < MAX_SIZE_POINTS; index_point++) |
|
|
currentPointPosition3[index_point] = fabricObject.points[index_point]; |
|
|
|
|
|
if (g_check_cross == 1) { |
|
|
currentPointPosition3[0].x = 156; |
|
|
currentPointPosition3[0].y = 64; |
|
|
currentPointPosition3[1].x = 156; |
|
|
currentPointPosition3[1].y = 160; |
|
|
currentPointPosition3[2].x = 156; |
|
|
currentPointPosition3[2].y = 256; |
|
|
|
|
|
currentPointPosition3[3].x = 313; |
|
|
currentPointPosition3[3].y = 256; |
|
|
currentPointPosition3[4].x = 313; |
|
|
currentPointPosition3[4].y = 160; |
|
|
currentPointPosition3[5].x = 313; |
|
|
currentPointPosition3[5].y = 64; |
|
|
|
|
|
g_check_cross = 0; |
|
|
} |
|
|
|
|
|
if (g_enable_show_direction == 1) { |
|
|
currentPointPosition3[4].x = (currentPointPosition3[0].x * 1 + currentPointPosition3[3].x * 2) / 3; |
|
|
currentPointPosition3[4].y = (currentPointPosition3[0].y * 1 + currentPointPosition3[3].y * 2) / 3; |
|
|
currentPointPosition3[5].x = (currentPointPosition3[0].x * 2 + currentPointPosition3[3].x * 1) / 3; |
|
|
currentPointPosition3[5].y = (currentPointPosition3[0].y * 2 + currentPointPosition3[3].y * 1) / 3; |
|
|
} |
|
|
|
|
|
different_index = anchorIndex; |
|
|
show_pixels_for_zone(); |
|
|
Edit_Arrow(); |
|
|
return actionPerformed; |
|
|
} |
|
|
} |
|
|
|
|
|
function anchorWrapper4(anchorIndex, fn) { |
|
|
return function (eventData, transform, x, y) { |
|
|
var fabricObject = transform.target, |
|
|
absolutePoint = fabric.util.transformPoint({ |
|
|
x: (fabricObject.points[anchorIndex].x - fabricObject.pathOffset.x), |
|
|
y: (fabricObject.points[anchorIndex].y - fabricObject.pathOffset.y), |
|
|
}, fabricObject.calcTransformMatrix()), |
|
|
actionPerformed = fn(eventData, transform, x, y), |
|
|
newDim = fabricObject._setPositionDimensions({}), |
|
|
polygonBaseSize = fabricObject._getNonTransformedDimensions(), |
|
|
newX = (fabricObject.points[anchorIndex].x - fabricObject.pathOffset.x) / polygonBaseSize.x, |
|
|
newY = (fabricObject.points[anchorIndex].y - fabricObject.pathOffset.y) / polygonBaseSize.y; |
|
|
fabricObject.setPositionByOrigin(absolutePoint, newX + 0.5, newY + 0.5); |
|
|
|
|
|
for (var index_point = 0; index_point < MAX_SIZE_POINTS; index_point++) |
|
|
currentPointPosition4[index_point] = fabricObject.points[index_point]; |
|
|
|
|
|
if (g_check_cross == 1) { |
|
|
currentPointPosition4[0].x = 156; |
|
|
currentPointPosition4[0].y = 64; |
|
|
currentPointPosition4[1].x = 156; |
|
|
currentPointPosition4[1].y = 160; |
|
|
currentPointPosition4[2].x = 156; |
|
|
currentPointPosition4[2].y = 256; |
|
|
|
|
|
currentPointPosition4[3].x = 313; |
|
|
currentPointPosition4[3].y = 256; |
|
|
currentPointPosition4[4].x = 313; |
|
|
currentPointPosition4[4].y = 160; |
|
|
currentPointPosition4[5].x = 313; |
|
|
currentPointPosition4[5].y = 64; |
|
|
|
|
|
g_check_cross = 0; |
|
|
} |
|
|
|
|
|
if (g_enable_show_direction == 1) { |
|
|
currentPointPosition4[4].x = (currentPointPosition4[0].x * 1 + currentPointPosition4[3].x * 2) / 3; |
|
|
currentPointPosition4[4].y = (currentPointPosition4[0].y * 1 + currentPointPosition4[3].y * 2) / 3; |
|
|
currentPointPosition4[5].x = (currentPointPosition4[0].x * 2 + currentPointPosition4[3].x * 1) / 3; |
|
|
currentPointPosition4[5].y = (currentPointPosition4[0].y * 2 + currentPointPosition4[3].y * 1) / 3; |
|
|
} |
|
|
|
|
|
different_index = anchorIndex; |
|
|
show_pixels_for_zone(); |
|
|
Edit_Arrow(); |
|
|
return actionPerformed; |
|
|
} |
|
|
} |
|
|
|
|
|
function anchorWrapper5(anchorIndex, fn) { |
|
|
return function (eventData, transform, x, y) { |
|
|
var fabricObject = transform.target, |
|
|
absolutePoint = fabric.util.transformPoint({ |
|
|
x: (fabricObject.points[anchorIndex].x - fabricObject.pathOffset.x), |
|
|
y: (fabricObject.points[anchorIndex].y - fabricObject.pathOffset.y), |
|
|
}, fabricObject.calcTransformMatrix()), |
|
|
actionPerformed = fn(eventData, transform, x, y), |
|
|
newDim = fabricObject._setPositionDimensions({}), |
|
|
polygonBaseSize = fabricObject._getNonTransformedDimensions(), |
|
|
newX = (fabricObject.points[anchorIndex].x - fabricObject.pathOffset.x) / polygonBaseSize.x, |
|
|
newY = (fabricObject.points[anchorIndex].y - fabricObject.pathOffset.y) / polygonBaseSize.y; |
|
|
fabricObject.setPositionByOrigin(absolutePoint, newX + 0.5, newY + 0.5); |
|
|
|
|
|
for (var index_point = 0; index_point < MAX_SIZE_POINTS; index_point++) |
|
|
currentPointPosition5[index_point] = fabricObject.points[index_point]; |
|
|
|
|
|
if (g_check_cross == 1) { |
|
|
currentPointPosition5[0].x = 156; |
|
|
currentPointPosition5[0].y = 64; |
|
|
currentPointPosition5[1].x = 156; |
|
|
currentPointPosition5[1].y = 160; |
|
|
currentPointPosition5[2].x = 156; |
|
|
currentPointPosition5[2].y = 256; |
|
|
|
|
|
currentPointPosition5[3].x = 313; |
|
|
currentPointPosition5[3].y = 256; |
|
|
currentPointPosition5[4].x = 313; |
|
|
currentPointPosition5[4].y = 160; |
|
|
currentPointPosition5[5].x = 313; |
|
|
currentPointPosition5[5].y = 64; |
|
|
|
|
|
g_check_cross = 0; |
|
|
} |
|
|
|
|
|
if (g_enable_show_direction == 1 || (parseInt(parking_space[3], 10) >= 1 && parseInt(parking_line[3], 10) >= 1)) { |
|
|
currentPointPosition5[4].x = (currentPointPosition5[0].x * 1 + currentPointPosition5[3].x * 2) / 3; |
|
|
currentPointPosition5[4].y = (currentPointPosition5[0].y * 1 + currentPointPosition5[3].y * 2) / 3; |
|
|
currentPointPosition5[5].x = (currentPointPosition5[0].x * 2 + currentPointPosition5[3].x * 1) / 3; |
|
|
currentPointPosition5[5].y = (currentPointPosition5[0].y * 2 + currentPointPosition5[3].y * 1) / 3; |
|
|
} |
|
|
|
|
|
different_index = anchorIndex; |
|
|
show_pixels_for_zone(); |
|
|
Edit_Arrow(); |
|
|
return actionPerformed; |
|
|
} |
|
|
} |
|
|
|
|
|
function anchorWrapper6(anchorIndex, fn) { |
|
|
return function (eventData, transform, x, y) { |
|
|
var fabricObject = transform.target, |
|
|
absolutePoint = fabric.util.transformPoint({ |
|
|
x: (fabricObject.points[anchorIndex].x - fabricObject.pathOffset.x), |
|
|
y: (fabricObject.points[anchorIndex].y - fabricObject.pathOffset.y), |
|
|
}, fabricObject.calcTransformMatrix()), |
|
|
actionPerformed = fn(eventData, transform, x, y), |
|
|
newDim = fabricObject._setPositionDimensions({}), |
|
|
polygonBaseSize = fabricObject._getNonTransformedDimensions(), |
|
|
newX = (fabricObject.points[anchorIndex].x - fabricObject.pathOffset.x) / polygonBaseSize.x, |
|
|
newY = (fabricObject.points[anchorIndex].y - fabricObject.pathOffset.y) / polygonBaseSize.y; |
|
|
fabricObject.setPositionByOrigin(absolutePoint, newX + 0.5, newY + 0.5); |
|
|
|
|
|
for (var index_point = 0; index_point < MAX_SIZE_POINTS; index_point++) |
|
|
currentPointPosition6[index_point] = fabricObject.points[index_point]; |
|
|
|
|
|
if (g_check_cross == 1) { |
|
|
currentPointPosition6[0].x = 156; |
|
|
currentPointPosition6[0].y = 64; |
|
|
currentPointPosition6[1].x = 156; |
|
|
currentPointPosition6[1].y = 160; |
|
|
currentPointPosition6[2].x = 156; |
|
|
currentPointPosition6[2].y = 256; |
|
|
|
|
|
currentPointPosition6[3].x = 313; |
|
|
currentPointPosition6[3].y = 256; |
|
|
currentPointPosition6[4].x = 313; |
|
|
currentPointPosition6[4].y = 160; |
|
|
currentPointPosition6[5].x = 313; |
|
|
currentPointPosition6[5].y = 64; |
|
|
|
|
|
g_check_cross = 0; |
|
|
} |
|
|
|
|
|
if (g_enable_show_direction == 1 || (parseInt(parking_space[3], 10) >= 1 && parseInt(parking_line[3], 10) >= 1)) { |
|
|
currentPointPosition6[4].x = (currentPointPosition6[0].x * 1 + currentPointPosition6[3].x * 2) / 3; |
|
|
currentPointPosition6[4].y = (currentPointPosition6[0].y * 1 + currentPointPosition6[3].y * 2) / 3; |
|
|
currentPointPosition6[5].x = (currentPointPosition6[0].x * 2 + currentPointPosition6[3].x * 1) / 3; |
|
|
currentPointPosition6[5].y = (currentPointPosition6[0].y * 2 + currentPointPosition6[3].y * 1) / 3; |
|
|
} |
|
|
|
|
|
different_index = anchorIndex; |
|
|
show_pixels_for_zone(); |
|
|
Edit_Arrow(); |
|
|
return actionPerformed; |
|
|
} |
|
|
} |
|
|
|
|
|
function anchorWrapper7(anchorIndex, fn) { |
|
|
return function (eventData, transform, x, y) { |
|
|
var fabricObject = transform.target, |
|
|
absolutePoint = fabric.util.transformPoint({ |
|
|
x: (fabricObject.points[anchorIndex].x - fabricObject.pathOffset.x), |
|
|
y: (fabricObject.points[anchorIndex].y - fabricObject.pathOffset.y), |
|
|
}, fabricObject.calcTransformMatrix()), |
|
|
actionPerformed = fn(eventData, transform, x, y), |
|
|
newDim = fabricObject._setPositionDimensions({}), |
|
|
polygonBaseSize = fabricObject._getNonTransformedDimensions(), |
|
|
newX = (fabricObject.points[anchorIndex].x - fabricObject.pathOffset.x) / polygonBaseSize.x, |
|
|
newY = (fabricObject.points[anchorIndex].y - fabricObject.pathOffset.y) / polygonBaseSize.y; |
|
|
fabricObject.setPositionByOrigin(absolutePoint, newX + 0.5, newY + 0.5); |
|
|
|
|
|
for (var index_point = 0; index_point < MAX_SIZE_POINTS; index_point++) |
|
|
currentPointPosition7[index_point] = fabricObject.points[index_point]; |
|
|
|
|
|
if (g_check_cross == 1) { |
|
|
currentPointPosition7[0].x = 156; |
|
|
currentPointPosition7[0].y = 64; |
|
|
currentPointPosition7[1].x = 156; |
|
|
currentPointPosition7[1].y = 160; |
|
|
currentPointPosition7[2].x = 156; |
|
|
currentPointPosition7[2].y = 256; |
|
|
|
|
|
currentPointPosition7[3].x = 313; |
|
|
currentPointPosition7[3].y = 256; |
|
|
currentPointPosition7[4].x = 313; |
|
|
currentPointPosition7[4].y = 160; |
|
|
currentPointPosition7[5].x = 313; |
|
|
currentPointPosition7[5].y = 64; |
|
|
|
|
|
g_check_cross = 0; |
|
|
} |
|
|
|
|
|
if (g_enable_show_direction == 1 || (parseInt(parking_space[3], 10) >= 1 && parseInt(parking_line[3], 10) >= 1)) { |
|
|
currentPointPosition7[4].x = (currentPointPosition7[0].x * 1 + currentPointPosition7[3].x * 2) / 3; |
|
|
currentPointPosition7[4].y = (currentPointPosition7[0].y * 1 + currentPointPosition7[3].y * 2) / 3; |
|
|
currentPointPosition7[5].x = (currentPointPosition7[0].x * 2 + currentPointPosition7[3].x * 1) / 3; |
|
|
currentPointPosition7[5].y = (currentPointPosition7[0].y * 2 + currentPointPosition7[3].y * 1) / 3; |
|
|
} |
|
|
|
|
|
different_index = anchorIndex; |
|
|
show_pixels_for_zone(); |
|
|
Edit_Arrow(); |
|
|
return actionPerformed; |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
function anchorWrapper8(anchorIndex, fn) { |
|
|
return function (eventData, transform, x, y) { |
|
|
var fabricObject = transform.target, |
|
|
absolutePoint = fabric.util.transformPoint({ |
|
|
x: (fabricObject.points[anchorIndex].x - fabricObject.pathOffset.x), |
|
|
y: (fabricObject.points[anchorIndex].y - fabricObject.pathOffset.y), |
|
|
}, fabricObject.calcTransformMatrix()), |
|
|
actionPerformed = fn(eventData, transform, x, y), |
|
|
newDim = fabricObject._setPositionDimensions({}), |
|
|
polygonBaseSize = fabricObject._getNonTransformedDimensions(), |
|
|
newX = (fabricObject.points[anchorIndex].x - fabricObject.pathOffset.x) / polygonBaseSize.x, |
|
|
newY = (fabricObject.points[anchorIndex].y - fabricObject.pathOffset.y) / polygonBaseSize.y; |
|
|
fabricObject.setPositionByOrigin(absolutePoint, newX + 0.5, newY + 0.5); |
|
|
|
|
|
for (var index_point = 0; index_point < MAX_SIZE_POINTS; index_point++) |
|
|
currentPointPosition8[index_point] = fabricObject.points[index_point]; |
|
|
|
|
|
if (g_check_cross == 1) { |
|
|
currentPointPosition8[0].x = 156; |
|
|
currentPointPosition8[0].y = 64; |
|
|
currentPointPosition8[1].x = 156; |
|
|
currentPointPosition8[1].y = 160; |
|
|
currentPointPosition8[2].x = 156; |
|
|
currentPointPosition8[2].y = 256; |
|
|
|
|
|
currentPointPosition8[3].x = 313; |
|
|
currentPointPosition8[3].y = 256; |
|
|
currentPointPosition8[4].x = 313; |
|
|
currentPointPosition8[4].y = 160; |
|
|
currentPointPosition8[5].x = 313; |
|
|
currentPointPosition8[5].y = 64; |
|
|
|
|
|
g_check_cross = 0; |
|
|
} |
|
|
|
|
|
if (g_enable_show_direction == 1 || (parseInt(parking_space[3], 10) >= 1 && parseInt(parking_line[3], 10) >= 1)) { |
|
|
currentPointPosition8[4].x = (currentPointPosition8[0].x * 1 + currentPointPosition8[3].x * 2) / 3; |
|
|
currentPointPosition8[4].y = (currentPointPosition8[0].y * 1 + currentPointPosition8[3].y * 2) / 3; |
|
|
currentPointPosition8[5].x = (currentPointPosition8[0].x * 2 + currentPointPosition8[3].x * 1) / 3; |
|
|
currentPointPosition8[5].y = (currentPointPosition8[0].y * 2 + currentPointPosition8[3].y * 1) / 3; |
|
|
} |
|
|
|
|
|
different_index = anchorIndex; |
|
|
show_pixels_for_zone(); |
|
|
Edit_Arrow(); |
|
|
return actionPerformed; |
|
|
} |
|
|
} |
|
|
|
|
|
var check_edit1 = 0; |
|
|
var check_edit2 = 0; |
|
|
var check_edit3 = 0; |
|
|
var check_edit4 = 0; |
|
|
var check_edit5 = 0; |
|
|
var check_edit6 = 0; |
|
|
var check_edit7 = 0; |
|
|
var check_edit8 = 0; |
|
|
|
|
|
function get_check_edit1() { |
|
|
return check_edit1; |
|
|
} |
|
|
|
|
|
function get_check_edit2() { |
|
|
return check_edit2; |
|
|
} |
|
|
|
|
|
function get_check_edit3() { |
|
|
return check_edit3; |
|
|
} |
|
|
function get_check_edit4() { |
|
|
return check_edit4; |
|
|
} |
|
|
|
|
|
function get_check_edit5() { |
|
|
return check_edit5; |
|
|
} |
|
|
|
|
|
function get_check_edit6() { |
|
|
return check_edit6; |
|
|
} |
|
|
|
|
|
function get_check_edit7() { |
|
|
return check_edit7; |
|
|
} |
|
|
|
|
|
function get_check_edit8() { |
|
|
return check_edit8; |
|
|
} |
|
|
|
|
|
|
|
|
function Edit1() { |
|
|
// clone what are you copying since you |
|
|
// may want copy and paste on different moment. |
|
|
// and you do not want the changes happened |
|
|
// later to reflect on the copy. |
|
|
var poly1 = canvasTripwire1.getObjects()[0]; |
|
|
canvasTripwire1.setActiveObject(poly1); |
|
|
|
|
|
poly1.edit = !poly1.edit; |
|
|
if (poly1.edit) { |
|
|
var lastControl1 = poly1.points.length - 1; |
|
|
poly1.cornerStyle = 'circle'; |
|
|
poly1.cornerColor = '#6c87d4'; |
|
|
poly1.cornerColor = "rgba(108, 135, 212, 0.8)"; |
|
|
|
|
|
poly1.controls = poly1.points.reduce(function (acc1, point1, index1) { |
|
|
acc1['p' + index1] = new fabric.Control({ |
|
|
positionHandler: polygonPositionHandler, |
|
|
actionHandler: anchorWrapper1(index1 > 0 ? index1 - 1 : lastControl1, func_actionHandler), |
|
|
actionName: 'modifyPolygon1', |
|
|
pointIndex: index1 |
|
|
}); |
|
|
return acc1; |
|
|
}, {}); |
|
|
|
|
|
check_edit1 = 1; |
|
|
} else { |
|
|
//poly1.cornerColor = 'black'; |
|
|
//poly1.cornerStyle = 'rect'; |
|
|
//poly1.controls = fabric.Object.prototype.controls; |
|
|
poly1.controls = null; |
|
|
poly1.cornerColor = null; |
|
|
poly1.cornerStyle = null; |
|
|
|
|
|
check_edit1 = 0; |
|
|
} |
|
|
poly1.hasBorders = !poly1.edit; |
|
|
canvasTripwire1.requestRenderAll(); |
|
|
} |
|
|
|
|
|
function Edit2() { |
|
|
// clone what are you copying since you |
|
|
// may want copy and paste on different moment. |
|
|
// and you do not want the changes happened |
|
|
// later to reflect on the copy. |
|
|
var poly2 = canvasTripwire2.getObjects()[0]; |
|
|
canvasTripwire2.setActiveObject(poly2); |
|
|
|
|
|
poly2.edit = !poly2.edit; |
|
|
if (poly2.edit) { |
|
|
var lastControl2 = poly2.points.length - 1; |
|
|
poly2.cornerStyle = 'circle'; |
|
|
poly2.cornerColor = '#6c87d4'; |
|
|
poly2.cornerColor = "rgba(108, 135, 212, 0.8)"; |
|
|
|
|
|
poly2.controls = poly2.points.reduce(function (acc2, point2, index2) { |
|
|
acc2['p' + index2] = new fabric.Control({ |
|
|
positionHandler: polygonPositionHandler, |
|
|
actionHandler: anchorWrapper2(index2 > 0 ? index2 - 1 : lastControl2, func_actionHandler), |
|
|
actionName: 'modifyPolygon2', |
|
|
pointIndex: index2 |
|
|
}); |
|
|
return acc2; |
|
|
}, {}); |
|
|
|
|
|
check_edit2 = 1; |
|
|
} else { |
|
|
//poly2.cornerColor = 'black'; |
|
|
//poly2.cornerStyle = 'rect'; |
|
|
//poly2.controls = fabric.Object.prototype.controls; |
|
|
poly2.controls = null; |
|
|
poly2.cornerColor = null; |
|
|
poly2.cornerStyle = null; |
|
|
|
|
|
check_edit2 = 0; |
|
|
} |
|
|
poly2.hasBorders = !poly2.edit; |
|
|
canvasTripwire2.requestRenderAll(); |
|
|
} |
|
|
|
|
|
function Edit3() { |
|
|
// clone what are you copying since you |
|
|
// may want copy and paste on different moment. |
|
|
// and you do not want the changes happened |
|
|
// later to reflect on the copy. |
|
|
var poly3 = canvasTripwire3.getObjects()[0]; |
|
|
canvasTripwire3.setActiveObject(poly3); |
|
|
|
|
|
poly3.edit = !poly3.edit; |
|
|
if (poly3.edit) { |
|
|
var lastControl3 = poly3.points.length - 1; |
|
|
poly3.cornerStyle = 'circle'; |
|
|
poly3.cornerColor = '#6c87d4'; |
|
|
poly3.cornerColor = "rgba(108, 135, 212, 0.8)"; |
|
|
|
|
|
poly3.controls = poly3.points.reduce(function (acc3, point3, index3) { |
|
|
acc3['p' + index3] = new fabric.Control({ |
|
|
positionHandler: polygonPositionHandler, |
|
|
actionHandler: anchorWrapper3(index3 > 0 ? index3 - 1 : lastControl3, func_actionHandler), |
|
|
actionName: 'modifyPolygon3', |
|
|
pointIndex: index3 |
|
|
}); |
|
|
return acc3; |
|
|
}, {}); |
|
|
|
|
|
check_edit3 = 1; |
|
|
} else { |
|
|
//poly3.cornerColor = 'black'; |
|
|
//poly3.cornerStyle = 'rect'; |
|
|
//poly3.controls = fabric.Object.prototype.controls; |
|
|
poly3.controls = null; |
|
|
poly3.cornerColor = null; |
|
|
poly3.cornerStyle = null; |
|
|
|
|
|
check_edit3 = 0; |
|
|
} |
|
|
poly3.hasBorders = !poly3.edit; |
|
|
canvasTripwire3.requestRenderAll(); |
|
|
} |
|
|
|
|
|
function Edit4() { |
|
|
// clone what are you copying since you |
|
|
// may want copy and paste on different moment. |
|
|
// and you do not want the changes happened |
|
|
// later to reflect on the copy. |
|
|
var poly4 = canvasTripwire4.getObjects()[0]; |
|
|
canvasTripwire4.setActiveObject(poly4); |
|
|
|
|
|
poly4.edit = !poly4.edit; |
|
|
if (poly4.edit) { |
|
|
var lastControl4 = poly4.points.length - 1; |
|
|
poly4.cornerStyle = 'circle'; |
|
|
poly4.cornerColor = '#6c87d4'; |
|
|
poly4.cornerColor = "rgba(108, 135, 212, 0.8)"; |
|
|
|
|
|
poly4.controls = poly4.points.reduce(function (acc4, point4, index4) { |
|
|
acc4['p' + index4] = new fabric.Control({ |
|
|
positionHandler: polygonPositionHandler, |
|
|
actionHandler: anchorWrapper4(index4 > 0 ? index4 - 1 : lastControl4, func_actionHandler), |
|
|
actionName: 'modifyPolygon4', |
|
|
pointIndex: index4 |
|
|
}); |
|
|
return acc4; |
|
|
}, {}); |
|
|
|
|
|
check_edit4 = 1; |
|
|
} else { |
|
|
//poly4.cornerColor = 'black'; |
|
|
//poly4.cornerStyle = 'rect'; |
|
|
//poly4.controls = fabric.Object.prototype.controls; |
|
|
poly4.controls = null; |
|
|
poly4.cornerColor = null; |
|
|
poly4.cornerStyle = null; |
|
|
|
|
|
check_edit4 = 0; |
|
|
} |
|
|
poly4.hasBorders = !poly4.edit; |
|
|
canvasTripwire4.requestRenderAll(); |
|
|
} |
|
|
|
|
|
|
|
|
function Edit5() { |
|
|
// clone what are you copying since you |
|
|
// may want copy and paste on different moment. |
|
|
// and you do not want the changes happened |
|
|
// later to reflect on the copy. |
|
|
var poly5 = canvasTripwire5.getObjects()[0]; |
|
|
canvasTripwire5.setActiveObject(poly5); |
|
|
|
|
|
poly5.edit = !poly5.edit; |
|
|
if (poly5.edit) { |
|
|
var lastControl5 = poly5.points.length - 1; |
|
|
poly5.cornerStyle = 'circle'; |
|
|
poly5.cornerColor = '#6c87d4'; |
|
|
poly5.cornerColor = "rgba(108, 135, 212, 0.8)"; |
|
|
|
|
|
poly5.controls = poly5.points.reduce(function (acc5, point5, index5) { |
|
|
acc5['p' + index5] = new fabric.Control({ |
|
|
positionHandler: polygonPositionHandler, |
|
|
actionHandler: anchorWrapper5(index5 > 0 ? index5 - 1 : lastControl5, func_actionHandler), |
|
|
actionName: 'modifyPolygon5', |
|
|
pointIndex: index5 |
|
|
}); |
|
|
return acc5; |
|
|
}, {}); |
|
|
|
|
|
check_edit5 = 1; |
|
|
} else { |
|
|
//poly4.cornerColor = 'black'; |
|
|
//poly4.cornerStyle = 'rect'; |
|
|
//poly4.controls = fabric.Object.prototype.controls; |
|
|
poly5.controls = null; |
|
|
poly5.cornerColor = null; |
|
|
poly5.cornerStyle = null; |
|
|
|
|
|
check_edit5 = 0; |
|
|
} |
|
|
poly5.hasBorders = !poly5.edit; |
|
|
canvasTripwire5.requestRenderAll(); |
|
|
} |
|
|
|
|
|
function Edit6() { |
|
|
// clone what are you copying since you |
|
|
// may want copy and paste on different moment. |
|
|
// and you do not want the changes happened |
|
|
// later to reflect on the copy. |
|
|
var poly6 = canvasTripwire6.getObjects()[0]; |
|
|
canvasTripwire6.setActiveObject(poly6); |
|
|
|
|
|
poly6.edit = !poly6.edit; |
|
|
if (poly6.edit) { |
|
|
var lastControl6 = poly6.points.length - 1; |
|
|
poly6.cornerStyle = 'circle'; |
|
|
poly6.cornerColor = '#6c87d4'; |
|
|
poly6.cornerColor = "rgba(108, 135, 212, 0.8)"; |
|
|
|
|
|
poly6.controls = poly6.points.reduce(function (acc6, point6, index6) { |
|
|
acc6['p' + index6] = new fabric.Control({ |
|
|
positionHandler: polygonPositionHandler, |
|
|
actionHandler: anchorWrapper6(index6 > 0 ? index6 - 1 : lastControl6, func_actionHandler), |
|
|
actionName: 'modifyPolygon6', |
|
|
pointIndex: index6 |
|
|
}); |
|
|
return acc6; |
|
|
}, {}); |
|
|
|
|
|
check_edit6 = 1; |
|
|
} else { |
|
|
//poly4.cornerColor = 'black'; |
|
|
//poly4.cornerStyle = 'rect'; |
|
|
//poly4.controls = fabric.Object.prototype.controls; |
|
|
poly6.controls = null; |
|
|
poly6.cornerColor = null; |
|
|
poly6.cornerStyle = null; |
|
|
|
|
|
check_edit6 = 0; |
|
|
} |
|
|
poly6.hasBorders = !poly6.edit; |
|
|
canvasTripwire6.requestRenderAll(); |
|
|
} |
|
|
|
|
|
function Edit7() { |
|
|
// clone what are you copying since you |
|
|
// may want copy and paste on different moment. |
|
|
// and you do not want the changes happened |
|
|
// later to reflect on the copy. |
|
|
var poly7 = canvasTripwire7.getObjects()[0]; |
|
|
canvasTripwire7.setActiveObject(poly7); |
|
|
|
|
|
poly7.edit = !poly7.edit; |
|
|
if (poly7.edit) { |
|
|
var lastControl7 = poly7.points.length - 1; |
|
|
poly7.cornerStyle = 'circle'; |
|
|
poly7.cornerColor = '#6c87d4'; |
|
|
poly7.cornerColor = "rgba(108, 135, 212, 0.8)"; |
|
|
|
|
|
poly7.controls = poly7.points.reduce(function (acc7, point7, index7) { |
|
|
acc7['p' + index7] = new fabric.Control({ |
|
|
positionHandler: polygonPositionHandler, |
|
|
actionHandler: anchorWrapper7(index7 > 0 ? index7 - 1 : lastControl7, func_actionHandler), |
|
|
actionName: 'modifyPolygon7', |
|
|
pointIndex: index7 |
|
|
}); |
|
|
return acc7; |
|
|
}, {}); |
|
|
|
|
|
check_edit7 = 1; |
|
|
} else { |
|
|
//poly4.cornerColor = 'black'; |
|
|
//poly4.cornerStyle = 'rect'; |
|
|
//poly4.controls = fabric.Object.prototype.controls; |
|
|
poly7.controls = null; |
|
|
poly7.cornerColor = null; |
|
|
poly7.cornerStyle = null; |
|
|
|
|
|
check_edit7 = 0; |
|
|
} |
|
|
poly7.hasBorders = !poly7.edit; |
|
|
canvasTripwire7.requestRenderAll(); |
|
|
} |
|
|
|
|
|
function Edit8() { |
|
|
// clone what are you copying since you |
|
|
// may want copy and paste on different moment. |
|
|
// and you do not want the changes happened |
|
|
// later to reflect on the copy. |
|
|
var poly8 = canvasTripwire8.getObjects()[0]; |
|
|
canvasTripwire8.setActiveObject(poly8); |
|
|
|
|
|
poly8.edit = !poly8.edit; |
|
|
if (poly8.edit) { |
|
|
var lastControl8 = poly8.points.length - 1; |
|
|
poly8.cornerStyle = 'circle'; |
|
|
poly8.cornerColor = '#6c87d4'; |
|
|
poly8.cornerColor = "rgba(108, 135, 212, 0.8)"; |
|
|
|
|
|
poly8.controls = poly8.points.reduce(function (acc8, point8, index8) { |
|
|
acc8['p' + index8] = new fabric.Control({ |
|
|
positionHandler: polygonPositionHandler, |
|
|
actionHandler: anchorWrapper8(index8 > 0 ? index8 - 1 : lastControl8, func_actionHandler), |
|
|
actionName: 'modifyPolygon8', |
|
|
pointIndex: index8 |
|
|
}); |
|
|
return acc8; |
|
|
}, {}); |
|
|
|
|
|
check_edit8 = 1; |
|
|
} else { |
|
|
//poly4.cornerColor = 'black'; |
|
|
//poly4.cornerStyle = 'rect'; |
|
|
//poly4.controls = fabric.Object.prototype.controls; |
|
|
poly8.controls = null; |
|
|
poly8.cornerColor = null; |
|
|
poly8.cornerStyle = null; |
|
|
|
|
|
check_edit8 = 0; |
|
|
} |
|
|
poly8.hasBorders = !poly8.edit; |
|
|
canvasTripwire8.requestRenderAll(); |
|
|
} |
|
|
|
|
|
function createCanvasTrafficLight() { |
|
|
canvasTripwire = new fabric.Canvas('CanvasTripwire', { |
|
|
height: G_VIEW_CANVAS_Y,//window.innerHeight |
|
|
width: G_VIEW_CANVAS_X//window.innerWidth |
|
|
}); |
|
|
canvasTripwire.requestRenderAll(); |
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
//----------------------------------------------------------------------------------------------------------------- |
|
|
|
|
|
function polygonArea(points) { |
|
|
var i, j; |
|
|
var area = 0; |
|
|
for (i = 0; i < points.length; i++) { |
|
|
j = (i+1) % points.length; |
|
|
area += points[i].x * points[j].y; |
|
|
area -= points[i].y * points[j].x; |
|
|
} |
|
|
area /= 2; |
|
|
return Math.abs(area); |
|
|
} |
|
|
|
|
|
function func_rotate_direction() { |
|
|
g_mydirection[g_zone_id]++; |
|
|
if (g_mydirection[g_zone_id] === 5) { |
|
|
g_mydirection[g_zone_id] = 1; |
|
|
} |
|
|
Edit_Arrow(); |
|
|
} |
|
|
|
|
|
function func_set_direction(temp_direction,temp_zone_id) { |
|
|
if (temp_direction >= 1 && temp_direction <= 4) { |
|
|
g_mydirection[temp_zone_id] = temp_direction; |
|
|
} |
|
|
} |
|
|
|
|
|
function func_get_direction(temp_zone_id) { |
|
|
return g_mydirection[temp_zone_id]; |
|
|
} |
|
|
|
|
|
var g_first_edit_zone = 0; |
|
|
function Edit_Zone(enable_zone_in_four_point) { |
|
|
if (g_zone_id >= 0 && g_zone_id <= 7) { |
|
|
g_first_edit_zone = 1; |
|
|
MAX_SIZE_POINTS = 6; |
|
|
points_array = GetPointLocation(g_zone_id); |
|
|
|
|
|
if (enable_zone_in_four_point === 0) |
|
|
MAX_SIZE_POINTS = 6; |
|
|
else |
|
|
MAX_SIZE_POINTS = 4; |
|
|
|
|
|
var temp_points_array = []; |
|
|
|
|
|
for (var i = 0; i < MAX_SIZE_POINTS; i++) { |
|
|
temp_points_array.push({ |
|
|
x: 0, |
|
|
y: 0 |
|
|
}); |
|
|
} |
|
|
|
|
|
var min_x_temp = 10000; |
|
|
var min_y_temp = 10000; |
|
|
|
|
|
for (var i = 0; i < MAX_SIZE_POINTS; i++) { |
|
|
temp_points_array[i].x = points_array[i].x; |
|
|
temp_points_array[i].y = points_array[i].y; |
|
|
if (temp_points_array[i].x < min_x_temp) |
|
|
min_x_temp = temp_points_array[i].x; |
|
|
if (temp_points_array[i].y < min_y_temp) |
|
|
min_y_temp = temp_points_array[i].y; |
|
|
} |
|
|
|
|
|
var polygon_zone_temp = new fabric.Polygon(temp_points_array, { |
|
|
left: min_x_temp, |
|
|
top: min_y_temp, |
|
|
fill: 'transparent', |
|
|
strokeWidth: 2, |
|
|
stroke: '#ffff00', |
|
|
scaleX: 1, |
|
|
scaleY: 1, |
|
|
opacity: 0.7, |
|
|
objectCaching: false, |
|
|
transparentCorners: false, |
|
|
//cornerColor: '#ff0000', |
|
|
}); |
|
|
polygon_zone_temp.lockMovementX = true; //Prevents horizontal movement |
|
|
polygon_zone_temp.lockMovementY = true; //Prevents vertical movement |
|
|
|
|
|
if (g_zone_id === 0) { |
|
|
canvasTripwire1.insertAt(polygon_zone_temp, 0, true); |
|
|
|
|
|
disabelIteraction(canvasTripwire2.getObjects()[0]); |
|
|
disabelIteraction(canvasTripwire3.getObjects()[0]); |
|
|
disabelIteraction(canvasTripwire4.getObjects()[0]); |
|
|
disabelIteraction(canvasTripwire5.getObjects()[0]); |
|
|
disabelIteraction(canvasTripwire6.getObjects()[0]); |
|
|
disabelIteraction(canvasTripwire7.getObjects()[0]); |
|
|
disabelIteraction(canvasTripwire8.getObjects()[0]); |
|
|
Edit1(); |
|
|
|
|
|
} |
|
|
else if (g_zone_id === 1) { |
|
|
canvasTripwire2.insertAt(polygon_zone_temp, 0, true); |
|
|
|
|
|
disabelIteraction(canvasTripwire1.getObjects()[0]); |
|
|
disabelIteraction(canvasTripwire3.getObjects()[0]); |
|
|
disabelIteraction(canvasTripwire4.getObjects()[0]); |
|
|
disabelIteraction(canvasTripwire5.getObjects()[0]); |
|
|
disabelIteraction(canvasTripwire6.getObjects()[0]); |
|
|
disabelIteraction(canvasTripwire7.getObjects()[0]); |
|
|
disabelIteraction(canvasTripwire8.getObjects()[0]); |
|
|
Edit2(); |
|
|
} |
|
|
else if (g_zone_id === 2) { |
|
|
canvasTripwire3.insertAt(polygon_zone_temp, 0, true); |
|
|
|
|
|
disabelIteraction(canvasTripwire1.getObjects()[0]); |
|
|
disabelIteraction(canvasTripwire2.getObjects()[0]); |
|
|
disabelIteraction(canvasTripwire4.getObjects()[0]); |
|
|
disabelIteraction(canvasTripwire5.getObjects()[0]); |
|
|
disabelIteraction(canvasTripwire6.getObjects()[0]); |
|
|
disabelIteraction(canvasTripwire7.getObjects()[0]); |
|
|
disabelIteraction(canvasTripwire8.getObjects()[0]); |
|
|
Edit3(); |
|
|
} |
|
|
else if (g_zone_id === 3) { |
|
|
canvasTripwire4.insertAt(polygon_zone_temp, 0, true); |
|
|
|
|
|
disabelIteraction(canvasTripwire1.getObjects()[0]); |
|
|
disabelIteraction(canvasTripwire2.getObjects()[0]); |
|
|
disabelIteraction(canvasTripwire3.getObjects()[0]); |
|
|
disabelIteraction(canvasTripwire5.getObjects()[0]); |
|
|
disabelIteraction(canvasTripwire6.getObjects()[0]); |
|
|
disabelIteraction(canvasTripwire7.getObjects()[0]); |
|
|
disabelIteraction(canvasTripwire8.getObjects()[0]); |
|
|
Edit4(); |
|
|
} |
|
|
else if (g_zone_id === 4) { |
|
|
canvasTripwire5.insertAt(polygon_zone_temp, 0, true); |
|
|
|
|
|
disabelIteraction(canvasTripwire1.getObjects()[0]); |
|
|
disabelIteraction(canvasTripwire2.getObjects()[0]); |
|
|
disabelIteraction(canvasTripwire3.getObjects()[0]); |
|
|
disabelIteraction(canvasTripwire4.getObjects()[0]); |
|
|
disabelIteraction(canvasTripwire6.getObjects()[0]); |
|
|
disabelIteraction(canvasTripwire7.getObjects()[0]); |
|
|
disabelIteraction(canvasTripwire8.getObjects()[0]); |
|
|
Edit5(); |
|
|
} |
|
|
else if (g_zone_id === 5) { |
|
|
canvasTripwire6.insertAt(polygon_zone_temp, 0, true); |
|
|
|
|
|
disabelIteraction(canvasTripwire1.getObjects()[0]); |
|
|
disabelIteraction(canvasTripwire2.getObjects()[0]); |
|
|
disabelIteraction(canvasTripwire3.getObjects()[0]); |
|
|
disabelIteraction(canvasTripwire4.getObjects()[0]); |
|
|
disabelIteraction(canvasTripwire5.getObjects()[0]); |
|
|
disabelIteraction(canvasTripwire7.getObjects()[0]); |
|
|
disabelIteraction(canvasTripwire8.getObjects()[0]); |
|
|
Edit6(); |
|
|
} |
|
|
else if (g_zone_id === 6) { |
|
|
canvasTripwire7.insertAt(polygon_zone_temp, 0, true); |
|
|
|
|
|
disabelIteraction(canvasTripwire1.getObjects()[0]); |
|
|
disabelIteraction(canvasTripwire2.getObjects()[0]); |
|
|
disabelIteraction(canvasTripwire3.getObjects()[0]); |
|
|
disabelIteraction(canvasTripwire4.getObjects()[0]); |
|
|
disabelIteraction(canvasTripwire5.getObjects()[0]); |
|
|
disabelIteraction(canvasTripwire6.getObjects()[0]); |
|
|
disabelIteraction(canvasTripwire8.getObjects()[0]); |
|
|
Edit7(); |
|
|
} |
|
|
else if (g_zone_id === 7) { |
|
|
canvasTripwire8.insertAt(polygon_zone_temp, 0, true); |
|
|
|
|
|
disabelIteraction(canvasTripwire1.getObjects()[0]); |
|
|
disabelIteraction(canvasTripwire2.getObjects()[0]); |
|
|
disabelIteraction(canvasTripwire3.getObjects()[0]); |
|
|
disabelIteraction(canvasTripwire4.getObjects()[0]); |
|
|
disabelIteraction(canvasTripwire5.getObjects()[0]); |
|
|
disabelIteraction(canvasTripwire6.getObjects()[0]); |
|
|
disabelIteraction(canvasTripwire7.getObjects()[0]); |
|
|
Edit8(); |
|
|
} |
|
|
} |
|
|
} |
|
|
|
|
|
function Edit_Arrow() { |
|
|
points_array = GetPointLocation(g_zone_id); |
|
|
|
|
|
if (g_zone_id >= 0 && g_zone_id <= 7) { |
|
|
|
|
|
var index_point = g_mydirection[g_zone_id] - 1; |
|
|
var next_point = index_point + 1 >= 4 ? 0 : index_point + 1; |
|
|
var start_x = points_array[next_point].x; |
|
|
var start_y = points_array[next_point].y; |
|
|
var end_x = points_array[index_point].x; |
|
|
var end_y = points_array[index_point].y; |
|
|
|
|
|
if (g_zone_id === 0) |
|
|
canvasTripwire1.insertAt(AddArrowObject(start_x, start_y, end_x, end_y), 1, true); |
|
|
else if (g_zone_id === 1) |
|
|
canvasTripwire2.insertAt(AddArrowObject(start_x, start_y, end_x, end_y), 1, true); |
|
|
else if (g_zone_id === 2) |
|
|
canvasTripwire3.insertAt(AddArrowObject(start_x, start_y, end_x, end_y), 1, true); |
|
|
else if (g_zone_id === 3) |
|
|
canvasTripwire4.insertAt(AddArrowObject(start_x, start_y, end_x, end_y), 1, true); |
|
|
else if (g_zone_id === 4) |
|
|
canvasTripwire5.insertAt(AddArrowObject(start_x, start_y, end_x, end_y), 1, true); |
|
|
else if (g_zone_id === 5) |
|
|
canvasTripwire6.insertAt(AddArrowObject(start_x, start_y, end_x, end_y), 1, true); |
|
|
else if (g_zone_id === 6) |
|
|
canvasTripwire7.insertAt(AddArrowObject(start_x, start_y, end_x, end_y), 1, true); |
|
|
else if (g_zone_id === 7) |
|
|
canvasTripwire8.insertAt(AddArrowObject(start_x, start_y, end_x, end_y), 1, true); |
|
|
} |
|
|
} |
|
|
|
|
|
function set_g_zone_id(zone_id) { |
|
|
g_zone_id = zone_id; |
|
|
} |
|
|
|
|
|
function show_pixels_for_zone() { |
|
|
|
|
|
linelengths_list = ""; |
|
|
var linelengths_list_2 = ""; |
|
|
var linelengths_list_3 = ""; |
|
|
|
|
|
points_array[i] = GetPointLocation(g_zone_id); |
|
|
|
|
|
var temp_different_index = different_index + 1 < MAX_SIZE_POINTS ? different_index + 1: 0; |
|
|
|
|
|
var last_different_index = temp_different_index - 1 >= 0 ? temp_different_index - 1 : MAX_SIZE_POINTS - 1; |
|
|
var next_different_index = temp_different_index + 1 < MAX_SIZE_POINTS ? temp_different_index + 1 : 0; |
|
|
|
|
|
var current_x = points_array[temp_different_index].x * G_CAM_SENSOR_RES_WIDTH / G_VIEW_CANVAS_X; |
|
|
var current_y = points_array[temp_different_index].y * G_CAM_SENSOR_RES_HEIGHT / G_VIEW_CANVAS_Y; |
|
|
var last_x = points_array[last_different_index].x * G_CAM_SENSOR_RES_WIDTH / G_VIEW_CANVAS_X; |
|
|
var last_y = points_array[last_different_index].y * G_CAM_SENSOR_RES_HEIGHT / G_VIEW_CANVAS_Y; |
|
|
var next_x = points_array[next_different_index].x * G_CAM_SENSOR_RES_WIDTH / G_VIEW_CANVAS_X; |
|
|
var next_y = points_array[next_different_index].y * G_CAM_SENSOR_RES_HEIGHT / G_VIEW_CANVAS_Y; |
|
|
|
|
|
var linelength1 = Math.sqrt(Math.pow((current_x - last_x), 2) + Math.pow((current_y - last_y), 2)); |
|
|
var linelength2 = Math.sqrt(Math.pow((next_x - current_x), 2) + Math.pow((next_y - current_y), 2)); |
|
|
linelengths_list += linelength1.toFixed(2) + " px\n"; |
|
|
linelengths_list_2 += linelength2.toFixed(2) + " px\n"; |
|
|
|
|
|
linelengths_list_3 += "FOV: " + ((polygonArea(points_array) / (G_VIEW_CANVAS_X * G_VIEW_CANVAS_Y))*100).toFixed(0) + " %\n"; |
|
|
var max_protected_objects = g_max_protected_objects; |
|
|
|
|
|
if (g_zone_id === 0) { |
|
|
while (canvasTripwire1.getObjects().length > max_protected_objects) { |
|
|
var items = canvasTripwire1.getObjects(); |
|
|
if (items[canvasTripwire1.getObjects().length - 1]) { |
|
|
canvasTripwire1.remove(items[canvasTripwire1.getObjects().length - 1]); |
|
|
} |
|
|
} |
|
|
|
|
|
canvasTripwire1.add(insertTextLabel_Orange((points_array[temp_different_index].x + points_array[last_different_index].x) / 2, (points_array[temp_different_index].y + points_array[last_different_index].y) / 2, 50, 50, linelengths_list)); |
|
|
canvasTripwire1.add(insertTextLabel_Orange((points_array[temp_different_index].x + points_array[next_different_index].x) / 2, (points_array[temp_different_index].y + points_array[next_different_index].y) / 2, 50, 50, linelengths_list_2)); |
|
|
canvasTripwire1.add(insertTextLabel_Orange(0, 0, 50, 50, linelengths_list_3)); |
|
|
g_enable_show_pixel = 1; |
|
|
setTimeout(function () { g_enable_show_pixel = 0; },3000); |
|
|
} |
|
|
else if (g_zone_id === 1) { |
|
|
while (canvasTripwire2.getObjects().length > max_protected_objects) { |
|
|
var items = canvasTripwire2.getObjects(); |
|
|
if (items[canvasTripwire2.getObjects().length - 1]) { |
|
|
canvasTripwire2.remove(items[canvasTripwire2.getObjects().length - 1]); |
|
|
} |
|
|
} |
|
|
canvasTripwire2.add(insertTextLabel_Orange((points_array[temp_different_index].x + points_array[last_different_index].x) / 2, (points_array[temp_different_index].y + points_array[last_different_index].y) / 2, 50, 50, linelengths_list)); |
|
|
canvasTripwire2.add(insertTextLabel_Orange((points_array[temp_different_index].x + points_array[next_different_index].x) / 2, (points_array[temp_different_index].y + points_array[next_different_index].y) / 2, 50, 50, linelengths_list_2)); |
|
|
canvasTripwire2.add(insertTextLabel_Orange(0, 0, 50, 50, linelengths_list_3)); |
|
|
g_enable_show_pixel = 1; |
|
|
setTimeout(function () { g_enable_show_pixel = 0; }, 3000); |
|
|
} |
|
|
else if (g_zone_id === 2) { |
|
|
while (canvasTripwire3.getObjects().length > max_protected_objects) { |
|
|
var items = canvasTripwire3.getObjects(); |
|
|
if (items[canvasTripwire3.getObjects().length - 1]) { |
|
|
canvasTripwire3.remove(items[canvasTripwire3.getObjects().length - 1]); |
|
|
} |
|
|
} |
|
|
canvasTripwire3.add(insertTextLabel_Orange((points_array[temp_different_index].x + points_array[last_different_index].x) / 2, (points_array[temp_different_index].y + points_array[last_different_index].y) / 2, 50, 50, linelengths_list)); |
|
|
canvasTripwire3.add(insertTextLabel_Orange((points_array[temp_different_index].x + points_array[next_different_index].x) / 2, (points_array[temp_different_index].y + points_array[next_different_index].y) / 2, 50, 50, linelengths_list_2)); |
|
|
canvasTripwire3.add(insertTextLabel_Orange(0, 0, 50, 50, linelengths_list_3)); |
|
|
g_enable_show_pixel = 1; |
|
|
setTimeout(function () { g_enable_show_pixel = 0; }, 3000); |
|
|
} |
|
|
else if (g_zone_id === 3) { |
|
|
while (canvasTripwire4.getObjects().length > max_protected_objects) { |
|
|
var items = canvasTripwire4.getObjects(); |
|
|
if (items[canvasTripwire4.getObjects().length - 1]) { |
|
|
canvasTripwire4.remove(items[canvasTripwire4.getObjects().length - 1]); |
|
|
} |
|
|
} |
|
|
canvasTripwire4.add(insertTextLabel_Orange((points_array[temp_different_index].x + points_array[last_different_index].x) / 2, (points_array[temp_different_index].y + points_array[last_different_index].y) / 2, 50, 50, linelengths_list)); |
|
|
canvasTripwire4.add(insertTextLabel_Orange((points_array[temp_different_index].x + points_array[next_different_index].x) / 2, (points_array[temp_different_index].y + points_array[next_different_index].y) / 2, 50, 50, linelengths_list_2)); |
|
|
canvasTripwire4.add(insertTextLabel_Orange(0, 0, 50, 50, linelengths_list_3)); |
|
|
g_enable_show_pixel = 1; |
|
|
setTimeout(function () { g_enable_show_pixel = 0; }, 3000); |
|
|
} |
|
|
else if (g_zone_id === 4) { |
|
|
while (canvasTripwire5.getObjects().length > max_protected_objects) { |
|
|
var items = canvasTripwire5.getObjects(); |
|
|
if (items[canvasTripwire5.getObjects().length - 1]) { |
|
|
canvasTripwire5.remove(items[canvasTripwire5.getObjects().length - 1]); |
|
|
} |
|
|
} |
|
|
canvasTripwire5.add(insertTextLabel_Orange((points_array[temp_different_index].x + points_array[last_different_index].x) / 2, (points_array[temp_different_index].y + points_array[last_different_index].y) / 2, 50, 50, linelengths_list)); |
|
|
canvasTripwire5.add(insertTextLabel_Orange((points_array[temp_different_index].x + points_array[next_different_index].x) / 2, (points_array[temp_different_index].y + points_array[next_different_index].y) / 2, 50, 50, linelengths_list_2)); |
|
|
canvasTripwire5.add(insertTextLabel_Orange(0, 0, 50, 50, linelengths_list_3)); |
|
|
g_enable_show_pixel = 1; |
|
|
setTimeout(function () { g_enable_show_pixel = 0; }, 3000); |
|
|
} |
|
|
else if (g_zone_id === 5) { |
|
|
while (canvasTripwire6.getObjects().length > max_protected_objects) { |
|
|
var items = canvasTripwire6.getObjects(); |
|
|
if (items[canvasTripwire6.getObjects().length - 1]) { |
|
|
canvasTripwire6.remove(items[canvasTripwire6.getObjects().length - 1]); |
|
|
} |
|
|
} |
|
|
canvasTripwire6.add(insertTextLabel_Orange((points_array[temp_different_index].x + points_array[last_different_index].x) / 2, (points_array[temp_different_index].y + points_array[last_different_index].y) / 2, 50, 50, linelengths_list)); |
|
|
canvasTripwire6.add(insertTextLabel_Orange((points_array[temp_different_index].x + points_array[next_different_index].x) / 2, (points_array[temp_different_index].y + points_array[next_different_index].y) / 2, 50, 50, linelengths_list_2)); |
|
|
canvasTripwire6.add(insertTextLabel_Orange(0, 0, 50, 50, linelengths_list_3)); |
|
|
g_enable_show_pixel = 1; |
|
|
setTimeout(function () { g_enable_show_pixel = 0; }, 3000); |
|
|
} |
|
|
else if (g_zone_id === 6) { |
|
|
while (canvasTripwire7.getObjects().length > max_protected_objects) { |
|
|
var items = canvasTripwire7.getObjects(); |
|
|
if (items[canvasTripwire7.getObjects().length - 1]) { |
|
|
canvasTripwire7.remove(items[canvasTripwire7.getObjects().length - 1]); |
|
|
} |
|
|
} |
|
|
canvasTripwire7.add(insertTextLabel_Orange((points_array[temp_different_index].x + points_array[last_different_index].x) / 2, (points_array[temp_different_index].y + points_array[last_different_index].y) / 2, 50, 50, linelengths_list)); |
|
|
canvasTripwire7.add(insertTextLabel_Orange((points_array[temp_different_index].x + points_array[next_different_index].x) / 2, (points_array[temp_different_index].y + points_array[next_different_index].y) / 2, 50, 50, linelengths_list_2)); |
|
|
canvasTripwire7.add(insertTextLabel_Orange(0, 0, 50, 50, linelengths_list_3)); |
|
|
g_enable_show_pixel = 1; |
|
|
setTimeout(function () { g_enable_show_pixel = 0; }, 3000); |
|
|
} |
|
|
else if (g_zone_id === 7) { |
|
|
while (canvasTripwire8.getObjects().length > max_protected_objects) { |
|
|
var items = canvasTripwire8.getObjects(); |
|
|
if (items[canvasTripwire8.getObjects().length - 1]) { |
|
|
canvasTripwire8.remove(items[canvasTripwire8.getObjects().length - 1]); |
|
|
} |
|
|
} |
|
|
canvasTripwire8.add(insertTextLabel_Orange((points_array[temp_different_index].x + points_array[last_different_index].x) / 2, (points_array[temp_different_index].y + points_array[last_different_index].y) / 2, 50, 50, linelengths_list)); |
|
|
canvasTripwire8.add(insertTextLabel_Orange((points_array[temp_different_index].x + points_array[next_different_index].x) / 2, (points_array[temp_different_index].y + points_array[next_different_index].y) / 2, 50, 50, linelengths_list_2)); |
|
|
canvasTripwire8.add(insertTextLabel_Orange(0, 0, 50, 50, linelengths_list_3)); |
|
|
g_enable_show_pixel = 1; |
|
|
setTimeout(function () { g_enable_show_pixel = 0; }, 3000); |
|
|
} |
|
|
} |
|
|
|
|
|
function validatingJSON(json) { |
|
|
|
|
|
var checkedjson; |
|
|
|
|
|
try { |
|
|
checkedjson = JSON.parse(json); //JSON parse only for try catch |
|
|
//console.log("json OK"); |
|
|
//console.log(json); |
|
|
} catch (e) { |
|
|
checkedjson = null; |
|
|
console.log(e);//the character would be drop sometimes, for example the label "class_id" may be "clas_id". |
|
|
console.log(json); |
|
|
} |
|
|
|
|
|
return checkedjson; |
|
|
} |
|
|
|
|
|
//var last_cam_time = ""; |
|
|
//var count_the_same_cam_time = 0; |
|
|
|
|
|
function get_counter_count_msg() { |
|
|
return counter_count_msg; |
|
|
} |
|
|
|
|
|
var i_cold_times = 0; |
|
|
var g_cold_times = 20; |
|
|
|
|
|
function change_g_cold_times(temp_cold_times) { |
|
|
g_cold_times = temp_cold_times; |
|
|
} |
|
|
|
|
|
function GetAlarm(alarm_data) { |
|
|
|
|
|
if (canvasTripwire1) { |
|
|
if (!!alarm_data) { |
|
|
var datas; |
|
|
var ai_json; |
|
|
var complete_data = ""; |
|
|
var n1 = -1, n2 = -1, n2_temp = -1; |
|
|
|
|
|
var max_protected_objects = g_max_protected_objects; |
|
|
if (g_enable_show_pixel === 1) { |
|
|
max_protected_objects = g_max_protected_objects + 2; |
|
|
} |
|
|
|
|
|
complete_data = complete_data.concat(alarm_data); |
|
|
n1 = complete_data.indexOf('{"AiEngine"'); |
|
|
|
|
|
n2_temp = complete_data.indexOf('"Count"'); |
|
|
|
|
|
n2 = complete_data.indexOf('}', n2_temp); |
|
|
|
|
|
if (n1 > 0 && n2_temp > 0 && n2 > 0 && (n1 + 7) < n2_temp && n2_temp < n2) { |
|
|
wait_count = 0; |
|
|
clear_count = 0; |
|
|
datas = complete_data.split(/\r\n|\r/); |
|
|
complete_data = ""; |
|
|
|
|
|
//var check_cam_time = 0; |
|
|
//var buffer_cam_time = ""; |
|
|
for (var i = datas.length - 1; i >= 0; i--) { |
|
|
/* |
|
|
if (datas[i].substring(0, 8) == 'CamTime:') { |
|
|
buffer_cam_time = ""; |
|
|
buffer_cam_time = datas[i].slice(); |
|
|
}*/ |
|
|
if (datas[i].length > 12 && datas[i].substring(0, 12) == '{"AiEngine":' && datas[i].length < 8192 * 8) { |
|
|
//datas[i].replace(/\\'/g, "'"); |
|
|
//datas[i].replace('\"', '"'); |
|
|
|
|
|
/* |
|
|
datas[i].replace('\n', ''); |
|
|
datas[i].replace('\r', ''); |
|
|
datas[i].replace('\t', ''); |
|
|
datas[i].replace('\\', ''); |
|
|
*/ |
|
|
|
|
|
/* |
|
|
var alarm_test = '{"AiEngine":[{"id":0,"channel_id":1,"camera_name":"","res_height":1080,"res_width":1920,"confidence":59,"engine_type":1,"label_name":"car","class_id":2,"obj_type":0,"obj_tracking_id":1,"obj_dwell_time":23,"color_id":0,"color":"","linked_plate":"","x":83,"y":136,"w":215,"h":168,"parent_idx":-1,"behavior_id":0},{"id":1,"channel_id":1,"camera_name":"","res_height":1080,"res_width":1920,"confidence":43,"engine_type":1,"label_name":"car","class_id":2,"obj_type":0,"obj_tracking_id":2,"obj_dwell_time":23,"color_id":0,"color":"","linked_plate":"","x":158,"y":538,"w":218,"h":144,"parent_idx":-1,"behavior_id":0},{"id":2,"channel_id":1,"camera_name":"","res_height":1080,"res_width":1920,"confidence":82,"engine_type":1,"label_name":"car","class_id":2,"obj_type":0,"obj_tracking_id":3,"obj_dwell_time":23,"color_id":0,"color":"","linked_plate":"","x":342,"y":175,"w":321,"h":196,"parent_idx":-1,"behavior_id":0},{"id":3,"channel_id":1,"camera_name":"","res_height":1080,"res_width":1920,"confidence":49,"engine_type":1,"label_name":"car","class_id":2,"obj_type":0,"obj_tracking_id":6,"obj_dwell_time":23,"color_id":0,"color":"","linked_plate":"","x":362,"y":578,"w":253,"h":132,"parent_idx":-1,"behavior_id":0},{"id":4,"channel_id":1,"camera_name":"","res_height":1080,"res_width":1920,"confidence":69,"engine_type":1,"label_name":"car","class_id":2,"obj_type":0,"obj_tracking_id":4,"obj_dwell_time":23,"color_id":0,"color":"","linked_plate":"","x":714,"y":608,"w":239,"h":130,"parent_idx":-1,"behavior_id":0},{"id":5,"channel_id":1,"camera_name":"","res_height":1080,"res_width":1920,"confidence":31,"engine_type":1,"label_name":"car","class_id":2,"obj_type":0,"obj_tracking_id":5,"obj_dwell_time":23,"color_id":0,"color":"","linked_plate":"","x":1035,"y":663,"w":340,"h":179,"parent_idx":-1,"behavior_id":0}],"Count":6}'; |
|
|
|
|
|
ai_json = JSON.parse(alarm_test);*/ |
|
|
|
|
|
/* |
|
|
if (index_ == 0) { |
|
|
index_ = 1; |
|
|
alert(ai_json); |
|
|
}*/ |
|
|
|
|
|
var temp = null; |
|
|
temp = datas[i].slice(); |
|
|
|
|
|
ai_json = JSON.parse(temp); |
|
|
//ai_json = validatingJSON(temp); |
|
|
|
|
|
datas[i] = null; |
|
|
//check_cam_time = 1; |
|
|
break; |
|
|
} |
|
|
|
|
|
} |
|
|
/* |
|
|
if (check_cam_time === 1) { |
|
|
if (last_cam_time === "") { |
|
|
last_cam_time = buffer_cam_time; |
|
|
count_the_same_cam_time++; |
|
|
} |
|
|
else if (last_cam_time === buffer_cam_time) { |
|
|
count_the_same_cam_time++; |
|
|
} |
|
|
else { |
|
|
last_cam_time = buffer_cam_time; |
|
|
console.log(count_the_same_cam_time); |
|
|
count_the_same_cam_time = 0; |
|
|
} |
|
|
}*/ |
|
|
|
|
|
var AI_fps = ai_json.AI_fps; |
|
|
localStorage.setItem('AI_fps', AI_fps); |
|
|
var red_light = ai_json.red_light; |
|
|
if (ai_json != null) { |
|
|
bbox_count = ai_json.Count; |
|
|
} |
|
|
else { |
|
|
bbox_count = 0; |
|
|
} |
|
|
|
|
|
plate_count = 0; |
|
|
plate_idx = 0; |
|
|
|
|
|
/* |
|
|
if (bbox_count == 0) { |
|
|
clear_count_2++; |
|
|
} |
|
|
else { |
|
|
clear_count_2 = 3; |
|
|
}*/ |
|
|
/*if (clear_count_2 >= 3) */ |
|
|
{ |
|
|
//clear_count_2 = 0; |
|
|
|
|
|
RefreshCanvasObject(max_protected_objects); |
|
|
} |
|
|
|
|
|
//console.log("bbox_count: " + bbox_count.toString()); |
|
|
|
|
|
if (ai_json != null && typeof ai_json.counter_count !== 'undefined') { |
|
|
counter_count_msg = ""; |
|
|
|
|
|
for (var j = 0; j < 8; j++) { |
|
|
counter_count_msg += ("Counter0" + (j + 1).toString() + ": " + ai_json.counter_count[j] + ", "); |
|
|
if (j == 3) { |
|
|
counter_count_msg += "</br>"; |
|
|
} |
|
|
} |
|
|
localStorage.setItem('counter_count_msg', counter_count_msg); |
|
|
} |
|
|
else { |
|
|
counter_count_msg = ""; |
|
|
for (var j = 0; j < 8; j++) { |
|
|
counter_count_msg += ("Counter0" + (j + 1).toString() + ": " + " " + ", "); |
|
|
if (j == 3) { |
|
|
counter_count_msg += "</br>"; |
|
|
} |
|
|
} |
|
|
localStorage.setItem('counter_count_msg', counter_count_msg); |
|
|
} |
|
|
|
|
|
if (check_if_existing_coldobjects == 1) { |
|
|
|
|
|
for (var index_cold = 0; index_cold < MAX_COLDOBJECTS; index_cold++) { |
|
|
if (coldobjects_X[index_cold] >= 1 && coldobjects_Y[index_cold] >= 1 && coldobjects_W[index_cold] >= 1 && coldobjects_H[index_cold] >= 1 |
|
|
&& coldobjects_Object[index_cold].length >= 1) { |
|
|
|
|
|
var translate_name = func_translate_name(coldobjects_Object[index_cold]); |
|
|
|
|
|
canvasTripwire1.add(insertTrafficLightRectangle_Blue(coldobjects_X[index_cold] * 0.25, coldobjects_Y[index_cold] * 0.3, coldobjects_W[index_cold] * 0.25, coldobjects_H[index_cold] * 0.3, 1, 1)); |
|
|
|
|
|
canvasTripwire1.add(insertTextLabel_Blue(coldobjects_X[index_cold] * 0.25, coldobjects_Y[index_cold] * 0.3 - 18, 50, 50, translate_name)); |
|
|
} |
|
|
} |
|
|
i_cold_times++; |
|
|
if (i_cold_times >= g_cold_times) { |
|
|
check_if_existing_coldobjects = 0; |
|
|
i_cold_times = 0; |
|
|
} |
|
|
} |
|
|
|
|
|
if (red_light == 1) { |
|
|
canvasTripwire1.add(insertTextLabel_Red(10, MAX_HEIGHT - 25, 50, 50, "FPS:" + AI_fps.toString() + ",Red:" + red_light.toString())); |
|
|
} |
|
|
else { |
|
|
canvasTripwire1.add(insertTextLabel_Red(10, MAX_HEIGHT - 25, 50, 50, "FPS:" + AI_fps.toString())); |
|
|
} |
|
|
|
|
|
if (localStorage.getItem('play_video') == 1) { |
|
|
for (var i = 0; i < bbox_count /*&& i <= 10*/; i++) { |
|
|
if (ai_json.AiEngine[i]) { |
|
|
if (ai_json.AiEngine[i].parent_idx == -1) { |
|
|
if (ai_json.AiEngine[i].label_name == "L._Plate_USA" || |
|
|
ai_json.AiEngine[i].label_name == "L._Plate_MAC/MYS" || |
|
|
ai_json.AiEngine[i].label_name == "L._Plate_VNM" || |
|
|
ai_json.AiEngine[i].label_name == "L._Plate_EUR" || |
|
|
ai_json.AiEngine[i].label_name == "L._Plate_GBR" || |
|
|
ai_json.AiEngine[i].label_name == "L._Plate_JPN" || |
|
|
ai_json.AiEngine[i].label_name == "L._Plate_THA" || |
|
|
ai_json.AiEngine[i].label_name == "L._Plate_IDN" || |
|
|
ai_json.AiEngine[i].label_name == "L._Plate_IDN2" || |
|
|
ai_json.AiEngine[i].label_name == "L._Plate_BGD" || |
|
|
ai_json.AiEngine[i].label_name == "L._Plate_MEA" || |
|
|
ai_json.AiEngine[i].label_name == "L._Plate_PHL" || |
|
|
ai_json.AiEngine[i].label_name == "L._Plate_AUS" || |
|
|
ai_json.AiEngine[i].label_name == "L._Plate_CNT_1LINE" || |
|
|
ai_json.AiEngine[i].label_name == "L._Plate_CNT_2LINES" || |
|
|
ai_json.AiEngine[i].label_name == "L._Plate_CNT_3LINES" || |
|
|
ai_json.AiEngine[i].label_name == "L._Plate_CNT_VERTICAL" || |
|
|
ai_json.AiEngine[i].label_name == "L._Plate_CNT_USDOT" || |
|
|
ai_json.AiEngine[i].label_name == "ambulance" || |
|
|
ai_json.AiEngine[i].label_name == "face" || |
|
|
ai_json.AiEngine[i].label_name == "blank" || |
|
|
ai_json.AiEngine[i].label_name == "stop_sign" || |
|
|
ai_json.AiEngine[i].label_name == "qrcode" || |
|
|
ai_json.AiEngine[i].label_name == "barcode" || |
|
|
ai_json.AiEngine[i].label_name == "L._Plate_TWN") { |
|
|
|
|
|
if (ai_json.AiEngine[i].properties) { |
|
|
if (ai_json.AiEngine[i].properties.plate) { |
|
|
var plate_name = ""; |
|
|
if (ai_json.AiEngine[i].label_name == "ambulance") |
|
|
plate_name = plate_name.concat(ai_json.AiEngine[i].label_name); |
|
|
else if (ai_json.AiEngine[i].label_name == "blank") |
|
|
plate_name = plate_name.concat(ai_json.AiEngine[i].label_name); |
|
|
else if (ai_json.AiEngine[i].label_name == "stop_sign") |
|
|
plate_name = plate_name.concat(ai_json.AiEngine[i].label_name); |
|
|
else |
|
|
plate_name = plate_name.concat(ai_json.AiEngine[i].properties.plate); |
|
|
/* |
|
|
plate_name = plate_name.replace(/[「」‘’']/g, ''); |
|
|
if (plate_name === '' || plate_name === '0') { |
|
|
continue; |
|
|
}*/ |
|
|
|
|
|
AssignPlateObject(ai_json, i, plate_name); |
|
|
} |
|
|
} |
|
|
|
|
|
} |
|
|
else { |
|
|
var x = parseInt(ai_json.AiEngine[i].x, 10); |
|
|
var y = parseInt(ai_json.AiEngine[i].y, 10); |
|
|
var w = parseInt(ai_json.AiEngine[i].w, 10); |
|
|
var h = parseInt(ai_json.AiEngine[i].h, 10); |
|
|
var obj_tracking_id = parseInt(ai_json.AiEngine[i].obj_tracking_id, 10); |
|
|
var number_row = ai_json.AiEngine[i].number_row; |
|
|
|
|
|
var text_y = parseInt((ai_json.AiEngine[i].y + ai_json.AiEngine[i].h), 10); |
|
|
|
|
|
/*if (x == 0 || y == 0 || w == 0 || h == 0 || text_y == 0) |
|
|
continue; |
|
|
|
|
|
if (x * 0.25 <= 20) { |
|
|
x = 80; |
|
|
} |
|
|
else if (x * 0.25 >= 460) { |
|
|
x = 1840; |
|
|
} |
|
|
|
|
|
if (y * 0.3 <= 20) { |
|
|
y = 66; |
|
|
} |
|
|
else if (y * 0.3 >= 300) { |
|
|
y = 999; |
|
|
} |
|
|
|
|
|
if (x * 0.25 + w * 0.25 >= 460) { |
|
|
w = (460 - x * 0.25) * 4; |
|
|
} |
|
|
|
|
|
if (y * 0.3 + h * 0.3 >= 300) { |
|
|
h = (300 - y * 0.3) * 3.33; |
|
|
}*/ |
|
|
|
|
|
text_y = y - 66; |
|
|
|
|
|
var plate_name = ""; |
|
|
plate_name = plate_name.concat(ai_json.AiEngine[i].label_name); |
|
|
plate_name = plate_name.replace(/[「」‘’']/g, ''); |
|
|
|
|
|
if (plate_name === '' || plate_name === '0') { |
|
|
continue; |
|
|
} |
|
|
|
|
|
if (canvasTripwire1) { |
|
|
var translate_name = func_translate_name(plate_name); |
|
|
// var translate_name = plate_name; |
|
|
var behavior_id = ai_json.AiEngine[i].behavior_id; |
|
|
var detection_zone_id = ai_json.AiEngine[i].detection_zone_id; |
|
|
var obj_dwell_time = ai_json.AiEngine[i].obj_dwell_time; |
|
|
var color = ai_json.AiEngine[i].color; |
|
|
var center_direction = ai_json.AiEngine[i].center_direction; |
|
|
var center_stability = ai_json.AiEngine[i].center_stability; |
|
|
var center_speed = ai_json.AiEngine[i].center_speed; |
|
|
var progress_bar = ai_json.AiEngine[i].progress_bar; |
|
|
|
|
|
var tof_distance = ai_json.AiEngine[i].tof_distance; |
|
|
var tof_height = ai_json.AiEngine[i].tof_height; |
|
|
|
|
|
var code_content = ai_json.AiEngine[i].code_content; |
|
|
|
|
|
var label_word = ""; |
|
|
|
|
|
if (plate_name == "bg_learning") { |
|
|
if (current_state_hide_or_open_label == 1) { |
|
|
label_word = "Bg_learning, prg: " + progress_bar.toString() + "%" + ", ID: " + obj_tracking_id + Concat_obj_dwell_time(obj_dwell_time); |
|
|
} |
|
|
} |
|
|
else if (plate_name == "tof_point") { |
|
|
//if (current_state_hide_or_open_label == 1) |
|
|
{ |
|
|
if (ai_json.AiEngine[i].max_distance != 0 && ai_json.AiEngine[i].max_height != 0) { |
|
|
label_word = "Max"; |
|
|
|
|
|
var meterToft = 3.2808 |
|
|
var maxmeter = Math.floor((ai_json.AiEngine[i].max_distance / 1000) * 1000) / 1000; |
|
|
var maxft = Math.floor((ai_json.AiEngine[i].max_distance / 1000) * meterToft * 1000) / 1000; |
|
|
|
|
|
var maxmeter_h = Math.floor((ai_json.AiEngine[i].max_height / 1000) * 1000) / 1000; |
|
|
var maxft_h = Math.floor((ai_json.AiEngine[i].max_height / 1000) * meterToft * 1000) / 1000; |
|
|
|
|
|
insert_red_text_max = "Max,"; |
|
|
if (g_tof_enable_show_distance == 1) |
|
|
insert_red_text_max += "Dist: " + maxmeter.toString() + "M " + maxft.toString() + "Ft,"; |
|
|
if (g_tof_enable_show_height == 1) |
|
|
insert_red_text_max += "Ht: " + maxmeter_h.toString() + "M " + maxft_h.toString() + "Ft,"; |
|
|
if (g_tof_enable_show_distance == 0 && g_tof_enable_show_height == 0) { |
|
|
insert_red_text_max += "Dist: " + maxmeter.toString() + "M " + maxft.toString() + "Ft,"; |
|
|
insert_red_text_max += "Ht: " + maxmeter_h.toString() + "M " + maxft_h.toString() + "Ft,"; |
|
|
} |
|
|
} |
|
|
else if (ai_json.AiEngine[i].min_distance != 0 && ai_json.AiEngine[i].min_height != 0) { |
|
|
label_word = "Min"; |
|
|
|
|
|
var meterToft = 3.2808 |
|
|
var minmeter = Math.floor((ai_json.AiEngine[i].min_distance / 1000) * 1000) / 1000; |
|
|
var minft = Math.floor((ai_json.AiEngine[i].min_distance / 1000) * meterToft * 1000) / 1000; |
|
|
|
|
|
var minmeter_h = Math.floor((ai_json.AiEngine[i].min_height / 1000) * 1000) / 1000; |
|
|
var minft_h = Math.floor((ai_json.AiEngine[i].min_height / 1000) * meterToft * 1000) / 1000; |
|
|
|
|
|
insert_red_text_min = "Min,"; |
|
|
if (g_tof_enable_show_distance == 1) |
|
|
insert_red_text_min += "Dist: " + minmeter.toString() + "M " + minft.toString() + "Ft,"; |
|
|
if (g_tof_enable_show_height == 1) |
|
|
insert_red_text_min += "Ht: " + minmeter_h.toString() + "M " + minft_h.toString() + "Ft,"; |
|
|
if (g_tof_enable_show_distance == 0 && g_tof_enable_show_height == 0) { |
|
|
insert_red_text_min += "Dist: " + minmeter.toString() + "M " + minft.toString() + "Ft,"; |
|
|
insert_red_text_min += "Ht: " + minmeter_h.toString() + "M " + minft_h.toString() + "Ft,"; |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
else { |
|
|
if (plate_name == "object") { |
|
|
if (current_state_hide_or_open_direction == 1) { |
|
|
label_word = translate_name + ", N:" + ai_json.AiEngine[i].confidence.toString() + "%" + ", L:" + ai_json.AiEngine[i].confidence2.toString() + "%"; |
|
|
} |
|
|
|
|
|
if (current_state_hide_or_open_speed == 1) { |
|
|
if (label_word.length >= 1) { |
|
|
label_word += ", ID: " + obj_tracking_id + Concat_obj_dwell_time(obj_dwell_time); |
|
|
} |
|
|
else { |
|
|
label_word = "ID: " + obj_tracking_id + Concat_obj_dwell_time(obj_dwell_time); |
|
|
} |
|
|
} |
|
|
} |
|
|
else { |
|
|
if (current_state_hide_or_open_label == 1) { |
|
|
if (code_content.length == 0) { |
|
|
if (localStorage.getItem("events_default_version") != null && localStorage.getItem("events_default_version") == "4") { |
|
|
label_word = translate_name; |
|
|
} |
|
|
else { |
|
|
label_word = translate_name + ", " + ai_json.AiEngine[i].confidence.toString() + "%"; |
|
|
} |
|
|
} |
|
|
else |
|
|
label_word = translate_name + ", " + code_content; |
|
|
} |
|
|
if (current_state_hide_or_open_direction == 1) { |
|
|
|
|
|
if (center_direction.length == 0) { |
|
|
if (label_word.length >= 1) { |
|
|
label_word += ", ID: " + obj_tracking_id + Concat_obj_dwell_time(obj_dwell_time); |
|
|
} |
|
|
else { |
|
|
label_word = "ID: " + obj_tracking_id + Concat_obj_dwell_time(obj_dwell_time); |
|
|
} |
|
|
} |
|
|
else { |
|
|
if (label_word.length >= 1) { |
|
|
label_word += ", ID: " + obj_tracking_id + Concat_obj_dwell_time(obj_dwell_time) + ", D:" + center_direction; |
|
|
} |
|
|
else { |
|
|
label_word = "ID: " + obj_tracking_id + Concat_obj_dwell_time(obj_dwell_time) + ", D:" + center_direction; |
|
|
} |
|
|
} |
|
|
|
|
|
if (typeof center_stability !== 'undefined') { |
|
|
if (center_stability.length == 0) { |
|
|
|
|
|
} |
|
|
else { |
|
|
if (label_word.length >= 1) { |
|
|
label_word += ", St:" + center_stability; |
|
|
} |
|
|
else { |
|
|
label_word = "St:" + center_stability; |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
|
|
|
if (current_state_hide_or_open_speed == 1 && center_speed.length >= 1) { |
|
|
if (label_word.length >= 1) { |
|
|
label_word += ", S:" + center_speed; |
|
|
} |
|
|
else { |
|
|
label_word = "S:" + center_speed; |
|
|
} |
|
|
} |
|
|
|
|
|
if (localStorage.getItem("events_default_version") != null && localStorage.getItem("events_default_version") == "4") { |
|
|
if (current_state_hide_or_open_speed == 1) { |
|
|
if (label_word.length >= 1) { |
|
|
label_word += ", " + ai_json.AiEngine[i].confidence.toString() + "%"; |
|
|
} |
|
|
else { |
|
|
label_word = ai_json.AiEngine[i].confidence.toString() + "%"; |
|
|
} |
|
|
} |
|
|
} |
|
|
|
|
|
var tof_distance = ai_json.AiEngine[i].tof_distance; |
|
|
var tof_height = ai_json.AiEngine[i].tof_height; |
|
|
|
|
|
if (tof_distance && tof_height) { |
|
|
|
|
|
var meterToft = 3.2808 |
|
|
var tof_meter = roundDown(tof_distance, 3); |
|
|
var tof_ft = roundDown(Math.floor(tof_distance * meterToft * 1000) / 1000, 3); |
|
|
|
|
|
var tof_meter_h = roundDown(tof_height, 3); |
|
|
var tof_ft_h = roundDown(Math.floor(tof_height * meterToft * 1000) / 1000, 3); |
|
|
|
|
|
if (g_tof_enable_show_distance == 1) { |
|
|
if (label_word.length >= 1) { |
|
|
label_word += ", Dist: " + tof_meter.toString() + "M " + tof_ft.toString() + "Ft,"; |
|
|
} |
|
|
else { |
|
|
label_word = "Dist: " + tof_meter.toString() + "M " + tof_ft.toString() + "Ft,"; |
|
|
} |
|
|
} |
|
|
|
|
|
if (g_tof_enable_show_height == 1) { |
|
|
if (label_word.length >= 1) { |
|
|
label_word += ", Ht: " + tof_meter_h.toString() + "M " + tof_ft_h.toString() + "Ft,"; |
|
|
} |
|
|
else { |
|
|
label_word = "Ht: " + tof_meter_h.toString() + "M " + tof_ft_h.toString() + "Ft,"; |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
if (g_tof_enable_show_distance == 0 && g_tof_enable_show_height == 0) { |
|
|
if (label_word.length >= 1) { |
|
|
label_word += ", Dist: " + tof_meter.toString() + "M " + tof_ft.toString() + "Ft,"; |
|
|
label_word += "Ht: " + tof_meter_h.toString() + "M " + tof_ft_h.toString() + "Ft,"; |
|
|
} |
|
|
else { |
|
|
label_word = "Dist: " + tof_meter.toString() + "M " + tof_ft.toString() + "Ft,"; |
|
|
label_word += "Ht: " + tof_meter_h.toString() + "M " + tof_ft_h.toString() + "Ft,"; |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
|
|
|
if (label_word.length >= 1) { |
|
|
label_word += ", " + color; |
|
|
} |
|
|
else { |
|
|
label_word = color; |
|
|
} |
|
|
|
|
|
if (behavior_id <= 0) { |
|
|
canvasTripwire1.add(insertTrafficLightRectangle(x * 0.25, y * 0.3, w * 0.25, h * 0.3, 1, 1, plate_name, number_row)); |
|
|
} |
|
|
else { |
|
|
canvasTripwire1.add(insertTrafficLightRectangle_Red(x * 0.25, y * 0.3, w * 0.25, h * 0.3, 1, 1, plate_name)); |
|
|
} |
|
|
|
|
|
if (behavior_id >= 1) { |
|
|
if (label_word.length >= 1) { |
|
|
//console.log("Behavior occured: " + behavior_id.toString() + "; ID: " + obj_tracking_id.toString() + "; zone: " + detection_zone_id.toString()); |
|
|
canvasTripwire1.add(insertTextLabel_Red(x * 0.25, text_y * 0.3, 50, 50, label_word)); |
|
|
} |
|
|
/* |
|
|
for (var index_click = 0; index_click < click_canvas_all; index_click++) { |
|
|
canvasTripwire_all.getObjects()[index_click].stroke = "#ff0000"; |
|
|
} |
|
|
canvasTripwire1.getObjects()[0].stroke = "#ff0000"; |
|
|
canvasTripwire2.getObjects()[0].stroke = "#ff0000"; |
|
|
canvasTripwire3.getObjects()[0].stroke = "#ff0000"; |
|
|
canvasTripwire4.getObjects()[0].stroke = "#ff0000";*/ |
|
|
} |
|
|
else { |
|
|
if (label_word.length >= 1) { |
|
|
canvasTripwire1.add(insertTextLabel(x * 0.25, text_y * 0.3, 50, 50, label_word)); |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
|
|
|
plate_count++; |
|
|
plate_idx++; |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
|
|
|
RenderAllCanvas(); |
|
|
ai_json = null; |
|
|
} |
|
|
else { |
|
|
wait_count++; |
|
|
if (wait_count >= 3) { |
|
|
wait_count = 0; |
|
|
complete_data = ""; |
|
|
} |
|
|
|
|
|
clear_count++; |
|
|
if (clear_count >= 3) { |
|
|
clear_count = 0; |
|
|
|
|
|
RefreshCanvasObject(max_protected_objects); |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
|
|
|
function Concat_obj_dwell_time(obj_dwell_time) { |
|
|
if (parseInt(obj_dwell_time, 10) >= 1) { |
|
|
return "; dwell: " + obj_dwell_time; |
|
|
} |
|
|
else |
|
|
return ""; |
|
|
} |
|
|
|
|
|
function AssignPlateObject(ai_json,i_index,plate_name) { |
|
|
var x = parseInt(ai_json.AiEngine[i_index].x, 10); |
|
|
var y = parseInt(ai_json.AiEngine[i_index].y, 10); |
|
|
var w = parseInt(ai_json.AiEngine[i_index].w, 10); |
|
|
var h = parseInt(ai_json.AiEngine[i_index].h, 10); |
|
|
var text_y = parseInt((ai_json.AiEngine[i_index].y + ai_json.AiEngine[i_index].h), 10); |
|
|
//console.log(text_y); |
|
|
/*if (x * 0.25 <= 20) { |
|
|
x = 80; |
|
|
} |
|
|
else if (x * 0.25 >= 460) { |
|
|
x = 1840; |
|
|
} |
|
|
|
|
|
if (y * 0.3 <= 20) { |
|
|
y = 66; |
|
|
} |
|
|
else if (y * 0.3 >= 300) { |
|
|
y = 999; |
|
|
} |
|
|
|
|
|
if (x * 0.25 + w * 0.25 >= 460) { |
|
|
w = parseInt((460 - x * 0.25) * 4, 10); |
|
|
} |
|
|
|
|
|
if (y * 0.3 + h * 0.3 >= 300) { |
|
|
h = parseInt((300 - y * 0.3) * 3.33, 10); |
|
|
}*/ |
|
|
|
|
|
text_y = y - 66; |
|
|
|
|
|
var area_name = ""; |
|
|
var country_name = ""; |
|
|
var out_label = ""; |
|
|
|
|
|
if (ai_json.AiEngine[i_index].label_name == "L._Plate_USA" || |
|
|
ai_json.AiEngine[i_index].label_name == "L._Plate_THA" || |
|
|
ai_json.AiEngine[i_index].label_name == "L._Plate_BGD" || |
|
|
ai_json.AiEngine[i_index].label_name == "L._Plate_MEA" || |
|
|
ai_json.AiEngine[i_index].label_name == "L._Plate_AUS" || |
|
|
ai_json.AiEngine[i_index].label_name == "L._Plate_EUR" || |
|
|
ai_json.AiEngine[i_index].label_name == "L._Plate_JPN") { |
|
|
area_name = area_name.concat(ai_json.AiEngine[i_index].properties.area); |
|
|
country_name = country_name.concat(ai_json.AiEngine[i_index].properties.country); |
|
|
|
|
|
var obj_dwell_time = ai_json.AiEngine[i_index].obj_dwell_time; |
|
|
var obj_tracking_id = parseInt(ai_json.AiEngine[i_index].obj_tracking_id, 10); |
|
|
|
|
|
|
|
|
out_label = out_label.concat(plate_name, ", ", area_name, " ", country_name, ", ", ai_json.AiEngine[i_index].confidence.toString(), "%", |
|
|
", ID: ", obj_tracking_id, Concat_obj_dwell_time(obj_dwell_time)); |
|
|
} |
|
|
else { |
|
|
var obj_dwell_time = ai_json.AiEngine[i_index].obj_dwell_time; |
|
|
var obj_tracking_id = parseInt(ai_json.AiEngine[i_index].obj_tracking_id, 10); |
|
|
|
|
|
out_label = out_label.concat(plate_name, ", ", ai_json.AiEngine[i_index].confidence.toString(), "%", |
|
|
", ID: ", obj_tracking_id, Concat_obj_dwell_time(obj_dwell_time)); |
|
|
} |
|
|
|
|
|
if (canvasTripwire1) { |
|
|
canvasTripwire1.add(insertTrafficLightRectangle(x * 0.25, y * 0.3, w * 0.25, h * 0.3, 1, 1, "", 1)); |
|
|
var behavior_id = ai_json.AiEngine[i_index].behavior_id; |
|
|
if (ai_json.AiEngine[i_index].label_name == "L._Plate_USA" || |
|
|
ai_json.AiEngine[i_index].label_name == "L._Plate_THA" || |
|
|
ai_json.AiEngine[i_index].label_name == "L._Plate_BGD" || |
|
|
ai_json.AiEngine[i_index].label_name == "L._Plate_MEA" || |
|
|
ai_json.AiEngine[i_index].label_name == "L._Plate_AUS" || |
|
|
ai_json.AiEngine[i_index].label_name == "L._Plate_EUR" || |
|
|
ai_json.AiEngine[i_index].label_name == "L._Plate_JPN") { |
|
|
if (behavior_id >= 1) { |
|
|
canvasTripwire1.add(insertTextLabel_Red(x * 0.25, text_y * 0.3, 50, 50, out_label)); |
|
|
} |
|
|
else { |
|
|
canvasTripwire1.add(insertTextLabel(x * 0.25, text_y * 0.3, 50, 50, out_label)); |
|
|
} |
|
|
} |
|
|
else { |
|
|
if (behavior_id >= 1) { |
|
|
canvasTripwire1.add(insertTextLabel_Red(x * 0.25, text_y * 0.3, 50, 50, out_label)); |
|
|
} |
|
|
else { |
|
|
canvasTripwire1.add(insertTextLabel(x * 0.25, text_y * 0.3, 50, 50, out_label)); |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
|
|
|
function RenderAllCanvas() { |
|
|
if (canvasTripwire1) { |
|
|
canvasTripwire1.renderAll(); |
|
|
} |
|
|
} |
|
|
|
|
|
function RefreshCanvasObject(max_protected_objects) { |
|
|
|
|
|
if (typeof canvasTripwire1 !== 'undefined') { |
|
|
//Clear all objects |
|
|
while (canvasTripwire1.getObjects().length > max_protected_objects) { |
|
|
var items = canvasTripwire1.getObjects(); |
|
|
if (items[canvasTripwire1.getObjects().length - 1]) { |
|
|
canvasTripwire1.remove(items[canvasTripwire1.getObjects().length - 1]); |
|
|
} |
|
|
} |
|
|
//canvasTripwire1.getObjects()[0].stroke = "#ffff00"; |
|
|
} |
|
|
|
|
|
} |
|
|
|
|
|
var websocket_reconnect_flag = 0; |
|
|
|
|
|
function GetUrlPort() { |
|
|
var url_href = window.location.href; |
|
|
var arr_url = url_href.split(":")[2].split("/")[0]; |
|
|
|
|
|
return arr_url; |
|
|
} |
|
|
var ws = null; |
|
|
var wait_data = 0; |
|
|
function GetRequest_WebSocket() { |
|
|
sessionStorage.setItem('getalarmmotion_data', ""); |
|
|
var data_temp = ""; |
|
|
wait_data = 0; |
|
|
console.log("GetRequest_WebSocket"); |
|
|
if ("WebSocket" in window) { |
|
|
//console.log("WebSocket is supported by your Browser!"); |
|
|
|
|
|
// Let us open a web socket |
|
|
ws = new WebSocket("ws://" + window.location.hostname + ":" + GetUrlPort() + "/getalarmmotion"); |
|
|
|
|
|
keepAlive(); |
|
|
|
|
|
ws.onopen = function () { |
|
|
|
|
|
// Web Socket is connected, send data using send() |
|
|
//ws.send("Message to send"); |
|
|
console.log("ws.onopen..."); |
|
|
clearInterval(request_live); |
|
|
|
|
|
|
|
|
//clearInterval(reconnect_websocket); |
|
|
//websocket_reconnect_flag = 0; |
|
|
}; |
|
|
|
|
|
ws.onmessage = function (evt) { |
|
|
|
|
|
var received_msg = evt.data; |
|
|
//console.log("websocket:"); |
|
|
//console.log(received_msg); |
|
|
|
|
|
/* |
|
|
clearInterval(request_live); |
|
|
clearInterval(reconnect_websocket); |
|
|
websocket_reconnect_flag = 0;*/ |
|
|
data_temp = ""; |
|
|
data_temp = received_msg; |
|
|
//console.log("this.responseText.length: " + this.responseText.length.toString()); |
|
|
//console.log("readyState " + this.readyState.toString()); |
|
|
//sessionStorage.setItem('getalarmmotion_data', data_temp); |
|
|
//var current_page = localStorage.getItem('current_page'); |
|
|
//if (current_page === 'alarm' || current_page === 'alarm_nvr') |
|
|
{ |
|
|
GetAlarm(data_temp); |
|
|
} |
|
|
//console.log("websocket here"); |
|
|
wait_data = 0; |
|
|
}; |
|
|
|
|
|
ws.onclose = function () { |
|
|
// websocket is closed. |
|
|
console.log("Connection is closed..."); |
|
|
|
|
|
cancelKeepAlive(); |
|
|
|
|
|
ws = null; |
|
|
setTimeout(function () { |
|
|
GetRequest_WebSocket(); |
|
|
}, 1000); |
|
|
|
|
|
//websocket_reconnect_flag = 1; |
|
|
//reConnect(); |
|
|
}; |
|
|
|
|
|
ws.onerror = function (e) { |
|
|
// websocket is error. |
|
|
console.log("Connection is error"); |
|
|
console.log(e); |
|
|
|
|
|
//cancelKeepAlive(); |
|
|
//websocket_reconnect_flag = 1; |
|
|
//reConnect(); |
|
|
ws.close(); |
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
} else { |
|
|
|
|
|
// The browser doesn't support WebSocket |
|
|
//console.log("WebSocket NOT supported by your Browser!"); |
|
|
} |
|
|
} |
|
|
/* |
|
|
function reConnect() { |
|
|
//console.log("socket 連線斷開,正在嘗試重新建立連線"); |
|
|
|
|
|
if (websocket_reconnect_flag == 1) |
|
|
{ |
|
|
reconnect_websocket = setInterval(function () { |
|
|
GetRequest_WebSocket(); |
|
|
}, 5000); |
|
|
} |
|
|
}*/ |
|
|
|
|
|
var timerID = 0; |
|
|
function keepAlive() { |
|
|
var timeout = 5000; |
|
|
//console.log("keepAlive:" + ws.readyState); |
|
|
//console.log("wait_data:" + wait_data.toString()); |
|
|
if (ws.readyState != 2)//fail receive |
|
|
wait_data++; |
|
|
if (wait_data >= 20) |
|
|
ws.close(); |
|
|
else |
|
|
timerID = setTimeout(keepAlive, timeout); |
|
|
} |
|
|
function cancelKeepAlive() { |
|
|
if (timerID) { |
|
|
clearTimeout(timerID); |
|
|
} |
|
|
} |
|
|
|
|
|
function GetRequest_Http() { |
|
|
var xhttp = new XMLHttpRequest(); |
|
|
var data = "Null"; |
|
|
xhttp.onreadystatechange = function () { |
|
|
if (this.status == 200) { |
|
|
clearInterval(request_live); |
|
|
data = this.responseText.substring(data, this.responseText.length - 1); |
|
|
sessionStorage.setItem('getalarmmotion_data', data); |
|
|
GetAlarm(data); |
|
|
} |
|
|
}; |
|
|
xhttp.open("GET", "http://" + window.location.hostname + ":" + GetUrlPort() + "/getalarmmotion", true); |
|
|
xhttp.setRequestHeader("Cache-Control", "no-cache"); |
|
|
xhttp.setRequestHeader("Pragma", "no-cache"); |
|
|
//xhttp.setRequestHeader("Authorization", "Basic " + btoa("username:password")); |
|
|
|
|
|
xhttp.addEventListener("load", function (e) { |
|
|
//console.log(xhttp.responseText); |
|
|
}, false) |
|
|
|
|
|
xhttp.send(null); |
|
|
} |
|
|
|
|
|
function func_set_coldobjects(object_x, object_y, object_w, object_h, object_name) { |
|
|
$.ajax({ |
|
|
url: "/setconfig?coldobjects&x=" + object_x + "&y=" + object_y + "&w=" + object_w + "&h=" + object_h + "&Object=" + object_name, |
|
|
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 () { |
|
|
//console.info(); |
|
|
}, |
|
|
error: function () { |
|
|
console.warn(); |
|
|
} |
|
|
}); |
|
|
return false; |
|
|
} |
|
|
|
|
|
function func_get_coldobjects() { |
|
|
$.ajax({ |
|
|
url: "/getconfig?coldobjects=all", |
|
|
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 (retdata) { |
|
|
//console.log(retdata); |
|
|
var data_cold = validatingJSON(retdata); |
|
|
check_if_existing_coldobjects = 0; |
|
|
var temp_check_if_existing_coldobjects = 0; |
|
|
|
|
|
if (data_cold != null) { |
|
|
for (var i = 0; i < MAX_COLDOBJECTS; i++) { |
|
|
coldobjects_X[i] = data_cold.cold_objects[i].X; |
|
|
coldobjects_Y[i] = data_cold.cold_objects[i].Y; |
|
|
coldobjects_W[i] = data_cold.cold_objects[i].W; |
|
|
coldobjects_H[i] = data_cold.cold_objects[i].H; |
|
|
coldobjects_Object[i] = data_cold.cold_objects[i].Object; |
|
|
|
|
|
if (coldobjects_X[i] >= 1 && coldobjects_Y[i] >= 1 && coldobjects_W[i] >= 1 && coldobjects_H[i] >= 1 && coldobjects_Object[i].length >= 1) { |
|
|
temp_check_if_existing_coldobjects = 1; |
|
|
} |
|
|
} |
|
|
} |
|
|
check_if_existing_coldobjects = temp_check_if_existing_coldobjects; |
|
|
|
|
|
//console.info(); |
|
|
}, |
|
|
error: function () { |
|
|
console.warn(); |
|
|
} |
|
|
}); |
|
|
return false; |
|
|
} |
|
|
|
|
|
function func_clean_coldobjects() { |
|
|
$.ajax({ |
|
|
url: "/getconfig?coldobjects=clean", |
|
|
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 () { |
|
|
|
|
|
//console.info(); |
|
|
}, |
|
|
error: function () { |
|
|
console.warn(); |
|
|
} |
|
|
}); |
|
|
return false; |
|
|
} |
|
|
|
|
|
function func_translate_name(translate_name) { |
|
|
|
|
|
var json_label_names = JSON.parse(LABEL_NAMES); |
|
|
var json_label_names_zh_tw = JSON.parse(LABEL_NAMES_zh_tw); |
|
|
var json_label_names_ja_jp = JSON.parse(LABEL_NAMES_ja_jp); |
|
|
var json_label_names_it_it = JSON.parse(LABEL_NAMES_it_it); |
|
|
|
|
|
if (localStorage.getItem("dataset_ver").search("RAFFIC") >= 1) { |
|
|
var data = json_label_names.Tiny_Traffic[0]; |
|
|
var data_zh_tw = json_label_names_zh_tw.Tiny_Traffic[0]; |
|
|
var data_ja_jp = json_label_names_ja_jp.Tiny_Traffic[0]; |
|
|
var data_it_it = json_label_names_it_it.Tiny_Traffic[0]; |
|
|
for (var key in data) { |
|
|
if (data.hasOwnProperty(key)) { |
|
|
if (data[key] != "_s") { |
|
|
var label_names = data[key]; |
|
|
if (label_names == translate_name) { |
|
|
var label_names_zh_tw = data_zh_tw[key]; |
|
|
var label_names_ja_jp = data_ja_jp[key]; |
|
|
var label_names_it_it = data_it_it[key]; |
|
|
if (localStorage.getItem("events_default_version") != null && localStorage.getItem("events_default_version") == "4") { |
|
|
if (translate_name == "person") { |
|
|
if (G_LANG == "zh_tw") |
|
|
translate_name = "人"; |
|
|
else if (G_LANG == "ja_jp") |
|
|
translate_name = "人"; |
|
|
else if (G_LANG == "it_it") |
|
|
translate_name = "Umana"; |
|
|
else |
|
|
translate_name = "Human"; |
|
|
} |
|
|
else if (translate_name == "car") { |
|
|
if (G_LANG == "zh_tw") |
|
|
translate_name = "車"; |
|
|
else if (G_LANG == "ja_jp") |
|
|
translate_name = "車"; |
|
|
else if (G_LANG == "it_it") |
|
|
translate_name = "Veicolo"; |
|
|
else |
|
|
translate_name = "Vehicle"; |
|
|
} |
|
|
else { |
|
|
if (G_LANG == "zh_tw") |
|
|
translate_name = label_names_zh_tw; |
|
|
else if (G_LANG == "ja_jp") |
|
|
translate_name = label_names_ja_jp; |
|
|
else if (G_LANG == "it_it") |
|
|
translate_name = label_names_it_it; |
|
|
} |
|
|
} |
|
|
else { |
|
|
if (G_LANG == "zh_tw") |
|
|
translate_name = label_names_zh_tw; |
|
|
else if (G_LANG == "ja_jp") |
|
|
translate_name = label_names_ja_jp; |
|
|
else if (G_LANG == "it_it") |
|
|
translate_name = label_names_it_it; |
|
|
} |
|
|
break; |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
if (localStorage.getItem("dataset_ver").search("IFIRE") >= 1) { |
|
|
var data = json_label_names.AIFIRE[0]; |
|
|
var data_zh_tw = json_label_names_zh_tw.AIFIRE[0]; |
|
|
var data_ja_jp = json_label_names_ja_jp.AIFIRE[0]; |
|
|
var data_it_it = json_label_names_it_it.AIFIRE[0]; |
|
|
for (var key in data) { |
|
|
if (data.hasOwnProperty(key)) { |
|
|
if (data[key] != "_s") { |
|
|
var label_names = data[key]; |
|
|
if (label_names == translate_name) { |
|
|
var label_names_zh_tw = data_zh_tw[key]; |
|
|
var label_names_ja_jp = data_ja_jp[key]; |
|
|
var label_names_it_it = data_it_it[key]; |
|
|
if (G_LANG == "zh_tw") |
|
|
translate_name = label_names_zh_tw; |
|
|
else if (G_LANG == "ja_jp") |
|
|
translate_name = label_names_ja_jp; |
|
|
else if (G_LANG == "it_it") |
|
|
translate_name = label_names_it_it; |
|
|
break; |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
if (localStorage.getItem("dataset_ver").search("IAERO") >= 1) { |
|
|
var data = json_label_names.AIAERO[0]; |
|
|
var data_zh_tw = json_label_names_zh_tw.AIAERO[0]; |
|
|
var data_ja_jp = json_label_names_ja_jp.AIAERO[0]; |
|
|
var data_it_it = json_label_names_it_it.AIAERO[0]; |
|
|
for (var key in data) { |
|
|
if (data.hasOwnProperty(key)) { |
|
|
if (data[key] != "_s") { |
|
|
var label_names = data[key]; |
|
|
if (label_names == translate_name) { |
|
|
var label_names_zh_tw = data_zh_tw[key]; |
|
|
var label_names_ja_jp = data_ja_jp[key]; |
|
|
var label_names_it_it = data_it_it[key]; |
|
|
if (G_LANG == "zh_tw") |
|
|
translate_name = label_names_zh_tw; |
|
|
else if (G_LANG == "ja_jp") |
|
|
translate_name = label_names_ja_jp; |
|
|
else if (G_LANG == "it_it") |
|
|
translate_name = label_names_it_it; |
|
|
break; |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
if (localStorage.getItem("dataset_ver").search("ITOF") >= 1) { |
|
|
var data = json_label_names.AITOF[0]; |
|
|
var data_zh_tw = json_label_names_zh_tw.AITOF[0]; |
|
|
var data_ja_jp = json_label_names_ja_jp.AITOF[0]; |
|
|
var data_it_it = json_label_names_it_it.AITOF[0]; |
|
|
for (var key in data) { |
|
|
if (data.hasOwnProperty(key)) { |
|
|
if (data[key] != "_s") { |
|
|
var label_names = data[key]; |
|
|
if (label_names == translate_name) { |
|
|
var label_names_zh_tw = data_zh_tw[key]; |
|
|
var label_names_ja_jp = data_ja_jp[key]; |
|
|
var label_names_it_it = data_it_it[key]; |
|
|
if (G_LANG == "zh_tw") |
|
|
translate_name = label_names_zh_tw; |
|
|
else if (G_LANG == "ja_jp") |
|
|
translate_name = label_names_ja_jp; |
|
|
else if (G_LANG == "it_it") |
|
|
translate_name = label_names_it_it; |
|
|
break; |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
if (localStorage.getItem("dataset_ver").search("UMAN") >= 1) { |
|
|
var data = json_label_names.AIHUMAN[0]; |
|
|
var data_zh_tw = json_label_names_zh_tw.AIHUMAN[0]; |
|
|
var data_ja_jp = json_label_names_ja_jp.AIHUMAN[0]; |
|
|
var data_it_it = json_label_names_it_it.AIHUMAN[0]; |
|
|
for (var key in data) { |
|
|
if (data.hasOwnProperty(key)) { |
|
|
if (data[key] != "_s") { |
|
|
var label_names = data[key]; |
|
|
if (label_names == translate_name) { |
|
|
var label_names_zh_tw = data_zh_tw[key]; |
|
|
var label_names_ja_jp = data_ja_jp[key]; |
|
|
var label_names_it_it = data_it_it[key]; |
|
|
if (G_LANG == "zh_tw") |
|
|
translate_name = label_names_zh_tw; |
|
|
else if (G_LANG == "ja_jp") |
|
|
translate_name = label_names_ja_jp; |
|
|
else if (G_LANG == "it_it") |
|
|
translate_name = label_names_it_it; |
|
|
break; |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
if (localStorage.getItem("dataset_ver").search("ISAFTY") >= 1) { |
|
|
var data = json_label_names.AISAFETY[0]; |
|
|
var data_zh_tw = json_label_names_zh_tw.AISAFETY[0]; |
|
|
var data_ja_jp = json_label_names_ja_jp.AISAFETY[0]; |
|
|
var data_it_it = json_label_names_it_it.AISAFETY[0]; |
|
|
for (var key in data) { |
|
|
if (data.hasOwnProperty(key)) { |
|
|
if (data[key] != "_s") { |
|
|
var label_names = data[key]; |
|
|
if (label_names == translate_name) { |
|
|
var label_names_zh_tw = data_zh_tw[key]; |
|
|
var label_names_ja_jp = data_ja_jp[key]; |
|
|
var label_names_it_it = data_it_it[key]; |
|
|
if (G_LANG == "zh_tw") |
|
|
translate_name = label_names_zh_tw; |
|
|
else if (G_LANG == "ja_jp") |
|
|
translate_name = label_names_ja_jp; |
|
|
else if (G_LANG == "it_it") |
|
|
translate_name = label_names_it_it; |
|
|
break; |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
if (localStorage.getItem("dataset_ver").search("IPRODUCTION") >= 1) { |
|
|
var data = json_label_names.AIPRODUCTION[0]; |
|
|
var data_zh_tw = json_label_names_zh_tw.AIPRODUCTION[0]; |
|
|
var data_ja_jp = json_label_names_ja_jp.AIPRODUCTION[0]; |
|
|
var data_it_it = json_label_names_it_it.AIPRODUCTION[0]; |
|
|
for (var key in data) { |
|
|
if (data.hasOwnProperty(key)) { |
|
|
if (data[key] != "_s") { |
|
|
var label_names = data[key]; |
|
|
if (label_names == translate_name) { |
|
|
var label_names_zh_tw = data_zh_tw[key]; |
|
|
var label_names_ja_jp = data_ja_jp[key]; |
|
|
var label_names_it_it = data_it_it[key]; |
|
|
if (G_LANG == "zh_tw") |
|
|
translate_name = label_names_zh_tw; |
|
|
else if (G_LANG == "ja_jp") |
|
|
translate_name = label_names_ja_jp; |
|
|
else if (G_LANG == "it_it") |
|
|
translate_name = label_names_it_it; |
|
|
break; |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
|
|
|
if (localStorage.getItem("dataset_ver").search("ISHIP") >= 1) { |
|
|
var data = json_label_names.AISHIP[0]; |
|
|
var data_zh_tw = json_label_names_zh_tw.AISHIP[0]; |
|
|
var data_ja_jp = json_label_names_ja_jp.AISHIP[0]; |
|
|
var data_it_it = json_label_names_it_it.AISHIP[0]; |
|
|
for (var key in data) { |
|
|
if (data.hasOwnProperty(key)) { |
|
|
if (data[key] != "_s") { |
|
|
var label_names = data[key]; |
|
|
if (label_names == translate_name) { |
|
|
var label_names_zh_tw = data_zh_tw[key]; |
|
|
var label_names_ja_jp = data_ja_jp[key]; |
|
|
var label_names_it_it = data_it_it[key]; |
|
|
if (G_LANG == "zh_tw") |
|
|
translate_name = label_names_zh_tw; |
|
|
else if (G_LANG == "ja_jp") |
|
|
translate_name = label_names_ja_jp; |
|
|
else if (G_LANG == "it_it") |
|
|
translate_name = label_names_it_it; |
|
|
break; |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
|
|
|
if (localStorage.getItem("license_type").search("LPR") >= 1) { |
|
|
var data = json_label_names.AIANPR[0]; |
|
|
var data_zh_tw = json_label_names_zh_tw.AIANPR[0]; |
|
|
var data_ja_jp = json_label_names_ja_jp.AIANPR[0]; |
|
|
var data_it_it = json_label_names_it_it.AIANPR[0]; |
|
|
for (var key in data) { |
|
|
if (data.hasOwnProperty(key)) { |
|
|
if (data[key] != "_s") { |
|
|
var label_names = data[key]; |
|
|
if (label_names == translate_name) { |
|
|
var label_names_zh_tw = data_zh_tw[key]; |
|
|
var label_names_ja_jp = data_ja_jp[key]; |
|
|
var label_names_it_it = data_it_it[key]; |
|
|
if (G_LANG == "zh_tw") |
|
|
translate_name = label_names_zh_tw; |
|
|
else if (G_LANG == "ja_jp") |
|
|
translate_name = label_names_ja_jp; |
|
|
else if (G_LANG == "it_it") |
|
|
translate_name = label_names_it_it; |
|
|
break; |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
|
|
|
if (localStorage.getItem("dataset_ver").search("IAML") >= 1) { |
|
|
var data = json_label_names.AIAML[0]; |
|
|
var data_zh_tw = json_label_names_zh_tw.AIAML[0]; |
|
|
var data_ja_jp = json_label_names_ja_jp.AIAML[0]; |
|
|
var data_it_it = json_label_names_it_it.AIAML[0]; |
|
|
for (var key in data) { |
|
|
if (data.hasOwnProperty(key)) { |
|
|
if (data[key] != "_s") { |
|
|
var label_names = data[key]; |
|
|
if (label_names == translate_name) { |
|
|
var label_names_zh_tw = data_zh_tw[key]; |
|
|
var label_names_ja_jp = data_ja_jp[key]; |
|
|
var label_names_it_it = data_it_it[key]; |
|
|
if (G_LANG == "zh_tw") |
|
|
translate_name = label_names_zh_tw; |
|
|
else if (G_LANG == "ja_jp") |
|
|
translate_name = label_names_ja_jp; |
|
|
else if (G_LANG == "it_it") |
|
|
translate_name = label_names_it_it; |
|
|
break; |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
if (localStorage.getItem("dataset_ver").search("IFRONTBACK") >= 1) { |
|
|
var data = json_label_names.AIFRONTBACK[0]; |
|
|
var data_zh_tw = json_label_names_zh_tw.AIFRONTBACK[0]; |
|
|
var data_ja_jp = json_label_names_ja_jp.AIFRONTBACK[0]; |
|
|
var data_it_it = json_label_names_it_it.AIFRONTBACK[0]; |
|
|
for (var key in data) { |
|
|
if (data.hasOwnProperty(key)) { |
|
|
if (data[key] != "_s") { |
|
|
var label_names = data[key]; |
|
|
if (label_names == translate_name) { |
|
|
var label_names_zh_tw = data_zh_tw[key]; |
|
|
var label_names_ja_jp = data_ja_jp[key]; |
|
|
var label_names_it_it = data_it_it[key]; |
|
|
if (G_LANG == "zh_tw") |
|
|
translate_name = label_names_zh_tw; |
|
|
else if (G_LANG == "ja_jp") |
|
|
translate_name = label_names_ja_jp; |
|
|
else if (G_LANG == "it_it") |
|
|
translate_name = label_names_it_it; |
|
|
break; |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
if (localStorage.getItem("dataset_ver").search("IRAIL") >= 1) { |
|
|
var data = json_label_names.AIRAILWAY[0]; |
|
|
var data_zh_tw = json_label_names_zh_tw.AIRAILWAY[0]; |
|
|
var data_ja_jp = json_label_names_ja_jp.AIRAILWAY[0]; |
|
|
var data_it_it = json_label_names_it_it.AIRAILWAY[0]; |
|
|
for (var key in data) { |
|
|
if (data.hasOwnProperty(key)) { |
|
|
if (data[key] != "_s") { |
|
|
var label_names = data[key]; |
|
|
if (label_names == translate_name) { |
|
|
var label_names_zh_tw = data_zh_tw[key]; |
|
|
var label_names_ja_jp = data_ja_jp[key]; |
|
|
var label_names_it_it = data_it_it[key]; |
|
|
if (G_LANG == "zh_tw") |
|
|
translate_name = label_names_zh_tw; |
|
|
else if (G_LANG == "ja_jp") |
|
|
translate_name = label_names_ja_jp; |
|
|
else if (G_LANG == "it_it") |
|
|
translate_name = label_names_it_it; |
|
|
break; |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
if (localStorage.getItem("dataset_ver").search("ISPORTS") >= 1) { |
|
|
var data = json_label_names.AISPORTS[0]; |
|
|
var data_zh_tw = json_label_names_zh_tw.AISPORTS[0]; |
|
|
var data_ja_jp = json_label_names_ja_jp.AISPORTS[0]; |
|
|
var data_it_it = json_label_names_it_it.AISPORTS[0]; |
|
|
for (var key in data) { |
|
|
if (data.hasOwnProperty(key)) { |
|
|
if (data[key] != "_s") { |
|
|
var label_names = data[key]; |
|
|
if (label_names == translate_name) { |
|
|
var label_names_zh_tw = data_zh_tw[key]; |
|
|
var label_names_ja_jp = data_ja_jp[key]; |
|
|
var label_names_it_it = data_it_it[key]; |
|
|
if (G_LANG == "zh_tw") |
|
|
translate_name = label_names_zh_tw; |
|
|
else if (G_LANG == "ja_jp") |
|
|
translate_name = label_names_ja_jp; |
|
|
else if (G_LANG == "it_it") |
|
|
translate_name = label_names_it_it; |
|
|
break; |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
|
|
|
if (localStorage.getItem("dataset_ver").search("IFACE") >= 1) { |
|
|
var data = json_label_names.AIFACE[0]; |
|
|
var data_zh_tw = json_label_names_zh_tw.AIFACE[0]; |
|
|
var data_ja_jp = json_label_names_ja_jp.AIFACE[0]; |
|
|
var data_it_it = json_label_names_it_it.AIFACE[0]; |
|
|
for (var key in data) { |
|
|
if (data.hasOwnProperty(key)) { |
|
|
if (data[key] != "_s") { |
|
|
var label_names = data[key]; |
|
|
if (label_names == translate_name) { |
|
|
var label_names_zh_tw = data_zh_tw[key]; |
|
|
var label_names_ja_jp = data_ja_jp[key]; |
|
|
var label_names_it_it = data_it_it[key]; |
|
|
if (G_LANG == "zh_tw") |
|
|
translate_name = label_names_zh_tw; |
|
|
else if (G_LANG == "ja_jp") |
|
|
translate_name = label_names_ja_jp; |
|
|
else if (G_LANG == "it_it") |
|
|
translate_name = label_names_it_it; |
|
|
break; |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
|
|
|
if (localStorage.getItem("dataset_ver").search("IGARBAGE") >= 1) { |
|
|
var data = json_label_names.AIGARBAGE[0]; |
|
|
var data_zh_tw = json_label_names_zh_tw.AIGARBAGE[0]; |
|
|
var data_ja_jp = json_label_names_ja_jp.AIGARBAGE[0]; |
|
|
var data_it_it = json_label_names_it_it.AIGARBAGE[0]; |
|
|
for (var key in data) { |
|
|
if (data.hasOwnProperty(key)) { |
|
|
if (data[key] != "_s") { |
|
|
var label_names = data[key]; |
|
|
if (label_names == translate_name) { |
|
|
var label_names_zh_tw = data_zh_tw[key]; |
|
|
var label_names_ja_jp = data_ja_jp[key]; |
|
|
var label_names_it_it = data_it_it[key]; |
|
|
if (G_LANG == "zh_tw") |
|
|
translate_name = label_names_zh_tw; |
|
|
else if (G_LANG == "ja_jp") |
|
|
translate_name = label_names_ja_jp; |
|
|
else if (G_LANG == "it_it") |
|
|
translate_name = label_names_it_it; |
|
|
break; |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
|
|
|
if (localStorage.getItem("dataset_ver").search("IGENDER") >= 1) { |
|
|
var data = json_label_names.AIGENDER[0]; |
|
|
var data_zh_tw = json_label_names_zh_tw.AIGENDER[0]; |
|
|
var data_ja_jp = json_label_names_ja_jp.AIGENDER[0]; |
|
|
var data_it_it = json_label_names_it_it.AIGENDER[0]; |
|
|
for (var key in data) { |
|
|
if (data.hasOwnProperty(key)) { |
|
|
if (data[key] != "_s") { |
|
|
var label_names = data[key]; |
|
|
if (label_names == translate_name) { |
|
|
var label_names_zh_tw = data_zh_tw[key]; |
|
|
var label_names_ja_jp = data_ja_jp[key]; |
|
|
var label_names_it_it = data_it_it[key]; |
|
|
if (G_LANG == "zh_tw") |
|
|
translate_name = label_names_zh_tw; |
|
|
else if (G_LANG == "ja_jp") |
|
|
translate_name = label_names_ja_jp; |
|
|
else if (G_LANG == "it_it") |
|
|
translate_name = label_names_it_it; |
|
|
break; |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
|
|
|
return translate_name; |
|
|
} |