ZoneMinder
/
zoneminder
mirror of https://github.com/ZoneMinder/zoneminder.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

Merge branch 'storageareas' of github.com:connortechnology/ZoneMinder into storageareas

pull/2077/head
Isaac Connor 2017-10-10 11:51:48 -04:00
parent 7f73f0bf8c d0f350d5b2
commit 6bb331b8a5
3 changed files with 101 additions and 95 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -174,8 +174,8 @@ if ( $Event->DefaultVideo() ) {
<p id="replayAllCountDown"></p>
<p id="dvrControlsVjs" class="dvrControls">
<input type="button" value="&lt;+" id="prevBtnVjs" title="<?php echo translate('Prev') ?>" class="active" onclick="streamPrev( true );"/>
<input type="button" value="+&gt;" id="nextBtnVjs" title="<?php echo translate('Next') ?>" class="active" onclick="streamNext( true );"/>
<input type="button" value="&lt;+" id="prevBtnVjs" title="<?php echo translate('Prev') ?>" class="inactive" onclick="streamPrev( true );"/>
<input type="button" value="+&gt;" id="nextBtnVjs" title="<?php echo translate('Next') ?>" class="inactive" onclick="streamNext( true );"/>
</p>
<?php
@ -219,7 +219,7 @@ if ( ZM_WEB_STREAM_METHOD == 'mpeg' && ZM_MPEG_LIVE_FORMAT ) {
<div class="progressBox" id="progressBox<?php echo $i ?>" title=""></div>
<?php } ?>
</div><!--progressBar-->
<div id="alarmCueJpeg" class="alarmCue" style="width: <?php echo reScale($Event->Width(), $scale);?>px;"><?php renderAlarmCues ();?></div>
<div id="alarmCueJpeg" class="alarmCue" style="width: <?php echo reScale($Event->Width(), $scale);?>px;"></div>
</div><!--imageFeed-->
</div>
<?php } /*end if !DefaultVideo*/ ?>
@ -265,11 +265,5 @@ if ( ZM_WEB_STREAM_METHOD == 'mpeg' && ZM_MPEG_LIVE_FORMAT ) {
} // end if Event exists
?>
</div><!--page-->
<!-- Alarm Cues on video. -->
<script type="text/javascript">
alarmHtml = '<div class="alarmCue">' + alarmHtml + '</div>'
$j(".vjs-progress-control").append(alarmHtml);
$j(".vjs-control-bar").addClass("vjs-zm");
</script>
</body>
</html>

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

