Moved the scaling of streams from JS to PHP

The Monitor model is now smart enough to change the stream's scale.
It also has the option of not scaling at all (in the case of the
single monitor view).
This commit is contained in:
Kyle Johnson 2013-09-24 12:54:37 -04:00
parent 5f103b35a4
commit f385db2d80
4 changed files with 14 additions and 22 deletions

View File

@ -4,14 +4,12 @@
public function index() {
$zmBandwidth = $this->Cookie->read('zmBandwidth');
$this->set('width', Configure::read('ZM_WEB_LIST_THUMB_WIDTH'));
$monitoroptions = array('fields' => array('Name', 'Id', 'Function', 'Enabled', 'Sequence', 'Function', 'Width', 'StreamReplayBuffer'), 'order' => 'Sequence ASC', 'recursive' => -1);
$monitors = $this->Monitor->find('all', $monitoroptions);
foreach ($monitors as $key => $value) {
$monitors[$key]['img'] = $this->Monitor->getStreamSrc($value['Monitor']['Id'], $zmBandwidth, $value['Monitor']['StreamReplayBuffer'], $value['Monitor']['Function'], $value['Monitor']['Enabled'], $value['Monitor']['Name']);
$monitors[$key]['img'] = $this->Monitor->getStreamSrc($value['Monitor']['Id'], $zmBandwidth, $value['Monitor']['StreamReplayBuffer'], $value['Monitor']['Function'], $value['Monitor']['Enabled'], $value['Monitor']['Name'], $value['Monitor']['Width']);
}
$this->set('monitors', $monitors);
}
@ -30,7 +28,7 @@
$zmBandwidth = $this->Cookie->read('zmBandwidth');
$buffer = $monitor['Monitor']['StreamReplayBuffer'];
$this->set('streamSrc', $this->Monitor->getStreamSrc($id, $zmBandwidth, $buffer, $monitor['Monitor']['Function'], $monitor['Monitor']['Enabled'], $monitor['Monitor']['Name']));
$this->set('streamSrc', $this->Monitor->getStreamSrc($id, $zmBandwidth, $buffer, $monitor['Monitor']['Function'], $monitor['Monitor']['Enabled'], $monitor['Monitor']['Name'], $monitor['Monitor']['Width'], false));
}
public function edit($id = null) {

View File

@ -15,8 +15,9 @@
)
);
public function getStreamSrc($id = null, $zmBandwidth, $buffer, $function, $enabled, $name) {
public function getStreamSrc($id = null, $zmBandwidth, $buffer, $function, $enabled, $name, $width, $scale = true) {
$img['id'] = "livestream_$id";
$img['width'] = $width;
$ZM_MPEG_LIVE_FORMAT = Configure::read('ZM_MPEG_LIVE_FORMAT');
$ZM_WEB_STREAM_METHOD = ClassRegistry::init('Config')->getWebOption('ZM_WEB_STREAM_METHOD', $zmBandwidth);
@ -27,10 +28,14 @@
if (Configure::read('daemonStatus') && $function != "None" && $enabled) {
$img['alt'] = "Live stream of $name";
if ($ZM_WEB_STREAM_METHOD == 'mpeg' && $ZM_MPEG_LIVE_FORMAT) {
$img['src'] = "/cgi-bin/nph-zms?mode=mpeg&scale=100&maxfps=$ZM_WEB_VIDEO_MAXFPS&bitrate=$ZM_WEB_VIDEO_BITRATE&format=$ZM_MPEG_LIVE_FORMAT&monitor=$id";
$img['src'] = "/cgi-bin/nph-zms?mode=mpeg&maxfps=$ZM_WEB_VIDEO_MAXFPS&bitrate=$ZM_WEB_VIDEO_BITRATE&format=$ZM_MPEG_LIVE_FORMAT&monitor=$id";
} else {
$img['src'] = "/cgi-bin/nph-zms?mode=jpeg&scale=100&maxfps=$ZM_WEB_VIDEO_MAXFPS&buffer=$buffer&monitor=$id";
$img['src'] = "/cgi-bin/nph-zms?mode=jpeg&maxfps=$ZM_WEB_VIDEO_MAXFPS&buffer=$buffer&monitor=$id";
}
if ($scale) {
$scale = (Configure::read('ZM_WEB_LIST_THUMB_WIDTH') / $width) * 100;
$img['src'] .= '&scale=' . $scale;
}
} else {
$img['src'] = "/img/no-image.png";
$img['alt'] = "No live stream available for $name";

View File

@ -4,13 +4,14 @@
$this->end();
?>
<div class="row" id="monitors">
<div id="monitors" class="js-masonry" data-masonry-options='{ "gutter": 10, "itemSelector": ".monitor" }'>
<?php foreach ($monitors as $monitor => $mon): ?>
<div class="col-md-4" id="Monitor_<?= $mon['Monitor']['Id']; ?>">
<div class="monitor" id="Monitor_<?= $mon['Monitor']['Id']; ?>" style="width:<?php $mon['img']['width'];?>">
<div class="thumbnail">
<?php echo $this->Html->image($mon['img']['src'], array(
'alt' => $mon['img']['alt'],
'id' => $mon['img']['id']
'id' => $mon['img']['id'],
'width' => Configure::read('ZM_WEB_LIST_THUMB_WIDTH')
)); ?>
<div class="caption">
<h4><?php echo $this->Html->link($mon['Monitor']['Name'],array('controller' => 'monitors', 'action' => 'view', $mon['Monitor']['Id'])); ?></h4>

View File

@ -211,18 +211,6 @@ $(document).ready(function() {
});
});
$(".livestream_resize").each(function(index, element){
if($(element).attr('src').indexOf('scale=') >= 0){
var newScale = Math.ceil(($(element).width() / $(element).attr('width')) * 100);
var src = $(element).attr('src').replace('scale=100', 'scale='+newScale);
$(element).attr('src', src);
console.log("resized");
}
});
return false;
// Monitors //
});