Fix eslint violations (#2416)

* Add more JS libraries to eslintignore

* eslint . --fix

Automatic fixes only

* frame.js: eslint fixes

* events.js: manual eslint fixes

* skin.js: manual eslint fixes

* watch.js: manual eslint fixes

* Remove some tabs used for indentation in JS

* state.js: Fix new-cap eslint violation

* Disable guard-for-in eslint rule to get everything passing
This commit is contained in:
Matt N 2019-01-18 07:00:55 -08:00 committed by Isaac Connor
parent 6bb5aa1b87
commit deaf651aad
19 changed files with 197 additions and 202 deletions

View File

@ -1,4 +1,15 @@
*.min.js
# libraries
web/api/lib
web/skins/classic/js/jquery-1.11.3.js
web/includes/csrf/csrf-magic.js
web/js/videojs.zoomrotate.js
web/skins/classic/js/bootstrap.js
web/skins/classic/js/chosen
web/skins/classic/js/dateTimePicker
web/skins/classic/js/jquery-*.js
web/skins/classic/js/jquery-ui-*
web/skins/classic/js/jquery.js
web/skins/classic/js/moment.js
web/skins/classic/js/video.js
web/tools/mootools

View File

@ -9,6 +9,7 @@ module.exports = {
"brace-style": "off",
"camelcase": "off",
"comma-dangle": "off",
"guard-for-in": "off",
"key-spacing": "off",
"max-len": "off",
"new-cap": ["error", {

View File

@ -1,10 +1,10 @@
'use strict';
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _createClass = function() { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function(Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
var Server = function () {
var Server = function() {
function Server(json) {
_classCallCheck(this, Server);

View File

@ -220,16 +220,16 @@ function refreshWindow() {
function refreshParentWindow() {
if ( refreshParent ) {
if ( window.opener ) {
if ( refreshParent == true )
if ( refreshParent == true )
window.opener.location.reload( true );
else
else
window.opener.location.href = refreshParent;
}
}
}
if ( currentView != 'none' && currentView != 'login' ) {
$j.ajaxSetup ({timeout: AJAX_TIMEOUT }); //sets timeout for all getJSON.
$j.ajaxSetup({timeout: AJAX_TIMEOUT }); //sets timeout for all getJSON.
$j(document).ready(function() {
if ($j('.navbar').length) {
@ -355,19 +355,19 @@ if ( closePopup ) {
window.addEvent( 'domready', checkSize );
function convertLabelFormat(LabelFormat, monitorName){
//convert label format from strftime to moment's format (modified from
//https://raw.githubusercontent.com/benjaminoakes/moment-strftime/master/lib/moment-strftime.js
//added %f and %N below (TODO: add %Q)
var replacements = { a: 'ddd', A: 'dddd', b: 'MMM', B: 'MMMM', d: 'DD', e: 'D', F: 'YYYY-MM-DD', H: 'HH', I: 'hh', j: 'DDDD', k: 'H', l: 'h', m: 'MM', M: 'mm', p: 'A', S: 'ss', u: 'E', w: 'd', W: 'WW', y: 'YY', Y: 'YYYY', z: 'ZZ', Z: 'z', 'f': 'SS', 'N': "["+monitorName+"]", '%': '%' };
var momentLabelFormat = Object.keys(replacements).reduce(function (momentFormat, key) {
var value = replacements[key];
return momentFormat.replace("%" + key, value);
}, LabelFormat);
return momentLabelFormat;
function convertLabelFormat(LabelFormat, monitorName) {
//convert label format from strftime to moment's format (modified from
//https://raw.githubusercontent.com/benjaminoakes/moment-strftime/master/lib/moment-strftime.js
//added %f and %N below (TODO: add %Q)
var replacements = { "a": 'ddd', "A": 'dddd', "b": 'MMM', "B": 'MMMM', "d": 'DD', "e": 'D', "F": 'YYYY-MM-DD', "H": 'HH', "I": 'hh', "j": 'DDDD', "k": 'H', "l": 'h', "m": 'MM', "M": 'mm', "p": 'A', "S": 'ss', "u": 'E', "w": 'd', "W": 'WW', "y": 'YY', "Y": 'YYYY', "z": 'ZZ', "Z": 'z', 'f': 'SS', 'N': "["+monitorName+"]", '%': '%' };
var momentLabelFormat = Object.keys(replacements).reduce(function(momentFormat, key) {
var value = replacements[key];
return momentFormat.replace("%" + key, value);
}, LabelFormat);
return momentLabelFormat;
}
function addVideoTimingTrack(video, LabelFormat, monitorName, duration, startTime){
function addVideoTimingTrack(video, LabelFormat, monitorName, duration, startTime) {
//This is a hacky way to handle changing the texttrack. If we ever upgrade vjs in a revamp replace this. Old method preserved because it's the right way.
var cues = vid.textTracks()[0].cues();
var labelFormat = convertLabelFormat(LabelFormat, monitorName);
@ -409,14 +409,14 @@ function endOfResize(e) {
resizeTimer = setTimeout(changeScale, 250);
}
function scaleToFit (baseWidth, baseHeight, scaleEl, bottomEl) {
$j(window).on('resize', endOfResize) //set delayed scaling when Scale to Fit is selected
function scaleToFit(baseWidth, baseHeight, scaleEl, bottomEl) {
$j(window).on('resize', endOfResize); //set delayed scaling when Scale to Fit is selected
var ratio = baseWidth / baseHeight;
var container = $j('#content');
var viewPort = $j(window);
// jquery does not provide a bottom offet, and offset dows not include margins. outerHeight true minus false gives total vertical margins.
var bottomLoc = bottomEl.offset().top + (bottomEl.outerHeight(true) - bottomEl.outerHeight()) + bottomEl.outerHeight(true);
var newHeight = viewPort.height() - (bottomLoc - scaleEl.outerHeight(true))
var newHeight = viewPort.height() - (bottomLoc - scaleEl.outerHeight(true));
var newWidth = ratio * newHeight;
if (newWidth > container.innerWidth()) {
newWidth = container.innerWidth();
@ -426,7 +426,7 @@ function scaleToFit (baseWidth, baseHeight, scaleEl, bottomEl) {
var scales = $j('#scale option').map(function() {return parseInt($j(this).val());}).get();
scales.shift();
var closest;
$j(scales).each(function () { //Set zms scale to nearest regular scale. Zoom does not like arbitrary scale values.
$j(scales).each(function() { //Set zms scale to nearest regular scale. Zoom does not like arbitrary scale values.
if (closest == null || Math.abs(this - autoScale) < Math.abs(closest - autoScale)) {
closest = this.valueOf();
}

View File

@ -36,7 +36,7 @@ function parseStreams( Streams ) {
}
results_div.innerHTML = '';
var html = '';
for( i in Streams ) {
var stream = Streams[i];
if ( stream.url ) {
@ -53,7 +53,7 @@ function parseStreams( Streams ) {
//console.log(stream);
}
} // end for eah Stream
results_div.innerHTML = html;
}
@ -77,7 +77,7 @@ function addMonitor(url) {
}
createPopup( popup_url, 'zmMonitor'+mid, 'monitor' );
}
function import_csv( form ) {
var formData = new FormData( form );
console.log(formData);

View File

@ -22,7 +22,7 @@ function setButtonStates( element ) {
form.deleteBtn.disabled = false;
form.selectBtn.disabled = false;
if ( checked == 1 ) {
$j(form.cloneBtn).css('display','inline');
$j(form.cloneBtn).css('display', 'inline');
} else {
form.cloneBtn.hide();
}
@ -39,7 +39,6 @@ function addMonitor(element) {
}
function cloneMonitor(element) {
var form = element.form;
var dupParam;
var monitorId=-1;
@ -66,7 +65,7 @@ function editMonitor( element ) {
var monitorIds = Array();
for ( var i = 0; i < form.elements.length; i++ ) {
if (
if (
form.elements[i].type == "checkbox"
&&
form.elements[i].name == "markMids[]"
@ -82,8 +81,8 @@ function editMonitor( element ) {
} // end foreach checkboxes
if ( monitorIds.length == 1 )
createPopup( '?view=monitor&mid='+monitorIds[0], 'zmMonitor'+monitorIds[0], 'monitor' );
else if ( monitorIds.length > 1 )
createPopup( '?view=monitors&'+(monitorIds.map(function(mid){return 'mids[]='+mid;}).join('&')), 'zmMonitors', 'monitors' );
else if ( monitorIds.length > 1 )
createPopup( '?view=monitors&'+(monitorIds.map(function(mid) {return 'mids[]='+mid;}).join('&')), 'zmMonitors', 'monitors' );
}
function deleteMonitor( element ) {

View File

@ -25,7 +25,7 @@ function vjsReplay() {
var messageP = $j(".vjsMessage");
var x = setInterval(function() {
var now = new Date().getTime();
var remainder = new Date(Math.round(gapDuration - now)).toISOString().substr(11,8);
var remainder = new Date(Math.round(gapDuration - now)).toISOString().substr(11, 8);
messageP.html(remainder + ' to next event.');
if (remainder < 0) {
clearInterval(x);
@ -40,21 +40,21 @@ function vjsReplay() {
}
}
$j.ajaxSetup ({timeout: AJAX_TIMEOUT }); //sets timeout for all getJSON.
$j.ajaxSetup({timeout: AJAX_TIMEOUT }); //sets timeout for all getJSON.
var cueFrames = null; //make cueFrames available even if we don't send another ajax query
function initialAlarmCues (eventId) {
function initialAlarmCues(eventId) {
$j.getJSON(thisUrl + '?view=request&request=status&entity=frames&id=' + eventId, setAlarmCues); //get frames data for alarmCues and inserts into html
}
function setAlarmCues (data) {
function setAlarmCues(data) {
cueFrames = data.frames;
alarmSpans = renderAlarmCues(vid ? $j("#videoobj") : $j("#evtStream"));//use videojs width or zms width
$j(".alarmCue").html(alarmSpans);
}
function renderAlarmCues (containerEl) {
function renderAlarmCues(containerEl) {
if ( !( cueFrames && cueFrames.length ) ) {
console.log("No cue frames for event");
return;
@ -81,7 +81,7 @@ var num_cueFrames = cueFrames.length;
var pix = cueRatio * spanTime;
pixSkew += pix - Math.round(pix);//average out the rounding errors.
pix = Math.round(pix);
if ((pixSkew > 1 || pixSkew < -1) && pix + Math.round(pixSkew) > 0) { //add skew if it's a pixel and won't zero out span.
if ((pixSkew > 1 || pixSkew < -1) && pix + Math.round(pixSkew) > 0) { //add skew if it's a pixel and won't zero out span.
pix += Math.round(pixSkew);
pixSkew = pixSkew - Math.round(pixSkew);
}
@ -443,16 +443,16 @@ function streamNext(action) {
}
}
function vjsPanZoom (action, x, y) { //Pan and zoom with centering where the click occurs
function vjsPanZoom(action, x, y) { //Pan and zoom with centering where the click occurs
var outer = $j('#videoobj');
var video = outer.children().first();
var zoom = parseFloat($j('#zoomValue').html());
var zoom = parseFloat($j('#zoomValue').html());
var zoomRate = .5;
var matrix = video.css('transform').split(',');
var currentPanX = parseFloat(matrix[4]);
var currentPanY = parseFloat(matrix[5]);
var xDist = outer.width()/2 - x //Click distance from center of view
var yDist = outer.height()/2 - y
var xDist = outer.width()/2 - x; //Click distance from center of view
var yDist = outer.height()/2 - y;
if (action == 'zoomOut') {
zoom -= zoomRate;
if (x && y) {
@ -479,8 +479,8 @@ function vjsPanZoom (action, x, y) { //Pan and zoom with centering where the cli
}
var limitX = ((zoom*outer.width()) - outer.width())/2; //Calculate outer bounds of video
var limitY = ((zoom*outer.height()) - outer.height())/2;
x = Math.min(Math.max((x),-limitX),limitX); //Limit pan to outer bounds of video
y = Math.min(Math.max((y),-limitY),limitY);
x = Math.min(Math.max((x), -limitX), limitX); //Limit pan to outer bounds of video
y = Math.min(Math.max((y), -limitY), limitY);
video.css('transform', 'matrix('+zoom+', 0, 0, '+zoom+', '+x+', '+y+')');
}
@ -965,11 +965,11 @@ function updateProgressBar() {
} // end function updateProgressBar()
// Handles seeking when clicking on the progress bar.
function progressBarNav (){
$j('#progressBar').click(function(e){
function progressBarNav() {
$j('#progressBar').click(function(e) {
var x = e.pageX - $j(this).offset().left;
var seekTime = (x / $j('#progressBar').width()) * parseFloat(eventData.Length);
streamSeek (seekTime);
streamSeek(seekTime);
});
}
@ -1002,8 +1002,8 @@ function initPage() {
vid.on('ended', vjsReplay);
vid.on('play', vjsPlay);
vid.on('pause', vjsPause);
vid.on('click', function(event){handleClick(event);});
vid.on('timeupdate', function (){$j('#progressValue').html(secsToTime(Math.floor(vid.currentTime())))});
vid.on('click', function(event) {handleClick(event);});
vid.on('timeupdate', function() {$j('#progressValue').html(secsToTime(Math.floor(vid.currentTime())));});
if ( rate > 1 ) {
// rate should be 100 = 1x, etc.

View File

@ -121,7 +121,7 @@ function viewEvents( element, name ) {
}
}
if ( events.length > 0 ) {
let filter = '&filter[Query][terms][0][attr]=Id&filter[Query][terms][0][op]=%3D%5B%5D&filter[Query][terms][0][val]='+events.join('%2C');
var filter = '&filter[Query][terms][0][attr]=Id&filter[Query][terms][0][op]=%3D%5B%5D&filter[Query][terms][0][val]='+events.join('%2C');
window.location.href = thisUrl+'?view=event&eid='+events[0]+filter+sortQuery+'&page=1&play=1';
}
}
@ -148,7 +148,7 @@ if ( openFilterWindow ) {
location.replace( '?view='+currentView+'&page='+thisPage+filterQuery );
}
function initPage () {
function initPage() {
if (window.history.length == 1) {
$j('#controls').children().eq(0).html('');
}

View File

@ -1,4 +1,4 @@
function validateForm ( form ) {
function validateForm( form ) {
var rows = $j(form).find('tbody').eq(0).find('tr');
var obrCount = 0;
var cbrCount = 0;
@ -58,7 +58,7 @@ function updateButtons(element) {
}
}
function checkValue ( element ) {
function checkValue( element ) {
var rows = $j(element).closest('tbody').children();
parseRows(rows);
//clearValue(element);
@ -102,7 +102,7 @@ function deleteFilter( element, name ) {
}
}
function parseRows (rows) {
function parseRows(rows) {
for (var rowNum = 0; rowNum < rows.length; rowNum++) { //Each row is a term
var queryPrefix = 'filter[Query][terms][';
var inputTds = rows.eq(rowNum).children();
@ -111,7 +111,7 @@ function parseRows (rows) {
if (rowNum > 0) { //add and/or to 1+
var cnjVal = inputTds.eq(0).children().val();
var conjSelect = $j('<select></select>').attr('name', queryPrefix + rowNum + '][cnj]').attr('id', queryPrefix + rowNum + '][cnj]');
$j.each(conjTypes, function (i) {
$j.each(conjTypes, function(i) {
conjSelect.append('<option value="' + i + '" >' + i + '</option>');
});
inputTds.eq(0).html(conjSelect).children().val(cnjVal === undefined ? 'and' : cnjVal);
@ -152,7 +152,6 @@ function parseRows (rows) {
}
var archiveVal = inputTds.eq(4).children().val();
inputTds.eq(4).html(archiveSelect).children().val(archiveVal).chosen({width: "101%"});
} else if ( attr.indexOf('Weekday') >= 0 ) { //Weekday selection
var weekdaySelect = $j('<select></select>').attr('name', queryPrefix + rowNum + '][val]').attr('id', queryPrefix + rowNum + '][val]');
for (var i = 0; i < weekdays.length; i++) {
@ -160,7 +159,6 @@ function parseRows (rows) {
}
var weekdayVal = inputTds.eq(4).children().val();
inputTds.eq(4).html(weekdaySelect).children().val(weekdayVal).chosen({width: "101%"});
} else if ( attr == 'StateId' ) { //Run state
var stateSelect = $j('<select></select>').attr('name', queryPrefix + rowNum + '][val]').attr('id', queryPrefix + rowNum + '][val]');
for (var key in states) {
@ -168,7 +166,6 @@ function parseRows (rows) {
}
var stateVal = inputTds.eq(4).children().val();
inputTds.eq(4).html(stateSelect).children().val(stateVal).chosen({width: "101%"});
} else if ( attr == 'ServerId' || attr == 'MonitorServerId' || attr == 'StorageServerId' || attr == 'FilterServerId' ) { //Select Server
var serverSelect = $j('<select></select>').attr('name', queryPrefix + rowNum + '][val]').attr('id', queryPrefix + rowNum + '][val]');
for (var key in servers) {
@ -176,7 +173,6 @@ function parseRows (rows) {
}
var serverVal = inputTds.eq(4).children().val();
inputTds.eq(4).html(serverSelect).children().val(serverVal).chosen({width: "101%"});
} else if ( attr == 'StorageId' ) { //Choose by storagearea
var storageSelect = $j('<select></select>').attr('name', queryPrefix + rowNum + '][val]').attr('id', queryPrefix + rowNum + '][val]');
for ( key in storageareas ) {
@ -184,7 +180,6 @@ function parseRows (rows) {
}
var storageVal = inputTds.eq(4).children().val();
inputTds.eq(4).html(storageSelect).children().val(storageVal).chosen({width: "101%"});
} else if ( attr == 'MonitorName' ) { //Monitor names
var monitorSelect = $j('<select></select>').attr('name', queryPrefix + rowNum + '][val]').attr('id', queryPrefix + rowNum + '][val]');
for (var key in monitors) {
@ -211,7 +206,7 @@ function parseRows (rows) {
inputTds.eq(4).children().timepicker({timeFormat: "HH:mm:ss", constrainInput: false});
}
attr = inputTds.find("[name$='attr\\]']") // Set attr list id and name
attr = inputTds.find("[name$='attr\\]']"); // Set attr list id and name
var term = attr.attr('name').split(/[[\]]{1,2}/);
term.length--;
term.shift();
@ -222,7 +217,7 @@ function parseRows (rows) {
history.replaceState(null, null, '?view=filter&' + $j('#contentForm').serialize());
}
function stringFilter (term) {
function stringFilter(term) {
var termString = '';
term.forEach(function(item) {
termString += '[' + item + ']';
@ -235,7 +230,7 @@ function addTerm( element ) {
row.find('select').chosen("destroy");
var newRow = row.clone().insertAfter(row);
row.find('select').chosen({width: "101%"});
newRow.find('select').each( function () { //reset new row to default
newRow.find('select').each( function() { //reset new row to default
this[0].selected = 'selected';
}).chosen({width: "101%"});
newRow.find('input[type="text"]').val('');

View File

@ -1,18 +1,18 @@
function changeScale() {
let scale = $j('#scale').val();
let img = $j('#frameImg');
let controlsLinks = {
next: $j('#nextLink'),
prev: $j('#prevLink'),
first: $j('#firstLink'),
last: $j('#lastLink')
}
var scale = $j('#scale').val();
var img = $j('#frameImg');
var controlsLinks = {
next: $j('#nextLink'),
prev: $j('#prevLink'),
first: $j('#firstLink'),
last: $j('#lastLink')
};
if ( img ) {
let baseWidth = $j('#base_width').val();
let baseHeight = $j('#base_height').val();
var baseWidth = $j('#base_width').val();
var baseHeight = $j('#base_height').val();
if ( scale == 'auto' ) {
let newSize = scaleToFit(baseWidth, baseHeight, img, $j('#controls'));
var newSize = scaleToFit(baseWidth, baseHeight, img, $j('#controls'));
newWidth = newSize.width;
newHeight = newSize.height;
autoScale = newSize.autoScale;
@ -27,7 +27,6 @@ function changeScale() {
Cookie.write( 'zmWatchScale', scale, { duration: 10*365 } );
$j.each(controlsLinks, function(k, anchor) { //Make frames respect scale choices
anchor.prop('href', anchor.prop('href').replace(/scale=.*&/, 'scale=' + scale + '&'));
});
}

View File

@ -13,7 +13,7 @@ function configureButtons( element ) {
if ( form.elements['newGroup[Name]'].value == '' ) {
disabled = true;
}
}
form.saveBtn.disabled = disabled;
}
}

View File

@ -61,7 +61,7 @@ function logResponse( respObj ) {
if ( ( !minLogTime ) || ( log.TimeKey < minLogTime ) )
minLogTime = log.TimeKey;
var row = logTable.push( [{ content: log.DateTime, properties: { style: 'white-space: nowrap' }}, log.Component, log.Server, log.Pid, log.Code, log.Message, log.File, log.Line] );
delete log.Message;
row.tr.store( 'log', log );
if ( log.Level <= -3 )
@ -256,7 +256,6 @@ function updateFilterSelectors() {
}
if ( filter[key] )
selector.set('value', filter[key]);
}
);
}

View File

@ -43,7 +43,7 @@ function Monitor( monitorData ) {
this.onFailure = function( xhr ) {
console.log('onFailure: ' + this.connKey);
console.log(xhr);
if ( ! requestQueue.hasNext("cmdReq"+this.id) ) {
if ( ! requestQueue.hasNext("cmdReq"+this.id) ) {
console.log("Not requeuing because there is one already");
requestQueue.addRequest("cmdReq"+this.id, this.streamCmdReq);
}
@ -132,7 +132,7 @@ function Monitor( monitorData ) {
}
} // end if Ok or not
var streamCmdTimeout = statusRefreshTimeout;
// The idea here is if we are alarmed, do updates faster. However, there is a timeout in the php side which isn't getting modified, so this may cause a problem. Also the server may only be able to update so fast.
// The idea here is if we are alarmed, do updates faster. However, there is a timeout in the php side which isn't getting modified, so this may cause a problem. Also the server may only be able to update so fast.
//if ( this.alarmState == STATE_ALARM || this.alarmState == STATE_ALERT ) {
//streamCmdTimeout = streamCmdTimeout/5;
//}
@ -165,7 +165,6 @@ function Monitor( monitorData ) {
console.log("queueing for " + this.id + " " + this.connKey );
requestQueue.addRequest( "cmdReq"+this.id, this.streamCmdReq );
}
}
function selectLayout( element ) {
@ -187,18 +186,18 @@ function selectLayout( element ) {
// Apply default layout options, like float left
if ( layout.Positions['default'] ) {
styles = layout.Positions['default'];
styles = layout.Positions['default'];
for ( style in styles ) {
monitor_frame.css(style, styles[style]);
monitor_frame.css(style, styles[style]);
}
} else {
console.log("No default styles to apply" + layout.Positions);
} // end if default styles
if ( layout.Positions['mId'+monitor.id] ) {
styles = layout.Positions['mId'+monitor.id];
styles = layout.Positions['mId'+monitor.id];
for ( style in styles ) {
monitor_frame.css(style, styles[style]);
monitor_frame.css(style, styles[style]);
console.log("Applying " + style + ' : ' + styles[style] );
}
} else {
@ -221,7 +220,7 @@ if ( 1 ) {
if ( streamImg ) {
if ( streamImg.nodeName == 'IMG' ) {
var src = streamImg.src;
src = src.replace(/width=[\.\d]+/i,'width=0' );
src = src.replace(/width=[\.\d]+/i, 'width=0' );
if ( src != streamImg.src ) {
streamImg.src='';
streamImg.src = src;
@ -246,7 +245,7 @@ function changeSize() {
for ( var x = 0; x < monitors.length; x++ ) {
var monitor = monitors[x];
// Scale the frame
monitor_frame = $j('#monitorFrame'+monitor.id);
if ( ! monitor_frame ) {
@ -254,18 +253,18 @@ function changeSize() {
continue;
}
if ( width )
monitor_frame.css('width',width+'px');
monitor_frame.css('width', width+'px');
if ( height )
monitor_frame.css('height',height+'px');
/*Stream could be an applet so can't use moo tools*/
monitor_frame.css('height', height+'px');
/*Stream could be an applet so can't use moo tools*/
var streamImg = $( 'liveStream'+monitor.id );
if ( streamImg ) {
if ( streamImg.nodeName == 'IMG' ) {
var src = streamImg.src;
streamImg.src='';
src = src.replace(/width=[\.\d]+/i,'width='+width );
src = src.replace(/height=[\.\d]+/i,'height='+height );
src = src.replace(/rand=\d+/i,'rand='+Math.floor((Math.random() * 1000000) ));
src = src.replace(/width=[\.\d]+/i, 'width='+width );
src = src.replace(/height=[\.\d]+/i, 'height='+height );
src = src.replace(/rand=\d+/i, 'rand='+Math.floor((Math.random() * 1000000) ));
streamImg.src = src;
}
streamImg.style.width = width? width + "px" : null;
@ -308,9 +307,9 @@ function changeScale() {
continue;
}
if ( width )
monitor_frame.css('width',width+'px');
monitor_frame.css('width', width+'px');
if ( height )
monitor_frame.css('height',height+'px');
monitor_frame.css('height', height+'px');
/*Stream could be an applet so can't use moo tools*/
var streamImg = $j('#liveStream'+monitor.id )[0];
if ( streamImg ) {
@ -319,9 +318,9 @@ function changeScale() {
streamImg.src='';
//src = src.replace(/rand=\d+/i,'rand='+Math.floor((Math.random() * 1000000) ));
src = src.replace(/scale=[\.\d]+/i,'scale='+ scale );
src = src.replace(/width=[\.\d]+/i,'width='+newWidth );
src = src.replace(/height=[\.\d]+/i,'height='+newHeight );
src = src.replace(/scale=[\.\d]+/i, 'scale='+ scale );
src = src.replace(/width=[\.\d]+/i, 'width='+newWidth );
src = src.replace(/height=[\.\d]+/i, 'height='+newHeight );
streamImg.src = src;
}
streamImg.style.width = newWidth + "px";
@ -341,9 +340,8 @@ function toGrid(value) {
// Makes monitorFrames draggable.
function edit_layout(button) {
// Turn off the onclick on the image.
for ( var i = 0; i < monitors.length; i++ ) {
var monitor = monitors[i];
monitor_feed = $j('#imageFeed'+monitor.id)[0];
@ -366,7 +364,7 @@ function save_layout(button) {
var monitor = monitors[i];
monitor_frame = $j('#monitorFrame'+monitor.id);
Positions['mId'+monitor.id] = {
Positions['mId'+monitor.id] = {
width: monitor_frame.css('width'),
height: monitor_frame.css('height'),
top: monitor_frame.css('top'),
@ -397,9 +395,8 @@ function reloadWebSite(ndx) {
var monitors = new Array();
function initPage() {
jQuery(document).ready(function(){
jQuery("#hdrbutton").click(function(){
jQuery(document).ready(function() {
jQuery("#hdrbutton").click(function() {
jQuery("#flipMontageHeader").slideToggle("slow");
jQuery("#hdrbutton").toggleClass('glyphicon-menu-down').toggleClass('glyphicon-menu-up');
Cookie.write( 'zmMontageHeaderFlip', jQuery('#hdrbutton').hasClass('glyphicon-menu-up') ? 'up' : 'down', { duration: 10*365 } );
@ -418,7 +415,7 @@ function initPage() {
monitors[i].start( delay );
if ( monitors[i].type == 'WebSite' && interval > 0 ) {
setInterval(reloadWebSite, interval*1000, i);
}
}
}
selectLayout('#zmMontageLayout');

View File

@ -8,7 +8,7 @@ function evaluateLoadTimes() {
if ( monitorName[i] > "" ) {
if ( monitorLoadEndTimems[i] == 0 ) return; // if we have a monitor with no time yet just wait
if ( start == 0 || start > monitorLoadStartTimems[i] ) start = monitorLoadStartTimems[i];
if ( end == 0 || end < monitorLoadEndTimems[i] ) end = monitorLoadEndTimems[i];
if ( end == 0 || end < monitorLoadEndTimems[i] ) end = monitorLoadEndTimems[i];
}
}
if ( start == 0 || end == 0 ) return; // we really should not get here
@ -25,18 +25,18 @@ function evaluateLoadTimes() {
avgFrac += freeTimeLastIntervals[i];
avgFrac = avgFrac / imageLoadTimesEvaluated;
// The larger this is(positive) the faster we can go
if (avgFrac >= 0.9) currentDisplayInterval = (currentDisplayInterval * 0.50).toFixed(1); // we can go much faster
else if (avgFrac >= 0.8) currentDisplayInterval = (currentDisplayInterval * 0.55).toFixed(1);
else if (avgFrac >= 0.7) currentDisplayInterval = (currentDisplayInterval * 0.60).toFixed(1);
else if (avgFrac >= 0.6) currentDisplayInterval = (currentDisplayInterval * 0.65).toFixed(1);
else if (avgFrac >= 0.5) currentDisplayInterval = (currentDisplayInterval * 0.70).toFixed(1);
else if (avgFrac >= 0.4) currentDisplayInterval = (currentDisplayInterval * 0.80).toFixed(1);
if (avgFrac >= 0.9) currentDisplayInterval = (currentDisplayInterval * 0.50).toFixed(1); // we can go much faster
else if (avgFrac >= 0.8) currentDisplayInterval = (currentDisplayInterval * 0.55).toFixed(1);
else if (avgFrac >= 0.7) currentDisplayInterval = (currentDisplayInterval * 0.60).toFixed(1);
else if (avgFrac >= 0.6) currentDisplayInterval = (currentDisplayInterval * 0.65).toFixed(1);
else if (avgFrac >= 0.5) currentDisplayInterval = (currentDisplayInterval * 0.70).toFixed(1);
else if (avgFrac >= 0.4) currentDisplayInterval = (currentDisplayInterval * 0.80).toFixed(1);
else if (avgFrac >= 0.35) currentDisplayInterval = (currentDisplayInterval * 0.90).toFixed(1);
else if (avgFrac >= 0.3) currentDisplayInterval = (currentDisplayInterval * 1.00).toFixed(1);
else if (avgFrac >= 0.3) currentDisplayInterval = (currentDisplayInterval * 1.00).toFixed(1);
else if (avgFrac >= 0.25) currentDisplayInterval = (currentDisplayInterval * 1.20).toFixed(1);
else if (avgFrac >= 0.2) currentDisplayInterval = (currentDisplayInterval * 1.50).toFixed(1);
else if (avgFrac >= 0.1) currentDisplayInterval = (currentDisplayInterval * 2.00).toFixed(1);
else currentDisplayInterval = (currentDisplayInterval * 2.50).toFixed(1);
else if (avgFrac >= 0.2) currentDisplayInterval = (currentDisplayInterval * 1.50).toFixed(1);
else if (avgFrac >= 0.1) currentDisplayInterval = (currentDisplayInterval * 2.00).toFixed(1);
else currentDisplayInterval = (currentDisplayInterval * 2.50).toFixed(1);
// limit this from about 40fps to .1 fps
currentDisplayInterval = Math.min(Math.max(currentDisplayInterval, 40), 10000);
imageLoadTimesEvaluated=0;
@ -51,7 +51,7 @@ function getFrame( monId, time ) {
Event = events[event_id];
if ( Event.MonitorId != monId || Event.StartTimeSecs > time || Event.EndTimeSecs < time )
continue;
var duration = Event.EndTimeSecs - Event.StartTimeSecs;
if ( ! Event.FramesById ) {
console.log("No FramesById for event " + event_id);
@ -67,15 +67,15 @@ console.log("Found frame for time " + time );
console.log(Frame);
Frame = Event.FramesById[frame_id];
break;
}
}
frame --;
continue;
}
if (
Event.FramesById[frame_id].TimeStampSecs == time
|| (
Event.FramesById[frame_id].TimeStampSecs < time
&& (
Event.FramesById[frame_id].TimeStampSecs < time
&& (
(!Event.FramesById[frame_id].NextTimeStampSecs)
||
(Event.FramesById[frame_id].NextTimeStampSecs > time)
@ -110,7 +110,7 @@ function getImageSource( monId, time ) {
var Frame = getFrame(monId, time);
if ( Frame ) {
// Adjust for bulk frames
var frame_id;
var frame_id;
if ( Frame.NextFrameId ) {
var duration = Frame.NextTimeStampSecs - Frame.TimeStampSecs;
frame_id = Frame.FrameId + parseInt( (Frame.NextFrameId-Frame.FrameId) * ( time-Frame.TimeStampSecs )/duration );
@ -124,9 +124,9 @@ function getImageSource( monId, time ) {
// monitorServerId may be 0, which gives us the default Server entry
var server = storage.ServerId ? Servers[storage.ServerId] : Servers[monitorServerId[monId]];
return server.PathToIndex +
'?view=image&eid=' + Frame.EventId + '&fid='+Frame.FrameId +
"&width=" + monitorCanvasObj[monId].width +
"&height=" + monitorCanvasObj[monId].height;
'?view=image&eid=' + Frame.EventId + '&fid='+Frame.FrameId +
"&width=" + monitorCanvasObj[monId].width +
"&height=" + monitorCanvasObj[monId].height;
} // end found Frame
return '';
//return "no data";
@ -182,7 +182,7 @@ function loadNoData( monId ) {
canvasCtx.font = "600 " + textSize.toString() + "px Arial";
canvasCtx.fillStyle="black";
var textWidth = canvasCtx.measureText(text).width;
canvasCtx.fillText(text,canvasObj.width/2 - textWidth/2,canvasObj.height/2);
canvasCtx.fillText(text, canvasObj.width/2 - textWidth/2, canvasObj.height/2);
} else {
console.log("No monId in loadNoData");
}
@ -197,13 +197,13 @@ function writeText( monId, text ) {
canvasCtx.font = "600 " + textSize.toString() + "px Arial";
canvasCtx.fillStyle="white";
var textWidth = canvasCtx.measureText(text).width;
canvasCtx.fillText(text,canvasObj.width/2 - textWidth/2,canvasObj.height/2);
canvasCtx.fillText(text, canvasObj.width/2 - textWidth/2, canvasObj.height/2);
} else {
console.log("No monId in loadNoData");
}
}
// Either draws the
// Either draws the
function loadImage2Monitor( monId, url ) {
if ( monitorLoading[monId] && monitorImageObject[monId].src != url ) {
// never queue the same image twice (if it's loading it has to be defined, right?
@ -260,7 +260,7 @@ function drawSliderOnGraph(val) {
var labfont = labelpx + "px"; // set this like below row labels
if ( numMonitors > 0 ) {
// if we have no data to display don't do the slider itself
// if we have no data to display don't do the slider itself
var sliderX = parseInt( (val - minTimeSecs) / rangeTimeSecs * cWidth - sliderWidth/2); // position left side of slider
if ( sliderX < 0 ) sliderX = 0;
if ( sliderX+sliderWidth > cWidth )
@ -269,7 +269,7 @@ function drawSliderOnGraph(val) {
// If we have data already saved first restore it from LAST time
if ( typeof underSlider !== 'undefined' ) {
ctx.putImageData(underSlider,underSliderX, 0, 0, 0, sliderWidth, sliderHeight);
ctx.putImageData(underSlider, underSliderX, 0, 0, 0, sliderWidth, sliderHeight);
underSlider = undefined;
}
if ( liveMode == 0 ) {
@ -280,7 +280,7 @@ function drawSliderOnGraph(val) {
ctx.lineWidth = sliderLineWidth;
ctx.strokeStyle = 'black';
// looks like strokes are on the outside (or could be) so shrink it by the line width so we replace all the pixels
ctx.strokeRect(sliderX+sliderLineWidth,sliderLineWidth,sliderWidth - 2*sliderLineWidth, sliderHeight - 2*sliderLineWidth);
ctx.strokeRect(sliderX+sliderLineWidth, sliderLineWidth, sliderWidth - 2*sliderLineWidth, sliderHeight - 2*sliderLineWidth);
underSliderX = sliderX;
}
var o = $('scruboutput');
@ -341,7 +341,7 @@ function drawSliderOnGraph(val) {
}
function drawGraph() {
var divWidth=$('timelinediv').clientWidth
var divWidth=$('timelinediv').clientWidth;
canvas.width = cWidth = divWidth; // Let it float and determine width (it should be sized a bit smaller percentage of window)
cHeight = parseInt(window.innerHeight * 0.10);
if ( cHeight < numMonitors * 20 ) {
@ -356,7 +356,7 @@ function drawGraph() {
ctx.fillStyle="white";
var t="No data found in range - choose differently";
var l=ctx.measureText(t).width;
ctx.fillText(t,(cWidth - l)/2, cHeight-10);
ctx.fillText(t, (cWidth - l)/2, cHeight-10);
underSlider=undefined;
return;
}
@ -369,24 +369,24 @@ function drawGraph() {
// round low end down
var x1 = parseInt((Event.StartTimeSecs - minTimeSecs) / rangeTimeSecs * cWidth);
var x2 = parseInt((Event.EndTimeSecs - minTimeSecs) / rangeTimeSecs * cWidth + 0.5 ) ; // round high end up to be sure consecutive ones connect
var x2 = parseInt((Event.EndTimeSecs - minTimeSecs) / rangeTimeSecs * cWidth + 0.5 ); // round high end up to be sure consecutive ones connect
ctx.fillStyle = monitorColour[Event.MonitorId];
ctx.globalAlpha = 0.2; // light color for background
ctx.clearRect(x1,monitorIndex[Event.MonitorId]*rowHeight,x2-x1,rowHeight); // Erase any overlap so it doesn't look artificially darker
ctx.fillRect(x1,monitorIndex[Event.MonitorId]*rowHeight,x2-x1,rowHeight);
ctx.clearRect(x1, monitorIndex[Event.MonitorId]*rowHeight, x2-x1, rowHeight); // Erase any overlap so it doesn't look artificially darker
ctx.fillRect(x1, monitorIndex[Event.MonitorId]*rowHeight, x2-x1, rowHeight);
for ( var frame_id in Event.FramesById ) {
var Frame = Event.FramesById[frame_id];
if ( ! Frame.Score )
continue;
// Now put in scored frames (if any)
var x1=parseInt( (Frame.TimeStampSecs - minTimeSecs) / rangeTimeSecs * cWidth) ; // round low end down
var x2=parseInt( (Frame.TimeStampSecs - minTimeSecs) / rangeTimeSecs * cWidth + 0.5 ) ; // round up
var x1=parseInt( (Frame.TimeStampSecs - minTimeSecs) / rangeTimeSecs * cWidth); // round low end down
var x2=parseInt( (Frame.TimeStampSecs - minTimeSecs) / rangeTimeSecs * cWidth + 0.5 ); // round up
if(x2-x1 < 2) x2=x1+2; // So it is visible make them all at least this number of seconds wide
ctx.fillStyle=monitorColour[Event.MonitorId];
ctx.globalAlpha = 0.4 + 0.6 * (1 - Frame.Score/maxScore); // Background is scaled but even lowest is twice as dark as the background
ctx.fillRect(x1,monitorIndex[Event.MonitorId]*rowHeight,x2-x1,rowHeight);
ctx.fillRect(x1, monitorIndex[Event.MonitorId]*rowHeight, x2-x1, rowHeight);
} // end foreach frame
} // end foreach Event
@ -415,8 +415,7 @@ function redrawScreen() {
$('panleft').style.display="none";
$('panright').style.display="none";
if ($('downloadVideo')) $('downloadVideo').style.display="none";
} else {
} else {
// switch out of liveview mode
$('DateTimeDiv').style.display="inline";
$('DateTimeDiv').style.display="inline-flex";
@ -443,15 +442,15 @@ function redrawScreen() {
var vw=window.innerWidth;
var pos=$('monitors').getPosition();
var mh=(vh - pos.y - $('fps').getSize().y);
$('monitors').setStyle('height',mh.toString() + "px"); // leave a small gap at bottom
if(maxfit2($('monitors').getSize().x,$('monitors').getSize().y) == 0) /// if we fail to fix we back out of fit mode -- ??? This may need some better handling
$('monitors').setStyle('height', mh.toString() + "px"); // leave a small gap at bottom
if(maxfit2($('monitors').getSize().x, $('monitors').getSize().y) == 0) /// if we fail to fix we back out of fit mode -- ??? This may need some better handling
fitMode=1-fitMode;
} else {
// switch out of fit mode
// if we fit, then monitors were absolutely positioned already (or will be) otherwise release them to float
for( var i=0; i<numMonitors; i++ )
monitorCanvasObj[monitorPtr[i]].style.position="";
$('monitors').setStyle('height',"auto");
$('monitors').setStyle('height', "auto");
$('ScaleDiv').style.display="inline";
$('ScaleDiv').style.display="inline-flex";
$('fit').innerHTML="Fit";
@ -464,15 +463,15 @@ function redrawScreen() {
function outputUpdate(time) {
drawSliderOnGraph(time);
for ( var i=0; i < numMonitors; i++ ) {
var src = getImageSource(monitorPtr[i],time);
var src = getImageSource(monitorPtr[i], time);
//console.log("New image src: " + src);
loadImage2Monitor(monitorPtr[i],src);
loadImage2Monitor(monitorPtr[i], src);
}
currentTimeSecs = time;
}
/// Found this here: http://stackoverflow.com/questions/55677/how-do-i-get-the-coordinates-of-a-mouse-click-on-a-canvas-element
function relMouseCoords(event){
function relMouseCoords(event) {
var totalOffsetX = 0;
var totalOffsetY = 0;
var canvasX = 0;
@ -487,7 +486,7 @@ function relMouseCoords(event){
canvasX = event.pageX - totalOffsetX;
canvasY = event.pageY - totalOffsetY;
return {x:canvasX, y:canvasY}
return {x:canvasX, y:canvasY};
}
HTMLCanvasElement.prototype.relMouseCoords = relMouseCoords;
@ -495,8 +494,8 @@ HTMLCanvasElement.prototype.relMouseCoords = relMouseCoords;
var mouseisdown=false;
function mdown(event) {mouseisdown=true; mmove(event);}
function mup(event) {mouseisdown=false;}
function mout(event) {mouseisdown=false;} // if we go outside treat it as release
function mup(event) {mouseisdown=false;}
function mout(event) {mouseisdown=false;} // if we go outside treat it as release
function tmove(event) {mouseisdown=true; mmove(event);}
function mmove(event) {
@ -512,7 +511,7 @@ function secs2inputstr(s) {
console.log("Invalid value for " + s + " seconds");
return '';
}
var m = moment(s*1000);
if ( ! m ) {
console.log("No valid date for " + s + " seconds");
@ -582,7 +581,6 @@ function setLive(value) {
// The section below are to reload this program with new parameters
function clicknav(minSecs, maxSecs, live) {// we use the current time if we can
var date = new Date();
var now = Math.floor(date.getTime() / 1000);
var tz_difference = (-1 * date.getTimezoneOffset() * 60) - server_utc_offset;
@ -641,33 +639,33 @@ function click_zoomin() {
rangeTimeSecs = parseInt(rangeTimeSecs / 2);
minTimeSecs = parseInt(currentTimeSecs - rangeTimeSecs/2); // this is the slider current time, we center on that
maxTimeSecs = parseInt(currentTimeSecs + rangeTimeSecs/2);
clicknav(minTimeSecs,maxTimeSecs,0);
clicknav(minTimeSecs, maxTimeSecs, 0);
}
function click_zoomout() {
rangeTimeSecs = parseInt(rangeTimeSecs * 2);
minTimeSecs = parseInt(currentTimeSecs - rangeTimeSecs/2); // this is the slider current time, we center on that
maxTimeSecs = parseInt(currentTimeSecs + rangeTimeSecs/2);
clicknav(minTimeSecs,maxTimeSecs,0);
clicknav(minTimeSecs, maxTimeSecs, 0);
}
function click_panleft() {
minTimeSecs = parseInt(minTimeSecs - rangeTimeSecs/2);
maxTimeSecs = minTimeSecs + rangeTimeSecs - 1;
clicknav(minTimeSecs,maxTimeSecs,0);
clicknav(minTimeSecs, maxTimeSecs, 0);
}
function click_panright() {
minTimeSecs = parseInt(minTimeSecs + rangeTimeSecs/2);
maxTimeSecs = minTimeSecs + rangeTimeSecs - 1;
clicknav(minTimeSecs,maxTimeSecs,0);
clicknav(minTimeSecs, maxTimeSecs, 0);
}
function click_download() {
createPopup( '?view=download', 'zmDownload', 'download' );
}
function click_all_events() {
clicknav(0,0,0);
clicknav(0, 0, 0);
}
function allnon() {
clicknav(0,0,0);
clicknav(0, 0, 0);
}
/// >>>>>>>>>>>>>>>>> handles packing different size/aspect monitors on screen <<<<<<<<<<<<<<<<<<<<<<<<
@ -676,7 +674,7 @@ function compSize(a, b) { // sort array by some size parameter - height seems t
var b_value = monitorHeight[b] * monitorWidth[b] * monitorNormalizeScale[b] * monitorZoomScale[b] * monitorNormalizeScale[b] * monitorZoomScale[b];
if ( a_value > b_value ) return -1;
else if ( a_value == b_value ) return 0;
else if ( a_value == b_value ) return 0;
else return 1;
}
@ -694,7 +692,7 @@ function maxfit2(divW, divH) {
var borders=-1;
//monitorPtr.sort(compSize); //Sorts monitors by size in viewport. If enabled makes captions not line up with graphs.
//monitorPtr.sort(compSize); //Sorts monitors by size in viewport. If enabled makes captions not line up with graphs.
while(1) {
if( maxScale - minScale < 0.01 ) break;
@ -710,7 +708,7 @@ function maxfit2(divW, divH) {
// this loop places each monitor (if it can)
var monId = monitorPtr[m];
function doesItFit(x,y,w,h,d) { // does block (w,h) fit at position (x,y) relative to edge and other nodes already done (0..d)
function doesItFit(x, y, w, h, d) { // does block (w,h) fit at position (x,y) relative to edge and other nodes already done (0..d)
if(x+w>=divW) return 0;
if(y+h>=divH) return 0;
for(var i=0; i<=d; i++)
@ -741,7 +739,7 @@ function maxfit2(divW, divH) {
}
}
if ( m == 0 ) { // note for the very first one there were no adjacents so the above loop didn't run
if ( doesItFit(0,0,monitorWidth[monId] * thisScale * monitorNormalizeScale[monId] * monitorZoomScale[monId] + borders, monitorHeight[monId] * thisScale * monitorNormalizeScale[monId] * monitorZoomScale[monId] + borders, -1) == 1 ) {
if ( doesItFit(0, 0, monitorWidth[monId] * thisScale * monitorNormalizeScale[monId] * monitorZoomScale[monId] + borders, monitorHeight[monId] * thisScale * monitorNormalizeScale[monId] * monitorZoomScale[monId] + borders, -1) == 1 ) {
fitX = 0;
fitY = 0;
}
@ -751,7 +749,7 @@ function maxfit2(divW, divH) {
break; // break out of monitor loop flagging we didn't fit
}
thisX[m] =fitX;
thisX2[m]=fitX + monitorWidth[monitorPtr[m]] * thisScale * monitorNormalizeScale[monitorPtr[m]] * monitorZoomScale[monitorPtr[m]] + borders;
thisX2[m]=fitX + monitorWidth[monitorPtr[m]] * thisScale * monitorNormalizeScale[monitorPtr[m]] * monitorZoomScale[monitorPtr[m]] + borders;
thisY[m] =fitY;
thisY2[m]=fitY + monitorHeight[monitorPtr[m]] * thisScale * monitorNormalizeScale[monitorPtr[m]] * monitorZoomScale[monitorPtr[m]] + borders;
thisArea += (thisX2[m] - thisX[m])*(thisY2[m] - thisY[m]);
@ -807,7 +805,7 @@ function showOneMonitor(monId) {
} // end if live/events
}
function zoom(monId,scale) {
function zoom(monId, scale) {
var lastZoomMonPriorScale = monitorZoomScale[monId];
monitorZoomScale[monId] *= scale;
if ( redrawScreen() == 0 ) {// failure here is probably because we zoomed too far
@ -817,14 +815,14 @@ function zoom(monId,scale) {
}
}
function clickMonitor(event,monId) {
function clickMonitor(event, monId) {
var monitor_element = $("Monitor"+monId.toString());
var pos_x = event.offsetX ? (event.offsetX) : event.pageX - monitor_element.offsetLeft;
var pos_y = event.offsetY ? (event.offsetY) : event.pageY - monitor_element.offsetTop;
if ( pos_x < monitor_element.width/4 && pos_y < monitor_element.height/4 )
zoom(monId,1.15);
zoom(monId, 1.15);
else if ( pos_x > monitor_element.width * 3/4 && pos_y < monitor_element.height/4 )
zoom(monId,1/1.15);
zoom(monId, 1/1.15);
else
showOneMonitor(monId);
return;
@ -858,12 +856,11 @@ function changeDateTime(e) {
window.location = uri;
}
// >>>>>>>>> Initialization that runs on window load by being at the bottom
// >>>>>>>>> Initialization that runs on window load by being at the bottom
function initPage() {
jQuery(document).ready(function(){
jQuery("#hdrbutton").click(function(){
jQuery(document).ready(function() {
jQuery("#hdrbutton").click(function() {
jQuery("#flipMontageHeader").slideToggle("slow");
jQuery("#hdrbutton").toggleClass('glyphicon-menu-down').toggleClass('glyphicon-menu-up');
});
@ -879,8 +876,8 @@ function initPage() {
monitorCanvasCtx[monId] = monitorCanvasObj[monId].getContext('2d');
var imageObject = monitorImageObject[monId] = new Image();
imageObject.monId = monId;
imageObject.onload = function() {imagedone(this, this.monId, true )};
imageObject.onerror = function() {imagedone(this, this.monId, false )};
imageObject.onload = function() {imagedone(this, this.monId, true );};
imageObject.onerror = function() {imagedone(this, this.monId, false );};
loadImage2Monitor( monId, monitorImageURL[monId] );
}
}
@ -890,7 +887,7 @@ function initPage() {
drawGraph();
}
setSpeed(speedIndex);
//setFit(fitMode); // will redraw
//setFit(fitMode); // will redraw
//setLive(liveMode); // will redraw
redrawScreen();
$j('#minTime').datetimepicker({
@ -898,7 +895,7 @@ function initPage() {
dateFormat: "yy-mm-dd",
maxDate: +0,
constrainInput: false,
onClose: function (newDate, oldData) {
onClose: function(newDate, oldData) {
if (newDate !== oldData.lastVal) {
changeDateTime();
}
@ -910,13 +907,13 @@ function initPage() {
minDate: $j('#minTime').val(),
maxDate: +0,
constrainInput: false,
onClose: function (newDate, oldData) {
onClose: function(newDate, oldData) {
if (newDate !== oldData.lastVal) {
changeDateTime();
}
}
});
}
window.addEventListener("resize",redrawScreen,{passive:true});
window.addEventListener("resize", redrawScreen, {passive:true});
// Kick everything off
window.addEvent( 'domready', initPage );

View File

@ -34,7 +34,7 @@ function initPage() {
dateFormat: "yy-mm-dd",
maxDate: +0,
constrainInput: false,
onClose: function (newDate, oldData) {
onClose: function(newDate, oldData) {
if (newDate !== oldData.lastVal) {
changeDateTime();
}
@ -46,7 +46,7 @@ function initPage() {
minDate: $j('#minTime').val(),
maxDate: +0,
constrainInput: false,
onClose: function (newDate, oldData) {
onClose: function(newDate, oldData) {
if (newDate !== oldData.lastVal) {
changeDateTime();
}

View File

@ -20,25 +20,25 @@ $j(document).ready(function() {
$j("#btnSave").prop( "disabled", false );
}
});
// Delete a state
$j("#btnDelete").click(function() {
StateStuff( 'delete', $j("#runState").val( ));
stateStuff( 'delete', $j("#runState").val( ));
});
// Save a new state
$j("#btnSave").click(function() {
StateStuff( 'save', undefined, $j("#newState").val() );
stateStuff( 'save', undefined, $j("#newState").val() );
});
// Change state
$j("#btnApply").click(function() {
StateStuff( 'state', $j("#runState").val() );
stateStuff( 'state', $j("#runState").val() );
});
function StateStuff( action, runState, newState ){
function stateStuff( action, runState, newState ) {
var formData = {
'view' : 'console',
'action' : action,
@ -59,7 +59,5 @@ $j(document).ready(function() {
}).done(function(data) {
location.reload();
});
}
});

View File

@ -1,6 +1,6 @@
var events = {};
function showEvent( eid, fid, width, height ) {
function showEvent( eid, fid, width, height ) {
var url = '?view=event&eid='+eid+'&fid='+fid;
url += filterQuery;
window.location.href = url;
@ -89,7 +89,6 @@ function requestFrameData( eventId, frameId ) {
}
function previewEvent(eventId, frameId) {
if ( events[eventId] ) {
var event = events[eventId];
if ( event['frames'] ) {
@ -111,7 +110,7 @@ function loadEventImage( imagePath, eid, fid, width, height, fps, videoName, dur
if ( videoName && vid ) {
vid.show();
imageSrc.hide();
var newsource=imagePath.slice(0,imagePath.lastIndexOf('/'))+'/'+videoName;
var newsource=imagePath.slice(0, imagePath.lastIndexOf('/'))+'/'+videoName;
//console.log(newsource);
//console.log(sources[0].src.slice(-newsource.length));
if ( newsource != vid.currentSrc.slice(-newsource.length) || vid.readyState == 0 ) {
@ -120,11 +119,11 @@ function loadEventImage( imagePath, eid, fid, width, height, fps, videoName, dur
var sources = vid.getElementsByTagName('source');
sources[0].src = newsource;
var tracks = vid.getElementsByTagName('track');
if(tracks.length){
if(tracks.length) {
tracks[0].parentNode.removeChild(tracks[0]);
}
vid.load();
addVideoTimingTrack(vid, Monitor.LabelFormat, Monitor.Name, duration, startTime)
addVideoTimingTrack(vid, Monitor.LabelFormat, Monitor.Name, duration, startTime);
vid.currentTime = fid/fps;
} else {
if ( ! vid.seeking )
@ -135,7 +134,7 @@ function loadEventImage( imagePath, eid, fid, width, height, fps, videoName, dur
imageSrc.show();
imageSrc.setProperty('src', imagePath);
imageSrc.removeEvent('click');
imageSrc.addEvent('click', showEvent.pass([ eid, fid, width, height ]));
imageSrc.addEvent('click', showEvent.pass([eid, fid, width, height]));
}
var eventData = $('eventData');

View File

@ -30,7 +30,7 @@ function changeScale() {
var newWidth;
var newHeight;
if (scale == "auto") {
let newSize = scaleToFit(monitorWidth, monitorHeight, $j('#liveStream'+monitorId), $j('#replayStatus'));
var newSize = scaleToFit(monitorWidth, monitorHeight, $j('#liveStream'+monitorId), $j('#replayStatus'));
newWidth = newSize.width;
newHeight = newSize.height;
autoScale = newSize.autoScale;
@ -123,7 +123,7 @@ if ( monitorType != 'WebSite' ) {
var streamStatus;
function getStreamCmdError(text,error) {
function getStreamCmdError(text, error) {
console.log(error);
// Error are normally due to failed auth. reload the page.
window.location.reload();
@ -231,7 +231,7 @@ function getStreamCmdResponse(respObj, respText) {
if ( 0 ) {
var streamImg = $('liveStream'+monitorId);
if ( streamImg ) {
streamImg.src = streamImg.src.replace(/rand=\d+/i,'rand='+Math.floor((Math.random() * 1000000) ));
streamImg.src = streamImg.src.replace(/rand=\d+/i, 'rand='+Math.floor((Math.random() * 1000000) ));
console.log("Changing livestream src to " + streamImg.src);
} else {
console.log("Unable to find streamImg liveStream");
@ -501,26 +501,26 @@ function getEventCmdResponse( respObj, respText ) {
var cells = row.getElements( 'td' );
var link = new Element( 'a', { 'href': '#', 'events': { 'click': createEventPopup.pass( [ event.Id, '&filter[Query][terms][0][attr]=MonitorId&filter[Query][terms][0][op]=%3d&filter[Query][terms][0][val]='+monitorId+'&page=1&popup=1', event.Width, event.Height ] ) } });
var link = new Element( 'a', { 'href': '#', 'events': { 'click': createEventPopup.pass( [event.Id, '&filter[Query][terms][0][attr]=MonitorId&filter[Query][terms][0][op]=%3d&filter[Query][terms][0][val]='+monitorId+'&page=1&popup=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, '&filter[Query][terms][0][attr]=MonitorId&filter[Query][terms][0][op]=%3d&filter[Query][terms][0][val]='+monitorId+'&page=1&popup=1', event.Width, event.Height ] ) } });
link = new Element( 'a', { 'href': '#', 'events': { 'click': createEventPopup.pass( [event.Id, '&filter[Query][terms][0][attr]=MonitorId&filter[Query][terms][0][op]=%3d&filter[Query][terms][0][val]='+monitorId+'&page=1&popup=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 = 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 = 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' ) );
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 ) } });
link = new Element( 'a', { 'href': '#', 'title': deleteString, 'events': { 'click': function( e ) { deleteEvent( e, event.Id ); }, 'mouseover': highlightRow.pass( row ), 'mouseout': highlightRow.pass( row ) } });
link.set( 'text', 'X' );
link.inject( row.getElement( 'td.colDelete' ) );
@ -628,7 +628,7 @@ function controlCmdImage( x, y ) {
}
function fetchImage( streamImage ) {
streamImage.src = streamImage.src.replace(/rand=\d+/i,'rand='+Math.floor((Math.random() * 1000000) ));
streamImage.src = streamImage.src.replace(/rand=\d+/i, 'rand='+Math.floor((Math.random() * 1000000) ));
}
function handleClick( event ) {

View File

@ -382,9 +382,9 @@ function drawZonePoints() {
div.addEvent( 'mouseover', highlightOn.pass( i ) );
div.addEvent( 'mouseout', highlightOff.pass( i ) );
div.inject( $('imageFrame') );
div.makeDraggable( {
div.makeDraggable( {
'container': $('imageFrame'),
'onStart': setActivePoint.pass( i ),
'onStart': setActivePoint.pass( i ),
'onComplete': fixActivePoint.pass( i ),
'onDrag': updateActivePoint.pass( i )
} );
@ -592,7 +592,7 @@ function statusCmdQuery() {
}
function fetchImage( streamImage ) {
streamImage.src = streamImage.src.replace(/rand=\d+/i,'rand='+Math.floor((Math.random() * 1000000) ));
streamImage.src = streamImage.src.replace(/rand=\d+/i, 'rand='+Math.floor((Math.random() * 1000000) ));
}
function appletRefresh() {