2016-09-27 23:51:55 +08:00
|
|
|
function setButtonState( element, butClass ) {
|
|
|
|
element.className = butClass;
|
|
|
|
element.disabled = (butClass != 'inactive');
|
|
|
|
}
|
2009-05-08 18:04:12 +08:00
|
|
|
|
2016-09-27 23:51:55 +08:00
|
|
|
function showEvents() {
|
|
|
|
$('ptzControls').addClass( 'hidden' );
|
|
|
|
$('events').removeClass( 'hidden' );
|
|
|
|
if ( $('eventsControl') )
|
|
|
|
$('eventsControl').addClass('hidden');
|
|
|
|
if ( $('controlControl') )
|
|
|
|
$('controlControl').removeClass('hidden');
|
|
|
|
showMode = "events";
|
|
|
|
}
|
|
|
|
|
|
|
|
function showPtzControls() {
|
|
|
|
$('events').addClass( 'hidden' );
|
|
|
|
$('ptzControls').removeClass( 'hidden' );
|
|
|
|
if ( $('eventsControl') )
|
|
|
|
$('eventsControl').removeClass('hidden');
|
|
|
|
if ( $('controlControl') )
|
|
|
|
$('controlControl').addClass('hidden');
|
|
|
|
showMode = "control";
|
|
|
|
}
|
|
|
|
|
|
|
|
function changeScale() {
|
|
|
|
var scale = $('scale').get('value');
|
2017-11-21 03:25:13 +08:00
|
|
|
var newWidth;
|
|
|
|
var newHeight;
|
|
|
|
if (scale == "auto") {
|
2017-11-22 11:46:45 +08:00
|
|
|
let newSize = scaleToFit(monitorWidth, monitorHeight, $j('#liveStream'+monitorId), $j('#replayStatus'));
|
2017-11-21 03:25:13 +08:00
|
|
|
newWidth = newSize.width;
|
|
|
|
newHeight = newSize.height;
|
|
|
|
autoScale = newSize.autoScale;
|
|
|
|
} else {
|
|
|
|
$j(window).off('resize', endOfResize); //remove resize handler when Scale to Fit is not active
|
|
|
|
newWidth = monitorWidth * scale / SCALE_BASE;
|
|
|
|
newHeight = monitorHeight * scale / SCALE_BASE;
|
|
|
|
}
|
|
|
|
|
2016-09-27 23:51:55 +08:00
|
|
|
|
|
|
|
Cookie.write( 'zmWatchScale'+monitorId, scale, { duration: 10*365 } );
|
|
|
|
|
2017-05-19 01:50:56 +08:00
|
|
|
/*Stream could be an applet so can't use moo tools*/
|
2017-08-04 00:41:43 +08:00
|
|
|
var streamImg = $('liveStream'+monitorId);
|
2016-09-27 23:51:55 +08:00
|
|
|
if ( streamImg ) {
|
|
|
|
streamImg.style.width = newWidth + "px";
|
|
|
|
streamImg.style.height = newHeight + "px";
|
|
|
|
|
2017-11-21 03:25:13 +08:00
|
|
|
streamImg.src = streamImg.src.replace(/scale=\d+/i, 'scale='+(scale== 'auto' ? autoScale : scale));
|
2016-09-27 23:51:55 +08:00
|
|
|
} else {
|
|
|
|
console.error("No element found for liveStream.");
|
|
|
|
}
|
2008-07-14 21:54:50 +08:00
|
|
|
}
|
|
|
|
|
|
|
|
var alarmState = STATE_IDLE;
|
|
|
|
var lastAlarmState = STATE_IDLE;
|
|
|
|
|
2016-09-27 23:51:55 +08:00
|
|
|
function setAlarmState( currentAlarmState ) {
|
|
|
|
alarmState = currentAlarmState;
|
|
|
|
|
|
|
|
var stateString = "Unknown";
|
|
|
|
var stateClass = "";
|
|
|
|
if ( alarmState == STATE_ALARM )
|
|
|
|
stateClass = "alarm";
|
|
|
|
else if ( alarmState == STATE_ALERT )
|
|
|
|
stateClass = "alert";
|
|
|
|
$('stateValue').set( 'text', stateStrings[alarmState] );
|
|
|
|
if ( stateClass )
|
|
|
|
$('stateValue').setProperty( 'class', stateClass );
|
|
|
|
else
|
|
|
|
$('stateValue').removeProperty( 'class' );
|
|
|
|
|
|
|
|
var isAlarmed = ( alarmState == STATE_ALARM || alarmState == STATE_ALERT );
|
|
|
|
var wasAlarmed = ( lastAlarmState == STATE_ALARM || lastAlarmState == STATE_ALERT );
|
|
|
|
|
|
|
|
var newAlarm = ( isAlarmed && !wasAlarmed );
|
|
|
|
var oldAlarm = ( !isAlarmed && wasAlarmed );
|
|
|
|
|
|
|
|
if ( newAlarm ) {
|
|
|
|
if ( SOUND_ON_ALARM ) {
|
|
|
|
// Enable the alarm sound
|
|
|
|
if ( !canPlayPauseAudio )
|
|
|
|
$('alarmSound').removeClass( 'hidden' );
|
|
|
|
else
|
|
|
|
$('MediaPlayer').Play();
|
2008-07-16 23:47:33 +08:00
|
|
|
}
|
2016-09-27 23:51:55 +08:00
|
|
|
if ( POPUP_ON_ALARM ) {
|
|
|
|
window.focus();
|
2008-07-16 23:47:33 +08:00
|
|
|
}
|
2016-09-27 23:51:55 +08:00
|
|
|
}
|
|
|
|
if ( SOUND_ON_ALARM ) {
|
|
|
|
if ( oldAlarm ) {
|
|
|
|
// Disable alarm sound
|
|
|
|
if ( !canPlayPauseAudio )
|
|
|
|
$('alarmSound').addClass( 'hidden' );
|
|
|
|
else
|
|
|
|
$('MediaPlayer').Stop();
|
|
|
|
}
|
|
|
|
}
|
|
|
|
if ( oldAlarm) //done with an event do a refresh
|
|
|
|
eventCmdQuery();
|
2009-05-26 02:03:46 +08:00
|
|
|
|
2016-09-27 23:51:55 +08:00
|
|
|
lastAlarmState = alarmState;
|
2008-07-16 23:47:33 +08:00
|
|
|
}
|
|
|
|
|
|
|
|
var streamCmdParms = "view=request&request=stream&connkey="+connKey;
|
2017-05-05 23:53:40 +08:00
|
|
|
if ( auth_hash )
|
|
|
|
streamCmdParms += '&auth='+auth_hash;
|
|
|
|
|
2015-12-02 04:17:25 +08:00
|
|
|
var streamCmdReq = new Request.JSON( { url: monitorUrl+thisUrl, method: 'post', timeout: AJAX_TIMEOUT, link: 'cancel', onSuccess: getStreamCmdResponse } );
|
2008-07-16 23:47:33 +08:00
|
|
|
var streamCmdTimer = null;
|
|
|
|
|
|
|
|
var streamStatus;
|
|
|
|
|
2016-09-27 23:51:55 +08:00
|
|
|
function getStreamCmdResponse( respObj, respText ) {
|
|
|
|
watchdogOk("stream");
|
|
|
|
if ( streamCmdTimer )
|
|
|
|
streamCmdTimer = clearTimeout( streamCmdTimer );
|
2008-07-16 23:47:33 +08:00
|
|
|
|
2016-09-27 23:51:55 +08:00
|
|
|
if ( respObj.result == 'Ok' ) {
|
|
|
|
streamStatus = respObj.status;
|
|
|
|
$('fpsValue').set( 'text', streamStatus.fps );
|
2008-07-16 23:47:33 +08:00
|
|
|
|
2016-09-27 23:51:55 +08:00
|
|
|
setAlarmState( streamStatus.state );
|
2008-07-14 21:54:50 +08:00
|
|
|
|
2016-09-27 23:51:55 +08:00
|
|
|
$('levelValue').set( 'text', streamStatus.level );
|
|
|
|
if ( streamStatus.level > 95 )
|
|
|
|
$('levelValue').className = "alarm";
|
|
|
|
else if ( streamStatus.level > 80 )
|
|
|
|
$('levelValue').className = "alert";
|
|
|
|
else
|
|
|
|
$('levelValue').className = "ok";
|
|
|
|
|
|
|
|
var delayString = secsToTime( streamStatus.delay );
|
|
|
|
|
|
|
|
if ( streamStatus.paused == true ) {
|
|
|
|
$('modeValue').set( 'text', "Paused" );
|
|
|
|
$('rate').addClass( 'hidden' );
|
|
|
|
$('delayValue').set( 'text', delayString );
|
|
|
|
$('delay').removeClass( 'hidden' );
|
|
|
|
$('level').removeClass( 'hidden' );
|
|
|
|
streamCmdPause( false );
|
|
|
|
} else if ( streamStatus.delayed == true ) {
|
|
|
|
$('modeValue').set( 'text', "Replay" );
|
|
|
|
$('rateValue').set( 'text', streamStatus.rate );
|
|
|
|
$('rate').removeClass( 'hidden' );
|
|
|
|
$('delayValue').set( 'text', delayString );
|
|
|
|
$('delay').removeClass( 'hidden' );
|
|
|
|
$('level').removeClass( 'hidden' );
|
|
|
|
if ( streamStatus.rate == 1 ) {
|
|
|
|
streamCmdPlay( false );
|
|
|
|
} else if ( streamStatus.rate > 0 ) {
|
|
|
|
if ( streamStatus.rate < 1 )
|
|
|
|
streamCmdSlowFwd( false );
|
2008-12-06 07:58:58 +08:00
|
|
|
else
|
2016-09-27 23:51:55 +08:00
|
|
|
streamCmdFastFwd( false );
|
|
|
|
} else {
|
|
|
|
if ( streamStatus.rate > -1 )
|
|
|
|
streamCmdSlowRev( false );
|
2008-12-06 07:58:58 +08:00
|
|
|
else
|
2016-09-27 23:51:55 +08:00
|
|
|
streamCmdFastRev( false );
|
|
|
|
} // rate
|
|
|
|
} else {
|
|
|
|
$('modeValue').set( 'text', "Live" );
|
|
|
|
$('rate').addClass( 'hidden' );
|
|
|
|
$('delay').addClass( 'hidden' );
|
|
|
|
$('level').addClass( 'hidden' );
|
|
|
|
streamCmdPlay( false );
|
|
|
|
} // end if paused or delayed
|
|
|
|
|
|
|
|
$('zoomValue').set( 'text', streamStatus.zoom );
|
|
|
|
if ( streamStatus.zoom == "1.0" )
|
|
|
|
setButtonState( $('zoomOutBtn'), 'unavail' );
|
|
|
|
else
|
|
|
|
setButtonState( $('zoomOutBtn'), 'inactive' );
|
|
|
|
|
|
|
|
if ( canEditMonitors ) {
|
|
|
|
if ( streamStatus.enabled ) {
|
|
|
|
$('enableAlarmsLink').addClass( 'hidden' );
|
|
|
|
$('disableAlarmsLink').removeClass( 'hidden' );
|
|
|
|
if ( streamStatus.forced ) {
|
|
|
|
$('forceAlarmLink').addClass( 'hidden' );
|
|
|
|
$('cancelAlarmLink').removeClass( 'hidden' );
|
2016-09-01 00:53:34 +08:00
|
|
|
} else {
|
2016-09-27 23:51:55 +08:00
|
|
|
$('forceAlarmLink').removeClass( 'hidden' );
|
|
|
|
$('cancelAlarmLink').addClass( 'hidden' );
|
2016-09-01 00:53:34 +08:00
|
|
|
}
|
2016-09-27 23:51:55 +08:00
|
|
|
$('forceCancelAlarm').removeClass( 'hidden' );
|
|
|
|
} else {
|
|
|
|
$('enableAlarmsLink').removeClass( 'hidden' );
|
|
|
|
$('disableAlarmsLink').addClass( 'hidden' );
|
|
|
|
$('forceCancelAlarm').addClass( 'hidden' );
|
|
|
|
}
|
|
|
|
$('enableDisableAlarms').removeClass( 'hidden' );
|
|
|
|
} // end if canEditMonitors
|
|
|
|
|
|
|
|
if ( streamStatus.auth ) {
|
|
|
|
console.log("Haev a new auth hash" + streamStatus.auth);
|
|
|
|
// Try to reload the image stream.
|
2017-07-06 02:25:44 +08:00
|
|
|
var streamImg = $('liveStream');
|
2016-09-27 23:51:55 +08:00
|
|
|
if ( streamImg )
|
|
|
|
streamImg.src = streamImg.src.replace( /auth=\w+/i, 'auth='+streamStatus.auth );
|
|
|
|
} // end if haev a new auth hash
|
|
|
|
} else {
|
|
|
|
checkStreamForErrors("getStreamCmdResponse",respObj);//log them
|
|
|
|
// Try to reload the image stream.
|
2017-07-06 02:25:44 +08:00
|
|
|
var streamImg = $('liveStream'+monitorId);
|
2016-09-27 23:51:55 +08:00
|
|
|
if ( streamImg ) {
|
|
|
|
streamImg.src = streamImg.src.replace(/rand=\d+/i,'rand='+Math.floor((Math.random() * 1000000) ));
|
2017-08-04 00:41:43 +08:00
|
|
|
console.log("Changing livestream src to " + streamImg.src);
|
2016-09-27 23:51:55 +08:00
|
|
|
} else {
|
|
|
|
console.log("Unable to find streamImg liveStream");
|
2016-04-05 03:04:09 +08:00
|
|
|
}
|
2016-09-27 23:51:55 +08:00
|
|
|
}
|
2008-07-14 21:54:50 +08:00
|
|
|
|
2016-09-27 23:51:55 +08:00
|
|
|
var streamCmdTimeout = statusRefreshTimeout;
|
|
|
|
if ( alarmState == STATE_ALARM || alarmState == STATE_ALERT )
|
|
|
|
streamCmdTimeout = streamCmdTimeout/5;
|
|
|
|
streamCmdTimer = streamCmdQuery.delay( streamCmdTimeout );
|
2017-05-19 01:50:56 +08:00
|
|
|
}
|
2008-07-14 21:54:50 +08:00
|
|
|
|
2016-09-27 23:51:55 +08:00
|
|
|
function streamCmdPause( action ) {
|
|
|
|
setButtonState( $('pauseBtn'), 'active' );
|
|
|
|
setButtonState( $('playBtn'), 'inactive' );
|
|
|
|
setButtonState( $('stopBtn'), 'inactive' );
|
|
|
|
setButtonState( $('fastFwdBtn'), 'inactive' );
|
|
|
|
setButtonState( $('slowFwdBtn'), 'inactive' );
|
|
|
|
setButtonState( $('slowRevBtn'), 'inactive' );
|
|
|
|
setButtonState( $('fastRevBtn'), 'inactive' );
|
|
|
|
if ( action )
|
|
|
|
streamCmdReq.send( streamCmdParms+"&command="+CMD_PAUSE );
|
|
|
|
}
|
|
|
|
|
|
|
|
function streamCmdPlay( action ) {
|
|
|
|
setButtonState( $('pauseBtn'), 'inactive' );
|
|
|
|
setButtonState( $('playBtn'), 'active' );
|
|
|
|
if ( streamStatus.delayed == true ) {
|
2008-07-14 21:54:50 +08:00
|
|
|
setButtonState( $('stopBtn'), 'inactive' );
|
|
|
|
setButtonState( $('fastFwdBtn'), 'inactive' );
|
|
|
|
setButtonState( $('slowFwdBtn'), 'inactive' );
|
|
|
|
setButtonState( $('slowRevBtn'), 'inactive' );
|
|
|
|
setButtonState( $('fastRevBtn'), 'inactive' );
|
2016-09-27 23:51:55 +08:00
|
|
|
} else {
|
|
|
|
setButtonState( $('stopBtn'), 'unavail' );
|
2008-07-14 21:54:50 +08:00
|
|
|
setButtonState( $('fastFwdBtn'), 'unavail' );
|
|
|
|
setButtonState( $('slowFwdBtn'), 'unavail' );
|
|
|
|
setButtonState( $('slowRevBtn'), 'unavail' );
|
|
|
|
setButtonState( $('fastRevBtn'), 'unavail' );
|
2016-09-27 23:51:55 +08:00
|
|
|
}
|
|
|
|
if ( action )
|
|
|
|
streamCmdReq.send( streamCmdParms+"&command="+CMD_PLAY );
|
|
|
|
}
|
|
|
|
|
|
|
|
function streamCmdStop( action ) {
|
|
|
|
setButtonState( $('pauseBtn'), 'inactive' );
|
|
|
|
setButtonState( $('playBtn'), 'unavail' );
|
|
|
|
setButtonState( $('stopBtn'), 'active' );
|
|
|
|
setButtonState( $('fastFwdBtn'), 'unavail' );
|
|
|
|
setButtonState( $('slowFwdBtn'), 'unavail' );
|
|
|
|
setButtonState( $('slowRevBtn'), 'unavail' );
|
|
|
|
setButtonState( $('fastRevBtn'), 'unavail' );
|
|
|
|
if ( action )
|
|
|
|
streamCmdReq.send( streamCmdParms+"&command="+CMD_STOP );
|
|
|
|
setButtonState( $('stopBtn'), 'unavail' );
|
|
|
|
setButtonState( $('playBtn'), 'active' );
|
|
|
|
}
|
|
|
|
|
|
|
|
function streamCmdFastFwd( action ) {
|
|
|
|
setButtonState( $('pauseBtn'), 'inactive' );
|
|
|
|
setButtonState( $('playBtn'), 'inactive' );
|
|
|
|
setButtonState( $('stopBtn'), 'inactive' );
|
|
|
|
setButtonState( $('fastFwdBtn'), 'inactive' );
|
|
|
|
setButtonState( $('slowFwdBtn'), 'inactive' );
|
|
|
|
setButtonState( $('slowRevBtn'), 'inactive' );
|
|
|
|
setButtonState( $('fastRevBtn'), 'inactive' );
|
|
|
|
if ( action )
|
|
|
|
streamCmdReq.send( streamCmdParms+"&command="+CMD_FASTFWD );
|
|
|
|
}
|
|
|
|
|
|
|
|
function streamCmdSlowFwd( action ) {
|
|
|
|
setButtonState( $('pauseBtn'), 'inactive' );
|
|
|
|
setButtonState( $('playBtn'), 'inactive' );
|
|
|
|
setButtonState( $('stopBtn'), 'inactive' );
|
|
|
|
setButtonState( $('fastFwdBtn'), 'inactive' );
|
|
|
|
setButtonState( $('slowFwdBtn'), 'active' );
|
|
|
|
setButtonState( $('slowRevBtn'), 'inactive' );
|
|
|
|
setButtonState( $('fastRevBtn'), 'inactive' );
|
|
|
|
if ( action )
|
|
|
|
streamCmdReq.send( streamCmdParms+"&command="+CMD_SLOWFWD );
|
|
|
|
setButtonState( $('pauseBtn'), 'active' );
|
|
|
|
setButtonState( $('slowFwdBtn'), 'inactive' );
|
|
|
|
}
|
|
|
|
|
|
|
|
function streamCmdSlowRev( action ) {
|
|
|
|
setButtonState( $('pauseBtn'), 'inactive' );
|
|
|
|
setButtonState( $('playBtn'), 'inactive' );
|
|
|
|
setButtonState( $('stopBtn'), 'inactive' );
|
|
|
|
setButtonState( $('fastFwdBtn'), 'inactive' );
|
|
|
|
setButtonState( $('slowFwdBtn'), 'inactive' );
|
|
|
|
setButtonState( $('slowRevBtn'), 'active' );
|
|
|
|
setButtonState( $('fastRevBtn'), 'inactive' );
|
|
|
|
if ( action )
|
|
|
|
streamCmdReq.send( streamCmdParms+"&command="+CMD_SLOWREV );
|
|
|
|
setButtonState( $('pauseBtn'), 'active' );
|
|
|
|
setButtonState( $('slowRevBtn'), 'inactive' );
|
|
|
|
}
|
|
|
|
|
|
|
|
function streamCmdFastRev( action ) {
|
|
|
|
setButtonState( $('pauseBtn'), 'inactive' );
|
|
|
|
setButtonState( $('playBtn'), 'inactive' );
|
|
|
|
setButtonState( $('stopBtn'), 'inactive' );
|
|
|
|
setButtonState( $('fastFwdBtn'), 'inactive' );
|
|
|
|
setButtonState( $('slowFwdBtn'), 'inactive' );
|
|
|
|
setButtonState( $('slowRevBtn'), 'inactive' );
|
|
|
|
setButtonState( $('fastRevBtn'), 'inactive' );
|
|
|
|
if ( action )
|
|
|
|
streamCmdReq.send( streamCmdParms+"&command="+CMD_FASTREV );
|
|
|
|
}
|
|
|
|
|
|
|
|
function streamCmdZoomIn( x, y ) {
|
|
|
|
streamCmdReq.send( streamCmdParms+"&command="+CMD_ZOOMIN+"&x="+x+"&y="+y );
|
|
|
|
}
|
|
|
|
|
|
|
|
function streamCmdZoomOut() {
|
|
|
|
streamCmdReq.send( streamCmdParms+"&command="+CMD_ZOOMOUT );
|
|
|
|
}
|
|
|
|
|
|
|
|
function streamCmdScale( scale ) {
|
|
|
|
streamCmdReq.send( streamCmdParms+"&command="+CMD_SCALE+"&scale="+scale );
|
|
|
|
}
|
|
|
|
|
|
|
|
function streamCmdPan( x, y ) {
|
|
|
|
streamCmdReq.send( streamCmdParms+"&command="+CMD_PAN+"&x="+x+"&y="+y );
|
|
|
|
}
|
|
|
|
|
|
|
|
function streamCmdQuery() {
|
|
|
|
streamCmdReq.send( streamCmdParms+"&command="+CMD_QUERY );
|
2017-03-18 15:00:51 +08:00
|
|
|
}
|
2008-07-14 21:54:50 +08:00
|
|
|
|
2008-07-16 23:47:33 +08:00
|
|
|
var statusCmdParms = "view=request&request=status&entity=monitor&id="+monitorId+"&element[]=Status&element[]=FrameRate";
|
2017-05-05 23:53:40 +08:00
|
|
|
if ( auth_hash )
|
|
|
|
statusCmdParms += '&auth='+auth_hash;
|
2017-05-06 04:18:12 +08:00
|
|
|
var statusCmdReq = new Request.JSON( { url: monitorUrl+thisUrl, method: 'get', data: statusCmdParms, timeout: AJAX_TIMEOUT, link: 'cancel', onSuccess: getStatusCmdResponse } );
|
2008-07-16 23:47:33 +08:00
|
|
|
var statusCmdTimer = null;
|
|
|
|
|
2016-09-27 23:51:55 +08:00
|
|
|
function getStatusCmdResponse( respObj, respText ) {
|
|
|
|
watchdogOk("status");
|
|
|
|
if ( statusCmdTimer )
|
|
|
|
statusCmdTimer = clearTimeout( statusCmdTimer );
|
|
|
|
|
|
|
|
if ( respObj.result == 'Ok' ) {
|
|
|
|
$('fpsValue').set( 'text', respObj.monitor.FrameRate );
|
|
|
|
setAlarmState( respObj.monitor.Status );
|
2017-05-19 01:50:56 +08:00
|
|
|
} else
|
|
|
|
checkStreamForErrors("getStatusCmdResponse", respObj);
|
2016-09-27 23:51:55 +08:00
|
|
|
|
|
|
|
var statusCmdTimeout = statusRefreshTimeout;
|
|
|
|
if ( alarmState == STATE_ALARM || alarmState == STATE_ALERT )
|
|
|
|
statusCmdTimeout = statusCmdTimeout/5;
|
|
|
|
statusCmdTimer = statusCmdQuery.delay( statusCmdTimeout );
|
2017-03-18 15:00:51 +08:00
|
|
|
}
|
2008-07-16 23:47:33 +08:00
|
|
|
|
2016-09-27 23:51:55 +08:00
|
|
|
function statusCmdQuery() {
|
|
|
|
statusCmdReq.send();
|
2017-03-18 15:00:51 +08:00
|
|
|
}
|
2008-07-16 23:47:33 +08:00
|
|
|
|
2008-07-14 21:54:50 +08:00
|
|
|
var alarmCmdParms = "view=request&request=alarm&id="+monitorId;
|
2017-05-05 23:53:40 +08:00
|
|
|
if ( auth_hash )
|
|
|
|
alarmCmdParms += '&auth='+auth_hash;
|
2017-08-04 00:41:43 +08:00
|
|
|
var alarmCmdReq = new Request.JSON( {
|
|
|
|
url: monitorUrl+thisUrl,
|
|
|
|
method: 'post',
|
|
|
|
timeout: AJAX_TIMEOUT,
|
|
|
|
link: 'cancel',
|
|
|
|
onSuccess: getAlarmCmdResponse,
|
|
|
|
onTimeout: streamCmdQuery
|
|
|
|
} );
|
2008-07-14 21:54:50 +08:00
|
|
|
var alarmCmdFirst = true;
|
|
|
|
|
2016-09-27 23:51:55 +08:00
|
|
|
function getAlarmCmdResponse( respObj, respText ) {
|
2017-05-19 01:50:56 +08:00
|
|
|
checkStreamForErrors("getAlarmCmdResponse", respObj);
|
2008-07-14 21:54:50 +08:00
|
|
|
}
|
|
|
|
|
2016-09-27 23:51:55 +08:00
|
|
|
function cmdDisableAlarms() {
|
|
|
|
alarmCmdReq.send( alarmCmdParms+"&command=disableAlarms" );
|
2008-07-14 21:54:50 +08:00
|
|
|
}
|
|
|
|
|
2016-09-27 23:51:55 +08:00
|
|
|
function cmdEnableAlarms() {
|
|
|
|
alarmCmdReq.send( alarmCmdParms+"&command=enableAlarms" );
|
2008-07-14 21:54:50 +08:00
|
|
|
}
|
|
|
|
|
2016-09-27 23:51:55 +08:00
|
|
|
function cmdForceAlarm() {
|
|
|
|
alarmCmdReq.send( alarmCmdParms+"&command=forceAlarm" );
|
2008-07-14 21:54:50 +08:00
|
|
|
}
|
|
|
|
|
2016-09-27 23:51:55 +08:00
|
|
|
function cmdCancelForcedAlarm() {
|
|
|
|
alarmCmdReq.send( alarmCmdParms+"&command=cancelForcedAlarm" );
|
2017-08-04 00:41:43 +08:00
|
|
|
return false;
|
2008-07-14 21:54:50 +08:00
|
|
|
}
|
|
|
|
|
2016-09-27 23:51:55 +08:00
|
|
|
function getActResponse( respObj, respText ) {
|
|
|
|
if ( respObj.result == 'Ok' ) {
|
|
|
|
if ( respObj.refreshParent ) {
|
2017-08-04 00:41:43 +08:00
|
|
|
console.log('refreshing');
|
2016-09-27 23:51:55 +08:00
|
|
|
window.opener.location.reload();
|
2008-07-14 21:54:50 +08:00
|
|
|
}
|
2016-09-27 23:51:55 +08:00
|
|
|
}
|
|
|
|
eventCmdQuery();
|
2008-07-14 21:54:50 +08:00
|
|
|
}
|
|
|
|
|
2016-09-27 23:51:55 +08:00
|
|
|
function deleteEvent( event, eventId ) {
|
|
|
|
var actParms = "view=request&request=event&action=delete&id="+eventId;
|
|
|
|
var actReq = new Request.JSON( { url: thisUrl, method: 'post', timeout: 3000, data: actParms, onSuccess: getActResponse } );
|
|
|
|
actReq.send();
|
|
|
|
event.stop();
|
2008-07-14 21:54:50 +08:00
|
|
|
}
|
|
|
|
|
|
|
|
var eventCmdParms = "view=request&request=status&entity=events&id="+monitorId+"&count="+maxDisplayEvents+"&sort=Id%20desc";
|
2017-05-05 23:53:40 +08:00
|
|
|
if ( auth_hash )
|
|
|
|
eventCmdParms += '&auth='+auth_hash;
|
2010-03-01 03:16:40 +08:00
|
|
|
var eventCmdReq = new Request.JSON( { url: thisUrl, method: 'post', timeout: AJAX_TIMEOUT, data: eventCmdParms, link: 'cancel', onSuccess: getEventCmdResponse, onTimeout: eventCmdQuery } );
|
2008-07-14 21:54:50 +08:00
|
|
|
var eventCmdTimer = null;
|
|
|
|
var eventCmdFirst = true;
|
|
|
|
|
2016-09-27 23:51:55 +08:00
|
|
|
function highlightRow( row ) {
|
|
|
|
$(row).toggleClass( 'highlight' );
|
|
|
|
}
|
|
|
|
|
|
|
|
function getEventCmdResponse( respObj, respText ) {
|
|
|
|
watchdogOk("event");
|
|
|
|
if ( eventCmdTimer )
|
|
|
|
eventCmdTimer = clearTimeout( eventCmdTimer );
|
|
|
|
|
|
|
|
if ( respObj.result == 'Ok' ) {
|
|
|
|
var dbEvents = respObj.events.reverse();
|
|
|
|
var eventList = $('eventList');
|
|
|
|
var eventListBody = $(eventList).getElement( 'tbody' );
|
|
|
|
var eventListRows = $(eventListBody).getElements( 'tr' );
|
|
|
|
|
|
|
|
eventListRows.each( function( row ) { row.removeClass( 'updated' ); } );
|
|
|
|
|
|
|
|
for ( var i = 0; i < dbEvents.length; i++ ) {
|
|
|
|
var event = dbEvents[i];
|
|
|
|
var row = $('event'+event.Id);
|
|
|
|
var newEvent = (row == null ? true : false);
|
|
|
|
if ( newEvent ) {
|
|
|
|
row = new Element( 'tr', { 'id': 'event'+event.Id } );
|
|
|
|
new Element( 'td', { 'class': 'colId' } ).inject( row );
|
|
|
|
new Element( 'td', { 'class': 'colName' } ).inject( row );
|
|
|
|
new Element( 'td', { 'class': 'colTime' } ).inject( row );
|
|
|
|
new Element( 'td', { 'class': 'colSecs' } ).inject( row );
|
|
|
|
new Element( 'td', { 'class': 'colFrames' } ).inject( row );
|
|
|
|
new Element( 'td', { 'class': 'colScore' } ).inject( row );
|
|
|
|
new Element( 'td', { 'class': 'colDelete' } ).inject( row );
|
|
|
|
|
|
|
|
var cells = row.getElements( 'td' );
|
|
|
|
|
|
|
|
var link = new Element( 'a', { 'href': '#', 'events': { 'click': createEventPopup.pass( [ event.Id, '&trms=1&attr1=MonitorId&op1=%3d&val1='+monitorId+'&page=1', event.Width, event.Height ] ) } });
|
|
|
|
link.set( 'text', event.Id );
|
|
|
|
link.inject( row.getElement( 'td.colId' ) );
|
|
|
|
|
|
|
|
link = new Element( 'a', { 'href': '#', 'events': { 'click': createEventPopup.pass( [ event.Id, '&trms=1&attr1=MonitorId&op1=%3d&val1='+monitorId+'&page=1', event.Width, event.Height ] ) } });
|
|
|
|
link.set( 'text', event.Name );
|
|
|
|
link.inject( row.getElement( 'td.colName' ) );
|
|
|
|
|
|
|
|
row.getElement( 'td.colTime' ).set( 'text', event.StartTime );
|
|
|
|
row.getElement( 'td.colSecs' ).set( 'text', event.Length );
|
|
|
|
|
|
|
|
link = new Element( 'a', { 'href': '#', 'events': { 'click': createFramesPopup.pass( [ event.Id, event.Width, event.Height ] ) } });
|
|
|
|
link.set( 'text', event.Frames+'/'+event.AlarmFrames );
|
|
|
|
link.inject( row.getElement( 'td.colFrames' ) );
|
|
|
|
|
|
|
|
link = new Element( 'a', { 'href': '#', 'events': { 'click': createFramePopup.pass( [ event.Id, '0', event.Width, event.Height ] ) } });
|
|
|
|
link.set( 'text', event.AvgScore+'/'+event.MaxScore );
|
|
|
|
link.inject( row.getElement( 'td.colScore' ) );
|
|
|
|
|
2016-11-09 00:30:44 +08:00
|
|
|
link = new Element( 'a', { 'href': '#', 'title': deleteString, 'events': { 'click': function( e ) { deleteEvent( e, event.Id ); }.bind( link ), 'mouseover': highlightRow.pass( row ), 'mouseout': highlightRow.pass( row ) } });
|
2016-09-27 23:51:55 +08:00
|
|
|
link.set( 'text', 'X' );
|
|
|
|
link.inject( row.getElement( 'td.colDelete' ) );
|
|
|
|
|
|
|
|
if ( i == 0 )
|
|
|
|
row.inject( $(eventListBody) );
|
|
|
|
else {
|
|
|
|
row.inject( $(eventListBody), 'top' );
|
|
|
|
if ( !eventCmdFirst )
|
|
|
|
row.addClass( 'recent' );
|
2008-07-14 21:54:50 +08:00
|
|
|
}
|
2016-09-27 23:51:55 +08:00
|
|
|
} else {
|
|
|
|
row.getElement( 'td.colName a' ).set( 'text', event.Name );
|
|
|
|
row.getElement( 'td.colSecs' ).set( 'text', event.Length );
|
|
|
|
row.getElement( 'td.colFrames a' ).set( 'text', event.Frames+'/'+event.AlarmFrames );
|
|
|
|
row.getElement( 'td.colScore a' ).set( 'text', event.AvgScore+'/'+event.MaxScore );
|
|
|
|
row.removeClass( 'recent' );
|
|
|
|
}
|
|
|
|
row.addClass( 'updated' );
|
|
|
|
}
|
2008-12-06 07:58:58 +08:00
|
|
|
|
2016-09-27 23:51:55 +08:00
|
|
|
var rows = $(eventListBody).getElements( 'tr' );
|
|
|
|
for ( var i = 0; i < rows.length; i++ ) {
|
|
|
|
if ( !rows[i].hasClass( 'updated' ) ) {
|
|
|
|
rows[i].destroy();
|
|
|
|
rows.splice( i, 1 );
|
|
|
|
i--;
|
|
|
|
}
|
2008-07-14 21:54:50 +08:00
|
|
|
}
|
2016-09-27 23:51:55 +08:00
|
|
|
while ( rows.length > maxDisplayEvents ) {
|
|
|
|
rows[rows.length-1].destroy();
|
|
|
|
rows.length--;
|
|
|
|
}
|
|
|
|
} else
|
2017-05-19 01:50:56 +08:00
|
|
|
checkStreamForErrors("getEventCmdResponse", respObj);
|
2008-12-06 07:58:58 +08:00
|
|
|
|
2016-09-27 23:51:55 +08:00
|
|
|
var eventCmdTimeout = eventsRefreshTimeout;
|
|
|
|
if ( alarmState == STATE_ALARM || alarmState == STATE_ALERT )
|
|
|
|
eventCmdTimeout = eventCmdTimeout/5;
|
|
|
|
eventCmdTimer = eventCmdQuery.delay( eventCmdTimeout );
|
|
|
|
eventCmdFirst = false;
|
2008-07-14 21:54:50 +08:00
|
|
|
}
|
|
|
|
|
2016-09-27 23:51:55 +08:00
|
|
|
function eventCmdQuery() {
|
|
|
|
if ( eventCmdTimer ) //avoid firing another if we are firing one
|
|
|
|
eventCmdTimer = clearTimeout( eventCmdTimer );
|
|
|
|
eventCmdReq.send();
|
2008-07-14 21:54:50 +08:00
|
|
|
}
|
|
|
|
|
|
|
|
var controlParms = "view=request&request=control&id="+monitorId;
|
2017-05-05 23:53:40 +08:00
|
|
|
if ( auth_hash )
|
|
|
|
controlParms += '&auth='+auth_hash;
|
2010-03-01 03:16:40 +08:00
|
|
|
var controlReq = new Request.JSON( { url: thisUrl, method: 'post', timeout: AJAX_TIMEOUT, link: 'cancel', onSuccess: getControlResponse } );
|
2008-07-14 21:54:50 +08:00
|
|
|
|
2016-09-27 23:51:55 +08:00
|
|
|
function getControlResponse( respObj, respText ) {
|
|
|
|
if ( !respObj )
|
|
|
|
return;
|
|
|
|
//console.log( respText );
|
|
|
|
if ( respObj.result != 'Ok' ) {
|
|
|
|
alert( "Control response was status = "+respObj.status+"\nmessage = "+respObj.message );
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
function controlCmd( control, event, xtell, ytell ) {
|
|
|
|
var locParms = "";
|
|
|
|
if ( event && (xtell || ytell) ) {
|
|
|
|
var xEvent = new Event( event );
|
|
|
|
var target = xEvent.target;
|
|
|
|
var coords = $(target).getCoordinates();
|
|
|
|
|
|
|
|
var l = coords.left;
|
|
|
|
var t = coords.top;
|
|
|
|
var x = xEvent.page.x - l;
|
|
|
|
var y = xEvent.page.y - t;
|
|
|
|
|
2017-05-19 01:50:56 +08:00
|
|
|
if ( xtell ) {
|
2016-09-27 23:51:55 +08:00
|
|
|
var xge = parseInt( (x*100)/coords.width );
|
|
|
|
if ( xtell == -1 )
|
|
|
|
xge = 100 - xge;
|
|
|
|
else if ( xtell == 2 )
|
|
|
|
xge = 2*(50 - xge);
|
|
|
|
locParms += "&xge="+xge;
|
2008-07-14 21:54:50 +08:00
|
|
|
}
|
2016-09-27 23:51:55 +08:00
|
|
|
if ( ytell ) {
|
|
|
|
var yge = parseInt( (y*100)/coords.height );
|
|
|
|
if ( ytell == -1 )
|
|
|
|
yge = 100 - yge;
|
|
|
|
else if ( ytell == 2 )
|
|
|
|
yge = 2*(50 - yge);
|
|
|
|
locParms += "&yge="+yge;
|
2008-07-14 21:54:50 +08:00
|
|
|
}
|
2016-09-27 23:51:55 +08:00
|
|
|
}
|
|
|
|
controlReq.send( controlParms+"&control="+control+locParms );
|
|
|
|
if ( streamMode == "single" )
|
|
|
|
fetchImage.pass( $('imageFeed').getElement('img') ).delay( 1000 );
|
2008-07-14 21:54:50 +08:00
|
|
|
}
|
|
|
|
|
2016-09-27 23:51:55 +08:00
|
|
|
function controlCmdImage( x, y ) {
|
|
|
|
var imageControlParms = controlParms;
|
|
|
|
imageControlParms += "&scale="+scale;
|
|
|
|
imageControlParms += "&control="+imageControlMode;
|
2008-07-14 21:54:50 +08:00
|
|
|
|
2016-09-27 23:51:55 +08:00
|
|
|
controlReq.send( imageControlParms+"&x="+x+"&y="+y );
|
|
|
|
if ( streamMode == "single" )
|
|
|
|
fetchImage.pass( $('imageFeed').getElement('img') ).delay( 1000 );
|
2008-07-14 21:54:50 +08:00
|
|
|
}
|
|
|
|
|
2016-09-27 23:51:55 +08:00
|
|
|
function fetchImage( streamImage ) {
|
2016-06-21 00:40:33 +08:00
|
|
|
streamImage.src = streamImage.src.replace(/rand=\d+/i,'rand='+Math.floor((Math.random() * 1000000) ));
|
2008-07-14 21:54:50 +08:00
|
|
|
}
|
|
|
|
|
2016-09-27 23:51:55 +08:00
|
|
|
function handleClick( event ) {
|
|
|
|
var target = event.target;
|
|
|
|
var x = event.page.x - $(target).getLeft();
|
|
|
|
var y = event.page.y - $(target).getTop();
|
|
|
|
|
|
|
|
if ( showMode == "events" || !imageControlMode ) {
|
|
|
|
if ( event.shift )
|
|
|
|
streamCmdPan( x, y );
|
2008-07-14 21:54:50 +08:00
|
|
|
else
|
2016-09-27 23:51:55 +08:00
|
|
|
streamCmdZoomIn( x, y );
|
|
|
|
} else {
|
|
|
|
controlCmdImage( x, y );
|
|
|
|
}
|
2008-07-14 21:54:50 +08:00
|
|
|
}
|
|
|
|
|
2016-09-27 23:51:55 +08:00
|
|
|
function appletRefresh() {
|
|
|
|
if ( streamStatus && (!streamStatus.paused && !streamStatus.delayed) ) {
|
|
|
|
var streamImg = $('liveStream');
|
|
|
|
var parent = streamImg.getParent();
|
|
|
|
streamImg.dispose();
|
|
|
|
streamImg.inject( parent );
|
|
|
|
if ( appletRefreshTime )
|
|
|
|
appletRefresh.delay( appletRefreshTime*1000 );
|
|
|
|
} else {
|
|
|
|
appletRefresh.delay( 15*1000 ); //if we are paused or delayed check every 15 seconds if we are live yet...
|
|
|
|
}
|
2009-05-26 02:03:46 +08:00
|
|
|
}
|
|
|
|
|
|
|
|
var watchdogInactive = {
|
2016-09-27 23:51:55 +08:00
|
|
|
'stream': false,
|
|
|
|
'status': false,
|
|
|
|
'event': false
|
2009-05-26 02:03:46 +08:00
|
|
|
};
|
|
|
|
|
|
|
|
var watchdogFunctions = {
|
2016-09-27 23:51:55 +08:00
|
|
|
'stream': streamCmdQuery,
|
|
|
|
'status': statusCmdQuery,
|
|
|
|
'event': eventCmdQuery
|
2009-05-26 02:03:46 +08:00
|
|
|
};
|
|
|
|
|
|
|
|
//Make sure the various refreshes are still taking effect
|
2016-09-27 23:51:55 +08:00
|
|
|
function watchdogCheck( type ) {
|
|
|
|
if ( watchdogInactive[type] ) {
|
|
|
|
console.log( "Detected streamWatch of type: " + type + " stopped, restarting" );
|
|
|
|
watchdogFunctions[type]();
|
2009-05-26 02:03:46 +08:00
|
|
|
watchdogInactive[type] = false;
|
2016-09-27 23:51:55 +08:00
|
|
|
} else {
|
|
|
|
watchdogInactive[type] = true;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
function watchdogOk( type ) {
|
|
|
|
watchdogInactive[type] = false;
|
|
|
|
}
|
|
|
|
|
|
|
|
function initPage() {
|
|
|
|
if ( streamMode == "single" ) {
|
|
|
|
statusCmdTimer = statusCmdQuery.delay( (Math.random()+0.1)*statusRefreshTimeout );
|
|
|
|
watchdogCheck.pass('status').periodical(statusRefreshTimeout*2);
|
|
|
|
} else {
|
|
|
|
streamCmdTimer = streamCmdQuery.delay( (Math.random()+0.1)*statusRefreshTimeout );
|
|
|
|
watchdogCheck.pass('stream').periodical(statusRefreshTimeout*2);
|
|
|
|
}
|
|
|
|
|
|
|
|
eventCmdTimer = eventCmdQuery.delay( (Math.random()+0.1)*statusRefreshTimeout );
|
|
|
|
watchdogCheck.pass('event').periodical(eventsRefreshTimeout*2);
|
|
|
|
|
|
|
|
if ( canStreamNative || streamMode == "single" ) {
|
|
|
|
var streamImg = $('imageFeed').getElement('img');
|
|
|
|
if ( !streamImg )
|
|
|
|
streamImg = $('imageFeed').getElement('object');
|
|
|
|
if ( streamMode == "single" ) {
|
|
|
|
streamImg.addEvent( 'click', fetchImage.pass( streamImg ) );
|
|
|
|
fetchImage.pass( streamImg ).periodical( imageRefreshTimeout );
|
|
|
|
} else
|
|
|
|
streamImg.addEvent( 'click', function( event ) { handleClick( event ); } );
|
|
|
|
}
|
|
|
|
|
|
|
|
if ( refreshApplet && appletRefreshTime )
|
|
|
|
appletRefresh.delay( appletRefreshTime*1000 );
|
2017-11-21 03:25:13 +08:00
|
|
|
if (scale == "auto") changeScale();
|
2008-07-14 21:54:50 +08:00
|
|
|
}
|
|
|
|
|
|
|
|
// Kick everything off
|
|
|
|
window.addEvent( 'domready', initPage );
|