ZaneYork
/
zoneminder
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

deprecate legacy "stills" option from event view

This commit is contained in:
Andrew Bauer 2021-01-10 10:25:22 -06:00 committed by Isaac Connor
parent 5b40589d61
commit a761b9c0ff
2 changed files with 7 additions and 326 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

35
web/skins/classic/views/event.php
View File

@ -275,41 +275,6 @@ echo htmlSelect('rate', $rates, intval($rate), array('id'=>'rateValue'));
<span id="zoom"><?php echo translate('Zoom') ?>: <span id="zoomValue">1</span>x</span>
</div>
</div><!--eventVideo-->
<div id="eventStills" class="hidden">
<div id="eventThumbsPanel">
<div id="eventThumbs">
</div>
</div>
<div id="eventImagePanel">
<div id="eventImageFrame">
<img id="eventImage" src="graphics/transparent.png" alt=""/>
<div id="eventImageBar">
<div id="eventImageClose"><button type="button" data-on-click="hideEventImage"><?php echo translate('Close') ?></button></div>
<div id="eventImageStats" class="hidden"><button type="button" data-on-click="showFrameStats"><?php echo translate('Stats') ?></button></div>
<div id="eventImageData"><?php echo translate('Frame') ?> <span id="eventImageNo"></span></div>
</div>
</div>
</div>
<div id="eventImageNav">
<div id="thumbsSliderPanel">
<div id="alarmCue" class="alarmCue"></div>
<div id="thumbsSlider">
<div id="thumbsKnob">
</div>
</div>
</div>
<div id="eventImageButtons">
<div id="prevButtonsPanel">
<button id="prevEventBtn" type="button" data-on-click="prevEvent" disabled="disabled">&lt;E</button>
<button id="prevThumbsBtn" type="button" data-on-click="prevThumbs" disabled="disabled">&lt;&lt;</button>
<button id="prevImageBtn" type="button" data-on-click="prevImage" disabled="disabled">&lt;</button>
<button id="nextImageBtn" type="button" data-on-click="nextImage" disabled="disabled">&gt;</button>
<button id="nextThumbsBtn" type="button" data-on-click="nextThumbs" disabled="disabled">&gt;&gt;</button>
<button id="nextEventBtn" type="button" data-on-click="nextEvent" disabled="disabled">E&gt;</button>
</div>
</div>
</div>
</div>
<?php
} // end if Event exists
?>

294
web/skins/classic/views/js/event.js
View File

