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

replace the rate display with a dropdown

This commit is contained in:
Isaac Connor 2019-12-20 11:02:12 -05:00
parent a84031f819
commit d87bf5a156
2 changed files with 30 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -257,7 +257,12 @@ if ( ZM_WEB_STREAM_METHOD == 'mpeg' && ZM_MPEG_LIVE_FORMAT ) {
</p> </p>
<div id="replayStatus"> <div id="replayStatus">
<span id="mode"><?php echo translate('Mode') ?>: <span id="modeValue">Replay</span></span> <span id="mode"><?php echo translate('Mode') ?>: <span id="modeValue">Replay</span></span>
<span id="rate"><?php echo translate('Rate') ?>: <span id="rateValue"><?php echo $rate/100 ?></span>x</span> <span id="rate"><?php echo translate('Rate') ?>:
<?php
$rates = array( 0=>translate('Stopped'), 100 => '1x', 200=>'2x', 400=>'4x', 800=>'8x' );
echo htmlSelect('rate', $rates, $rate, array('id'=>'rateValue'));
?>
<!--<span id="rateValue"><?php echo $rate/100 ?></span>x</span>-->
<span id="progress"><?php echo translate('Progress') ?>: <span id="progressValue">0</span>s</span> <span id="progress"><?php echo translate('Progress') ?>: <span id="progressValue">0</span>s</span>
<span id="zoom"><?php echo translate('Zoom') ?>: <span id="zoomValue">1</span>x</span> <span id="zoom"><?php echo translate('Zoom') ?>: <span id="zoomValue">1</span>x</span>
</div> </div>

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

@ -200,6 +200,19 @@ function changeReplayMode() {
refreshWindow(); refreshWindow();
} }
function changeRate() {
var rate = $j('select[name="rate"]').val();
if ( ! rate ) {
pauseClicked();
} else {
if ( vid ) {
vid.playbackRate(rate/100);
Cookie.write('zmEventRate', rate, {duration: 10*365});
}
}
}
var streamParms = "view=request&request=stream&connkey="+connKey; var streamParms = "view=request&request=stream&connkey="+connKey;
if ( auth_hash ) { if ( auth_hash ) {
streamParms += '&auth='+auth_hash; streamParms += '&auth='+auth_hash;
@ -245,7 +258,7 @@ function getCmdResponse( respObj, respText ) {
if ( streamStatus.paused == true ) { if ( streamStatus.paused == true ) {
streamPause( ); streamPause( );
} else { } else {
$j('#rateValue').html(streamStatus.rate); $j('select[name="rate"]').val(streamStatus.rate*100);
Cookie.write('zmEventRate', streamStatus.rate*100, {duration: 10*365}); Cookie.write('zmEventRate', streamStatus.rate*100, {duration: 10*365});
streamPlay( ); streamPlay( );
} }
@ -296,7 +309,7 @@ function vjsPause() {
function streamPause( ) { function streamPause( ) {
$j('#modeValue').html('Paused'); $j('#modeValue').html('Paused');
$j('#rateValue').html('0'); $j('select[name="rate"]').val('0');
setButtonState( $('pauseBtn'), 'active' ); setButtonState( $('pauseBtn'), 'active' );
setButtonState( $('playBtn'), 'inactive' ); setButtonState( $('playBtn'), 'inactive' );
setButtonState( $('fastFwdBtn'), 'unavail' ); setButtonState( $('fastFwdBtn'), 'unavail' );
@ -322,7 +335,7 @@ function vjsPlay() { //catches if we change mode programatically
if ( intervalRewind ) { if ( intervalRewind ) {
stopFastRev(); stopFastRev();
} }
$j('#rateValue').html(vid.playbackRate()); $j('select[name="rate"]').val(vid.playbackRate());
Cookie.write('zmEventRate', vid.playbackRate()*100, {duration: 10*365}); Cookie.write('zmEventRate', vid.playbackRate()*100, {duration: 10*365});
streamPlay(); streamPlay();
} }
@ -350,7 +363,7 @@ function streamFastFwd( action ) {
if ( rates.indexOf(vid.playbackRate()*100)-1 == -1 ) { if ( rates.indexOf(vid.playbackRate()*100)-1 == -1 ) {
setButtonState($('fastFwdBtn'), 'unavail'); setButtonState($('fastFwdBtn'), 'unavail');
} }
$j('#rateValue').html(vid.playbackRate()); $j('#rate').val(vid.playbackRate());
Cookie.write('zmEventRate', vid.playbackRate()*100, {duration: 10*365}); Cookie.write('zmEventRate', vid.playbackRate()*100, {duration: 10*365});
} else { } else {
streamReq.send(streamParms+"&command="+CMD_FASTFWD); streamReq.send(streamParms+"&command="+CMD_FASTFWD);
@ -397,7 +410,7 @@ function streamFastRev( action ) {
setButtonState( $('fastRevBtn'), 'unavail' ); setButtonState( $('fastRevBtn'), 'unavail' );
} }
clearInterval(intervalRewind); clearInterval(intervalRewind);
$j('#rateValue').html(-revSpeed); $j('#rate').val(-revSpeed);
Cookie.write('zmEventRate', vid.playbackRate()*100, {duration: 10*365}); Cookie.write('zmEventRate', vid.playbackRate()*100, {duration: 10*365});
intervalRewind = setInterval(function() { intervalRewind = setInterval(function() {
if (vid.currentTime() <= 0) { if (vid.currentTime() <= 0) {
@ -588,7 +601,7 @@ function getEventResponse( respObj, respText ) {
CurEventDefVideoPath = null; CurEventDefVideoPath = null;
$j('#modeValue').html('Replay'); $j('#modeValue').html('Replay');
$j('#zoomValue').html('1'); $j('#zoomValue').html('1');
$j('#rateValue').html('1'); $j('#rate').val('100');
vjsPanZoom('zoomOut'); vjsPanZoom('zoomOut');
} else { } else {
drawProgressBar(); drawProgressBar();
@ -1066,7 +1079,8 @@ function initPage() {
$j('#progressValue').html(secsToTime(Math.floor(vid.currentTime()))); $j('#progressValue').html(secsToTime(Math.floor(vid.currentTime())));
}); });
if ( rate > 1 ) { // rate is in % so 100 would be 1x
if ( rate > 0 ) {
// rate should be 100 = 1x, etc. // rate should be 100 = 1x, etc.
vid.playbackRate(rate/100); vid.playbackRate(rate/100);
} }
@ -1091,6 +1105,9 @@ function initPage() {
nearEventsQuery(eventData.Id); nearEventsQuery(eventData.Id);
initialAlarmCues(eventData.Id); //call ajax+renderAlarmCues initialAlarmCues(eventData.Id); //call ajax+renderAlarmCues
if (scale == "auto") changeScale(); if (scale == "auto") changeScale();
document.querySelectorAll('select[name="rate"]').forEach(function(el) {
el.onchange = window['changeRate'];
});
} }
// Kick everything off // Kick everything off