@ -31,6 +31,92 @@ function vjsReplay(endTime) {
});
}
$j.ajaxSetup ({timeout: AJAX_TIMEOUT }); //sets timeout for all getJSON.
var cueFrames = null; //make cueFrames availaible even if we don't send another ajax query
function initialAlarmCues () {
$j.getJSON("api/events/"+eventData.Id+".json", setAlarmCues); //get frames data for alarmCues and inserts into html
}
function setAlarmCues (data) {
cueFrames = data.event.Frame;
alarmSpans = renderAlarmCues();
if ( vid ) {
$j(".vjs-progress-control").append('<div class="alarmCue">' + alarmSpans + '</div>');
$j(".vjs-control-bar").addClass("vjs-zm");
} else {
$j("#alarmCueJpeg").html(alarmSpans);
}
}
function renderAlarmCues () {
if (cueFrames) {
var cueRatio = (vid ? $j("#videoobj").width() : $j("#progressBar").width()) / (cueFrames[cueFrames.length - 1].Delta * 100);//use videojs width or nph-zms width
var minAlarm = Math.ceil(1/cueRatio);
var spanTimeStart = 0;
var spanTimeEnd = 0;
var alarmed = 0;
var alarmHtml = "";
var pixSkewNone = 0;
var pixSkewAlarm = 0;
var skip = 0;
for (let i = 0; i < cueFrames.length; i++) {
skip = 0;
frame = cueFrames[i];
if (frame.Type == "Alarm" && alarmed == 0) { //From nothing to alarm. End nothing and start alarm.
alarmed = 1;
if (frame.Delta == 0) continue; //If event starts with an alarm or too few for a nonespan
spanTimeEnd = frame.Delta * 100;
spanTime = spanTimeEnd - spanTimeStart;
let pix = cueRatio * spanTime;
pixSkewNone += pix - Math.round(pix);//average out the rounding errors.
pix = Math.round(pix);
if ((pixSkewNone > 1 || pixSkewNone < -1) && pix + Math.round(pixSkewNone) > 0) { //add skew if it's a pixel and won't zero out span.
pix += Math.round(pixSkewNone);
pixSkewNone = pixSkewNone - Math.round(pixSkewNone);
}
alarmHtml += '<span class="alarmCue noneCue" style="width: ' + pix + 'px;"></span>';
spanTimeStart = spanTimeEnd;
} else if (frame.Type !== "Alarm" && alarmed == 1) { //from alarm to nothing. End alarm and start nothing.
futNone = 0;
indexPlus = i+1;
if (((frame.Delta * 100) - spanTimeStart) < minAlarm && indexPlus < cueFrames.length) continue; //alarm is too short and there is more event
while (futNone < minAlarm) { //check ahead to see if there's enough for a nonespan
if (indexPlus >= cueFrames.length) break; //check if end of event.
futNone = (cueFrames[indexPlus].Delta *100) - (frame.Delta *100);
if (cueFrames[indexPlus].Type == "Alarm") {
i = --indexPlus;
skip = 1;
break;
}
indexPlus++;
}
if (skip == 1) continue; //javascript doesn't support continue 2;
spanTimeEnd = frame.Delta *100;
spanTime = spanTimeEnd - spanTimeStart;
alarmed = 0;
pix = cueRatio * spanTime;
pixSkewAlarm += pix - Math.round(pix);
pix = Math.round(pix);
if ((pixSkewAlarm > 1 || pixSkewAlarm < -1) && pix + Math.round(pixSkewAlarm) > 0) {
pix += Math.round(pixSkewAlarm);
pixSkewAlarm = pixSkewAlarm - Math.round(pixSkewAlarm);
}
alarmHtml += '<span class="alarmCue" style="width: ' + pix + 'px;"></span>';
spanTimeStart = spanTimeEnd;
} else if (frame.Type == "Alarm" && alarmed == 1 && i + 1 >= cueFrames.length) { //event ends on an alarm
spanTimeEnd = frame.Delta * 100;
spanTime = spanTimeEnd - spanTimeStart;
alarmed = 0;
pix = Math.round(cueRatio * spanTime);
alarmHtml += '<span class="alarmCue" style="width: ' + pix + 'px;"></span>';
}
}
return alarmHtml;
}
}
function setButtonState( element, butClass ) {
if ( element ) {
element.className = butClass;
@ -46,16 +132,17 @@ function changeScale() {
var baseHeight = eventData.Height;
var newWidth = ( baseWidth * scale ) / SCALE_BASE;
var newHeight = ( baseHeight * scale ) / SCALE_BASE;
if ( vid ) {
// Using video.js
vid.width = newWidth;
vid.height = newHeight;
} else {
if ( vid ) {
// Using video.js
$j("#videoobj").width(newWidth);
$j("#videoobj").height(newHeight);
$j("div.alarmCue").html(renderAlarmCues());//just re-render alarmCues. skip ajax call
Cookie.write( 'zmEventScale'+eventData.MonitorId, scale, { duration: 10*365 } );
} else {
streamScale( scale );
var streamImg = document.getElementById('evtStream');
streamImg.style.width = newWidth + "px";
streamImg.style.height = newHeight + "px";
var streamImg = document.getElementById('evtStream');
streamImg.style.width = newWidth + "px";
streamImg.style.height = newHeight + "px";
Cookie.write( 'zmEventScale'+eventData.MonitorId, scale, { duration: 10*365 } );
}
}
@ -841,6 +928,7 @@ function initPage() {
//FIXME prevent blocking...not sure what is happening or best way to unblock
if ( $('videoobj') ) {
vid = videojs("videoobj");
initialAlarmCues(); //call ajax+renderAlarmCues after videojs is. should be only call to initialAlarmCues
}
if ( vid ) {
/*
@ -863,6 +951,7 @@ function initPage() {
} else {
streamCmdTimer = streamQuery.delay( 250 );
eventQuery.pass( eventData.Id ).delay( 500 );
initialAlarmCues(); //call ajax+renderAlarmCues for nph-zms. should be only call to initialAlarmCues
if ( canStreamNative ) {
var streamImg = $('imageFeed').getElement('img');

77
web/skins/classic/views/js/event.js.php
View File

@ -47,80 +47,3 @@ var canStreamNative = <?php echo canStreamNative()?'true':'false' ?>;
//
var deleteString = "<?php echo translate('Delete') ?>";
var causeString = "<?php echo translate('AttrCause') ?>";
//
// AlarmCues
//
<?php
function renderAlarmCues () {
global $Event, $scale;
$sql = 'SELECT *, unix_timestamp(TimeStamp) AS UnixTimeStamp FROM Frames WHERE EventID = ? ORDER BY FrameId';
$frames = dbFetchAll($sql, NULL, array($_REQUEST['eid']));
if (count($frames)) {
$width = reScale($Event->Width(), $scale);
$lastFrame = end($frames);
$lastTime = $lastFrame['Delta'] * 100;
$ratio = $width / $lastTime;
$minAlarm = ceil(1 / $ratio);
$spanTimeStart = 0;
$spanTimeEnd = 0;
$alarmed = 0;
$alarmHtml = "";
$pixSkewNone = 0;
$pixSkewAlarm = 0;
$skip = 0;
foreach ($frames as $key => $frame) {
if ($frame['Type'] == "Alarm" && $alarmed == 0) { //From nothing to alarm. End nothing and start alarm.
if ($skip > $key) continue;
$alarmed = 1;
if ($frame['Delta'] == 0) continue; //If event starts with alarm
$spanTimeEnd = $frame['Delta'] * 100;
$spanTime = $spanTimeEnd - $spanTimeStart;
$pix = $ratio * $spanTime;
$pixSkewNone += $pix - round($pix);
$pix = round($pix);
if (($pixSkewNone > 1 || $pixSkewNone < -1) && $pix + round($pixSkewNone) > 0) { //add skew if it's a pixel and won't zero span
$pix += round($pixSkewNone);
$pixSkewNone = $pixSkewNone - round($pixSkewNone);
}
$alarmHtml .= "<span class=\"alarmCue noneCue\" style=\"width:" . $pix . "px;\"></span>";
$spanTimeStart = $spanTimeEnd;
} elseif ($frame['Type'] !== "Alarm" && $alarmed == 1) { //from Alarm to nothing. End alarm and start nothing.
if ($skip > $key) continue;
$futNone = 0;
$keyPlus = $key + 1;
while ($futNone < $minAlarm) { //check ahead to see if there's enough for a none.
if (!array_key_exists($keyPlus, $frames )) break; //check if end of event
$futNone = ($frames[$keyPlus]['Delta'] * 100) - ($frame['Delta'] * 100);
if ($frames[$keyPlus]['Type'] == "Alarm") {
$skip = $keyPlus;
continue 2;
}
$keyPlus +=1;
}
if ((($frame['Delta'] * 100) - $spanTimeStart) < $minAlarm && (array_key_exists($keyPlus, $frames))) continue; //alarm short and more event
$spanTimeEnd = $frame['Delta'] * 100;
$spanTime = $spanTimeEnd - $spanTimeStart;
$alarmed = 0;
$pix = $ratio * $spanTime;
$pixSkewAlarm += $pix - round($pix);
$pix = round($pix);
if (($pixSkewAlarm > 1 || $pixSkewAlarm < -1) && $pix + round($pixSkewAlarm) > 0) {
$pix += round($pixSkewAlarm);
$pixSkewAlarm = $pixSkewAlarm - round($pixSkewAlarm);
}
$alarmHtml .= "<span class=\"alarmCue\" style=\"width:" . $pix . "px;\"></span>";
$spanTimeStart = $spanTimeEnd;
} elseif ($frame['Type'] == "Alarm" && $alarmed == 1 && !array_key_exists($key+1, $frames)) { // event ends on alarm
$spanTimeEnd = $frame['Delta'] * 100;
$spanTime = $spanTimeEnd - $spanTimeStart;
$alarmed = 0;
$pix = round($ratio * $spanTime);
$alarmHtml .= "<span class=\"alarmCue\" style=\"width:" . $pix . "px;\"></span>";
}
}
echo $alarmHtml;
}
}
?>
var alarmHtml = '<?php renderAlarmCues (); ?>';