@ -14,8 +14,6 @@ var prevEventStartTime = 0;
var nextEventStartTime = 0;
var PrevEventDefVideoPath = "";
var NextEventDefVideoPath = "";
var slider = null;
var scroll = null;
var currEventId = null;
var CurEventDefVideoPath = null;
var vid = null;
@ -27,8 +25,6 @@ var streamCmdTimer = null;
var streamStatus = null;
var lastEventId = 0;
var zmsBroke = false; //Use alternate navigation if zms has crashed
var frameBatch = 40;
var currFrameId = null;
var auth_hash;
var wasHidden = false;
@ -86,7 +82,8 @@ function vjsReplay() {
function initialAlarmCues(eventId) {
//get frames data for alarmCues and inserts into html
$j.getJSON(thisUrl + '?view=request&request=status&entity=frames&id=' + eventId, setAlarmCues)
$j.getJSON(thisUrl + '?view=request&request=status&entity=frames&id=' + eventId)
.done(setAlarmCues)
.fail(logAjaxFail);
}
@ -180,14 +177,10 @@ function changeScale() {
var newWidth;
var newHeight;
var autoScale;
var eventViewer;
var eventViewer= $j(vid ? '#videoobj' : '#evtStream');
var alarmCue = $j('div.alarmCue');
var bottomEl = streamMode == 'stills' ? $j('#eventImageNav') : $j('#replayStatus');
if ( streamMode == 'stills' ) {
eventViewer = $j('#eventThumbs');
} else {
eventViewer = $j(vid ? '#videoobj' : '#evtStream');
}
var bottomEl = $j('#replayStatus');
if ( scale == '0' || scale == 'auto' ) {
var newSize = scaleToFit(eventData.Width, eventData.Height, eventViewer, bottomEl);
newWidth = newSize.width;
@ -198,20 +191,13 @@ function changeScale() {
newWidth = eventData.Width * scale / SCALE_BASE;
newHeight = eventData.Height * scale / SCALE_BASE;
}
if ( streamMode != 'stills' ) {
eventViewer.width(newWidth);
} // stills handles its own width
eventViewer.height(newHeight);
if ( !vid ) { // zms needs extra sizing
streamScale(scale == '0' ? autoScale : scale);
drawProgressBar();
}
if ( streamMode == 'stills' ) {
slider.autosize();
alarmCue.html(renderAlarmCues($j('#thumbsSliderPanel')));
} else {
alarmCue.html(renderAlarmCues(eventViewer));//just re-render alarmCues. skip ajax call
}
setCookie('zmEventScale'+eventData.MonitorId, scale, 3600);
// After a resize, check if we still have room to display the event stats table
@ -583,11 +569,6 @@ function getEventResponse(respObj, respText) {
}
eventData = respObj.event;
var eventStills = $j('#eventStills');
if ( eventStills && !eventStills.hasClass('hidden') && currEventId != eventData.Id ) {
resetEventStills();
}
currEventId = eventData.Id;
$j('#dataEventId').text( eventData.Id );
@ -652,8 +633,6 @@ function getNearEventsResponse( respObj, respText ) {
PrevEventDefVideoPath = respObj.nearevents.PrevEventDefVideoPath;
NextEventDefVideoPath = respObj.nearevents.NextEventDefVideoPath;
$j('#prevEventBtn').prop('disabled', !prevEventId);
$j('#nextEventBtn').prop('disabled', !nextEventId);
$j('#prevBtn').prop('disabled', prevEventId == 0 ? true : false).attr('class', prevEventId == 0 ? 'unavail' : 'inactive');
$j('#nextBtn').prop('disabled', nextEventId == 0 ? true : false).attr('class', nextEventId == 0 ? 'unavail' : 'inactive');
}
@ -664,117 +643,6 @@ function nearEventsQuery( eventId ) {
.fail(logAjaxFail);
}
function loadEventThumb( event, frame, loadImage ) {
var thumbImg = $j('#eventThumb'+frame.FrameId);
if ( !thumbImg ) {
console.error('No holder found for frame '+frame.FrameId);
return;
}
var img = new Asset.image( imagePrefix+frame.EventId+"&fid="+frame.FrameId,
{
'onload': ( function( loadImage ) {
thumbImg.prop('src', img.prop('src'));
thumbImg.prop('class', frame.Type=='Alarm'?'alarm':'normal');
thumbImg.prop('title', frame.FrameId+' / '+((frame.Type=='Alarm')?frame.Score:0));
thumbImg.removeClass('placeholder');
thumbImg.off('click');
thumbImg.click(function() {
locateImage( frame.FrameId, true );
} );
if ( loadImage ) {
loadEventImage( event, frame );
}
} ).pass( loadImage )
}
);
}
function loadEventImage(event, frame) {
console.debug('Loading '+event.Id+'/'+frame.FrameId);
var eventImg = $j('#eventImage');
var thumbImg = $j('#eventThumb'+frame.FrameId);
if ( eventImg.prop('src') != thumbImg.prop('src') ) {
var eventImagePanel = $j('#eventImagePanel');
if ( eventImagePanel.css('display') != 'none' ) {
var lastThumbImg = $j('#eventThumb' + eventImg.prop('alt'));
lastThumbImg.removeClass('selected');
lastThumbImg.css('opacity', '1.0');
}
$j('#eventImageBar').css('width', event.Width);
if ( frame.Type == 'Alarm' ) {
$j('#eventImageStats').removeClass('hidden');
} else {
$j('#eventImageStats').addClass('hidden');
}
thumbImg.addClass('selected');
thumbImg.css('opacity', '0.5');
if ( eventImagePanel.css('display') == 'none' ) {
eventImagePanel.css('opacity', '0');
eventImagePanel.css('display', 'inline-block');
new Fx.Tween( eventImagePanel, {duration: 500, transition: Fx.Transitions.Sine} ).start( 'opacity', 0, 1 );
}
eventImg.prop( {
'class': frame.Type=='Alarm'?'alarm':'normal',
'src': thumbImg.prop('src'),
'title': thumbImg.prop('title'),
'alt': thumbImg.prop('alt'),
'height': $j('#eventThumbs').height() - $j('#eventImageBar').outerHeight(true)-10
} );
$j('#eventImageNo').text(frame.FrameId);
$j('#prevImageBtn').prop('disabled', !frame.FrameId == 1);
$j('#nextImageBtn').prop('disabled', !frame.FrameId == event.Frames);
}
}
function hideEventImageComplete() {
var thumbImg = $j('#eventThumb'+$j('#eventImage').prop('alt'));
if ( thumbImg ) {
thumbImg.removeClass('selected');
thumbImg.css('opacity', '1.0');
} else {
console.log('Unable to find eventThumb at eventThumb'+$j('#eventImage').prop('alt'));
}
$j('#prevImageBtn').prop('disabled', true);
$j('#nextImageBtn').prop('disabled', true);
$j('#eventImagePanel').css('display', 'none');
$j('#eventImageStats').addClass('hidden');
}
function hideEventImage() {
if ( $j('#eventImagePanel').css('display') != 'none' ) {
new Fx.Tween( $j('#eventImagePanel'), {duration: 500, transition: Fx.Transitions.Sine, onComplete: hideEventImageComplete} ).start('opacity', 1, 0);
}
}
function resetEventStills() {
hideEventImage();
$j('#eventThumbs').empty();
if ( true || !slider ) {
slider = new Slider( '#thumbsSlider', '#thumbsKnob', {
/*steps: eventData.Frames,*/
value: 0,
onChange: function( step ) {
if ( !step ) {
step = 0;
}
var fid = parseInt((step * eventData.Frames)/this.options.steps);
if ( fid < 1 ) {
fid = 1;
} else if ( fid > eventData.Frames ) {
fid = eventData.Frames;
}
checkFrames( eventData.Id, fid, ($j('#eventImagePanel').css('display')=='none'?'':'true'));
scroll.toElement( 'eventThumb'+fid );
}
} );
}
}
function getFrameResponse(respObj, respText) {
if ( checkStreamForErrors('getFrameResponse', respObj) ) {
return;
@ -792,8 +660,6 @@ function getFrameResponse(respObj, respText) {
}
eventData['frames'][frame.FrameId] = frame;
loadEventThumb(eventData, frame, respObj.loopback=="true");
}
function frameQuery( eventId, frameId, loadImage ) {
@ -806,108 +672,6 @@ function frameQuery( eventId, frameId, loadImage ) {
.fail(logAjaxFail);
}
function checkFrames( eventId, frameId, loadImage ) {
if ( !eventData ) {
console.error("No event "+eventId+" found");
return;
}
if ( !eventData['frames'] ) {
eventData['frames'] = {};
}
currFrameId = frameId;
var loFid = frameId - frameBatch/2;
if ( loFid < 1 ) {
loFid = 1;
}
var hiFid = loFid + (frameBatch-1);
if ( hiFid > eventData.Frames ) {
hiFid = eventData.Frames;
}
for ( var fid = loFid; fid <= hiFid; fid++ ) {
if ( !$j('#eventThumb'+fid) ) {
var img = $j('<img>');
img.attr({
'id': 'eventThumb'+fid,
'src': 'graphics/transparent.png',
'alt': fid,
'class': 'placeholder'
});
img.click(function() {
eventData['frames'][fid] = null;
checkFrames(eventId, fid);
});
frameQuery(eventId, fid, loadImage && (fid == frameId));
var imgs = $j('#eventThumbs img');
var injected = false;
if ( fid < imgs.length ) {
imgs.before(img);
injected = true;
} else {
injected = imgs.toArray().some(
function( thumbImg, index ) {
if ( parseInt(img.prop('alt')) < parseInt(thumbImg.prop('alt')) ) {
thumbImg.before(img);
return true;
}
return false;
}
);
}
if ( !injected ) {
$j('#eventThumbs').append(img);
}
var scale = parseInt(img.css('height'));
img.css( {
'width': parseInt((eventData.Width*scale)/100),
'height': parseInt((eventData.Height*scale)/100)
} );
} else if ( eventData['frames'][fid] ) {
if ( loadImage && (fid == frameId) ) {
loadEventImage( eventData, eventData['frames'][fid], loadImage );
}
}
}
$j('#prevThumbsBtn').prop('disabled', frameId == 1);
$j('#nextThumbsBtn').prop('disabled', frameId == eventData.Frames);
}
function locateImage( frameId, loadImage ) {
if ( slider ) {
slider.fireEvent( 'tick', slider.toPosition( parseInt((frameId-1)*slider.options.steps/eventData.Frames) ));
}
checkFrames( eventData.Id, frameId, loadImage );
scroll.toElement( 'eventThumb'+frameId );
}
function prevImage() {
if ( currFrameId > 1 ) {
locateImage( parseInt(currFrameId)-1, true );
}
}
function nextImage() {
if ( currFrameId < eventData.Frames ) {
locateImage( parseInt(currFrameId)+1, true );
}
}
function prevThumbs() {
if ( currFrameId > 1 ) {
locateImage( parseInt(currFrameId)>10?(parseInt(currFrameId)-10):1, $j('#eventImagePanel').css('display')!="none" );
}
}
function nextThumbs() {
if ( currFrameId < eventData.Frames ) {
locateImage( parseInt(currFrameId)<(eventData.Frames-10)?(parseInt(currFrameId)+10):eventData.Frames, $j('#eventImagePanel').css('display')!="none" );
}
}
function prevEvent() {
if ( prevEventId ) {
eventQuery( prevEventId );
@ -959,54 +723,6 @@ function showEventFrames() {
window.location.assign('?view=frames&eid='+eventData.Id);
}
function showStream() {
$j('#eventStills').addClass('hidden');
$j('#eventVideo').removeClass('hidden');
$j('#stillsEvent').removeClass('hidden');
$j('#streamEvent').addClass('hidden');
streamMode = 'video';
if (scale == 'auto') changeScale();
}
function showStills() {
$j('#eventStills').removeClass('hidden');
$j('#eventVideo').addClass('hidden');
if (vid && ( vid.paused != true ) ) {
// Pause the video
vid.pause();
// Update the button text to 'Play'
//if ( playButton )
//playButton.innerHTML = "Play";
}
$j('#stillsEvent').addClass('hidden');
$j('#streamEvent').removeClass('hidden');
streamMode = 'stills';
pauseClicked();
if ( !scroll ) {
scroll = new Fx.Scroll('eventThumbs', {
wait: false,
duration: 500,
offset: {'x': 0, 'y': 0},
transition: Fx.Transitions.Quad.easeInOut
}
);
}
resetEventStills();
if (scale == 'auto') changeScale();
}
function showFrameStats() {
var fid = $j('#eventImageNo').text();
window.location.assign('?view=stats&eid='+eventData.Id+'&fid='+fid);
}
function videoEvent() {
window.location.assign('?view=video&eid='+eventData.Id);
}