Initial refactor of console view to use api & angular
* Move eventCounts to the API and bind with angular * Display the console as a grid, rather than a table * Show only information we want to see
This commit is contained in:
parent
a0f12575fe
commit
c8a3cb9df9
|
@ -25,3 +25,11 @@ ZoneMinder.factory('Event', function($http) {
|
||||||
};
|
};
|
||||||
});
|
});
|
||||||
|
|
||||||
|
ZoneMinder.factory('Console', function($http) {
|
||||||
|
return {
|
||||||
|
getConsoleEvents: function(interval) {
|
||||||
|
return $http.get('/api/events/consoleEvents/'+interval+'.json');
|
||||||
|
}
|
||||||
|
};
|
||||||
|
});
|
||||||
|
|
||||||
|
|
|
@ -2,7 +2,6 @@ var ZoneMinder = angular.module('ZoneMinderControllers', []);
|
||||||
|
|
||||||
ZoneMinder.controller('HeaderController', function($scope, Header) {
|
ZoneMinder.controller('HeaderController', function($scope, Header) {
|
||||||
Header.getLogState(function(results) {
|
Header.getLogState(function(results) {
|
||||||
console.log(results);
|
|
||||||
});
|
});
|
||||||
|
|
||||||
Header.getDaemonStatus(function(results) {
|
Header.getDaemonStatus(function(results) {
|
||||||
|
@ -34,3 +33,15 @@ ZoneMinder.controller('EventController', function($scope, $location, Event) {
|
||||||
|
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
|
ZoneMinder.controller('ConsoleController', function($scope, Console) {
|
||||||
|
// Ask the API for events that have happened in the last week
|
||||||
|
Console.getConsoleEvents('1 week').then(function(results) {
|
||||||
|
// For each result, assign it to $scope[Counts$monitorId]
|
||||||
|
for (var key in results['data']['results']) {
|
||||||
|
var mid = key;
|
||||||
|
var count = results['data']['results'][key];
|
||||||
|
$scope['Counts' + mid] = count;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
|
@ -18,57 +18,6 @@
|
||||||
// Foundation, Inc., 59 Temple Place - Suite 330, Boston, MA 02111-1307, USA.
|
// Foundation, Inc., 59 Temple Place - Suite 330, Boston, MA 02111-1307, USA.
|
||||||
//
|
//
|
||||||
|
|
||||||
$eventCounts = array(
|
|
||||||
array(
|
|
||||||
"title" => $SLANG['Events'],
|
|
||||||
"filter" => array(
|
|
||||||
"terms" => array(
|
|
||||||
)
|
|
||||||
),
|
|
||||||
),
|
|
||||||
array(
|
|
||||||
"title" => $SLANG['Hour'],
|
|
||||||
"filter" => array(
|
|
||||||
"terms" => array(
|
|
||||||
array( "attr" => "DateTime", "op" => ">=", "val" => "-1 hour" ),
|
|
||||||
)
|
|
||||||
),
|
|
||||||
),
|
|
||||||
array(
|
|
||||||
"title" => $SLANG['Day'],
|
|
||||||
"filter" => array(
|
|
||||||
"terms" => array(
|
|
||||||
array( "attr" => "DateTime", "op" => ">=", "val" => "-1 day" ),
|
|
||||||
)
|
|
||||||
),
|
|
||||||
),
|
|
||||||
array(
|
|
||||||
"title" => $SLANG['Week'],
|
|
||||||
"filter" => array(
|
|
||||||
"terms" => array(
|
|
||||||
array( "attr" => "DateTime", "op" => ">=", "val" => "-7 day" ),
|
|
||||||
)
|
|
||||||
),
|
|
||||||
),
|
|
||||||
array(
|
|
||||||
"title" => $SLANG['Month'],
|
|
||||||
"filter" => array(
|
|
||||||
"terms" => array(
|
|
||||||
array( "attr" => "DateTime", "op" => ">=", "val" => "-1 month" ),
|
|
||||||
)
|
|
||||||
),
|
|
||||||
),
|
|
||||||
array(
|
|
||||||
"title" => $SLANG['Archived'],
|
|
||||||
"filter" => array(
|
|
||||||
"terms" => array(
|
|
||||||
array( "attr" => "Archived", "op" => "=", "val" => "1" ),
|
|
||||||
)
|
|
||||||
),
|
|
||||||
),
|
|
||||||
);
|
|
||||||
|
|
||||||
|
|
||||||
$group = NULL;
|
$group = NULL;
|
||||||
if ( ! empty($_COOKIE['zmGroup']) ) {
|
if ( ! empty($_COOKIE['zmGroup']) ) {
|
||||||
if ( $group = dbFetchOne( 'select * from Groups where Id = ?', NULL, array($_COOKIE['zmGroup'])) )
|
if ( $group = dbFetchOne( 'select * from Groups where Id = ?', NULL, array($_COOKIE['zmGroup'])) )
|
||||||
|
@ -107,16 +56,6 @@ for ( $i = 0; $i < count($monitors); $i++ )
|
||||||
$monitors[$i]['zmc'] = zmcStatus( $monitors[$i] );
|
$monitors[$i]['zmc'] = zmcStatus( $monitors[$i] );
|
||||||
$monitors[$i]['zma'] = zmaStatus( $monitors[$i] );
|
$monitors[$i]['zma'] = zmaStatus( $monitors[$i] );
|
||||||
$monitors[$i]['ZoneCount'] = dbFetchOne( 'select count(Id) as ZoneCount from Zones where MonitorId = ?', 'ZoneCount', array($monitors[$i]['Id']) );
|
$monitors[$i]['ZoneCount'] = dbFetchOne( 'select count(Id) as ZoneCount from Zones where MonitorId = ?', 'ZoneCount', array($monitors[$i]['Id']) );
|
||||||
$counts = array();
|
|
||||||
for ( $j = 0; $j < count($eventCounts); $j++ )
|
|
||||||
{
|
|
||||||
$filter = addFilterTerm( $eventCounts[$j]['filter'], count($eventCounts[$j]['filter']['terms']), array( "cnj" => "and", "attr" => "MonitorId", "op" => "=", "val" => $monitors[$i]['Id'] ) );
|
|
||||||
parseFilter( $filter );
|
|
||||||
$counts[] = "count(if(1".$filter['sql'].",1,NULL)) as EventCount$j";
|
|
||||||
$monitors[$i]['eventCounts'][$j]['filter'] = $filter;
|
|
||||||
}
|
|
||||||
$sql = "select ".join($counts,", ")." from Events as E where MonitorId = ?";
|
|
||||||
$counts = dbFetchOne( $sql, NULL, array($monitors[$i]['Id']) );
|
|
||||||
if ( $monitors[$i]['Function'] != 'None' )
|
if ( $monitors[$i]['Function'] != 'None' )
|
||||||
{
|
{
|
||||||
$cycleCount++;
|
$cycleCount++;
|
||||||
|
@ -125,7 +64,6 @@ for ( $i = 0; $i < count($monitors); $i++ )
|
||||||
if ( $maxWidth < $scaleWidth ) $maxWidth = $scaleWidth;
|
if ( $maxWidth < $scaleWidth ) $maxWidth = $scaleWidth;
|
||||||
if ( $maxHeight < $scaleHeight ) $maxHeight = $scaleHeight;
|
if ( $maxHeight < $scaleHeight ) $maxHeight = $scaleHeight;
|
||||||
}
|
}
|
||||||
if ( $counts ) $monitors[$i] = array_merge( $monitors[$i], $counts );
|
|
||||||
$seqIdList[] = $monitors[$i]['Id'];
|
$seqIdList[] = $monitors[$i]['Id'];
|
||||||
$displayMonitors[] = $monitors[$i];
|
$displayMonitors[] = $monitors[$i];
|
||||||
}
|
}
|
||||||
|
@ -190,125 +128,46 @@ xhtmlHeaders( __FILE__, $SLANG['Console'] );
|
||||||
<div class="col-md-2"><?php include("sidebar.php"); ?></div>
|
<div class="col-md-2"><?php include("sidebar.php"); ?></div>
|
||||||
|
|
||||||
<div class="col-md-10">
|
<div class="col-md-10">
|
||||||
<table id="consoleTable" class="table table-striped">
|
|
||||||
<thead>
|
<div ng-controller="ConsoleController">
|
||||||
<tr>
|
<div class="row">
|
||||||
<th class="colName"><?= $SLANG['Name'] ?></th>
|
<?php foreach( $displayMonitors as $monitor ) {
|
||||||
<th class="colFunction"><?= $SLANG['Function'] ?></th>
|
|
||||||
<th class="colSource"><?= $SLANG['Source'] ?></th>
|
|
||||||
<?php
|
|
||||||
for ( $i = 0; $i < count($eventCounts); $i++ )
|
|
||||||
{
|
|
||||||
?>
|
|
||||||
<th class="colEvents"><?= $eventCounts[$i]['title'] ?></th>
|
|
||||||
<?php
|
|
||||||
}
|
|
||||||
?>
|
|
||||||
<th class="colZones"><?= $SLANG['Zones'] ?></th>
|
|
||||||
<?php
|
|
||||||
if ( canEdit('Monitors') )
|
|
||||||
{
|
|
||||||
?>
|
|
||||||
<th class="colOrder"><?= $SLANG['Order'] ?></th>
|
|
||||||
<?php
|
|
||||||
}
|
|
||||||
?>
|
|
||||||
<th class="colMark"><?= $SLANG['Mark'] ?></th>
|
|
||||||
</tr>
|
|
||||||
</thead>
|
|
||||||
<tfoot>
|
|
||||||
<tr>
|
|
||||||
<td class="colLeftButtons" colspan="3">
|
|
||||||
</td>
|
|
||||||
<?php
|
|
||||||
for ( $i = 0; $i < count($eventCounts); $i++ )
|
|
||||||
{
|
|
||||||
parseFilter( $eventCounts[$i]['filter'] );
|
|
||||||
?>
|
|
||||||
<td class="colEvents"><?= makePopupLink( '?view='.$eventsView.'&page=1'.$eventCounts[$i]['filter']['query'], $eventsWindow, $eventsView, $eventCounts[$i]['total'], canView( 'Events' ) ) ?></td>
|
|
||||||
<?php
|
|
||||||
}
|
|
||||||
?>
|
|
||||||
<td class="colZones"><?= $zoneCount ?></td>
|
|
||||||
<td class="colRightButtons" colspan="<?= canEdit('Monitors')?2:1 ?>"></td>
|
|
||||||
</tr>
|
|
||||||
</tfoot>
|
|
||||||
<tbody>
|
|
||||||
<?php
|
|
||||||
foreach( $displayMonitors as $monitor )
|
|
||||||
{
|
|
||||||
?>
|
|
||||||
<tr>
|
|
||||||
<?php
|
|
||||||
if ( !$monitor['zmc'] )
|
if ( !$monitor['zmc'] )
|
||||||
$dclass = "errorText";
|
$dclass = "danger";
|
||||||
else
|
else
|
||||||
{
|
{
|
||||||
if ( !$monitor['zma'] )
|
if ( !$monitor['zma'] )
|
||||||
$dclass = "warnText";
|
$dclass = "warning";
|
||||||
else
|
else
|
||||||
$dclass = "infoText";
|
$dclass = "info";
|
||||||
}
|
}
|
||||||
if ( $monitor['Function'] == 'None' )
|
|
||||||
$fclass = "errorText";
|
|
||||||
elseif ( $monitor['Function'] == 'Monitor' )
|
|
||||||
$fclass = "warnText";
|
|
||||||
else
|
|
||||||
$fclass = "infoText";
|
|
||||||
if ( !$monitor['Enabled'] )
|
|
||||||
$fclass .= " disabledText";
|
|
||||||
$scale = max( reScale( SCALE_BASE, $monitor['DefaultScale'], ZM_WEB_DEFAULT_SCALE ), SCALE_BASE );
|
|
||||||
?>
|
?>
|
||||||
<td class="colName"><?= makePopupLink( '?view=watch&mid='.$monitor['Id'], 'zmWatch'.$monitor['Id'], array( 'watch', reScale( $monitor['Width'], $scale ), reScale( $monitor['Height'], $scale ) ), $monitor['Name'], $running && ($monitor['Function'] != 'None') && canView( 'Stream' ) ) ?></td>
|
<div class="col-md-3">
|
||||||
<td class="colFunction"><?= makePopupLink( '?view=function&mid='.$monitor['Id'], 'zmFunction', 'function', '<span class="'.$fclass.'">'.$SLANG['Fn'.$monitor['Function']].( empty($monitor['Enabled']) ? ', disabled' : '' ) .'</span>', canEdit( 'Monitors' ) ) ?></td>
|
<div class="panel panel-<?= $dclass ?>">
|
||||||
<?php if ( $monitor['Type'] == "Local" ) { ?>
|
<div class="panel-heading">
|
||||||
<td class="colSource"><?= makePopupLink( '?view=monitor&mid='.$monitor['Id'], 'zmMonitor'.$monitor['Id'], 'monitor', '<span class="'.$dclass.'">'.$monitor['Device'].' ('.$monitor['Channel'].')</span>', canEdit( 'Monitors' ) ) ?></td>
|
<input class="pull-right btn btn-default" type="checkbox" name="markMids[]" value="<?= $monitor['Id'] ?>" onclick="setButtonStates( this )"<?php if ( !canEdit( 'Monitors' ) ) { ?> disabled="disabled"<?php } ?>/>
|
||||||
<?php } elseif ( $monitor['Type'] == "Remote" ) { ?>
|
<h2 class="text-left panel-title"><?= $monitor['Name'] ?> <small>(<?= $monitor['Id'] ?>)</small></h2>
|
||||||
<td class="colSource"><?= makePopupLink( '?view=monitor&mid='.$monitor['Id'], 'zmMonitor'.$monitor['Id'], 'monitor', '<span class="'.$dclass.'">'.preg_replace( '/^.*@/', '', $monitor['Host'] ).'</span>', canEdit( 'Monitors' ) ) ?></td>
|
</div>
|
||||||
<?php } elseif ( $monitor['Type'] == "File" ) { ?>
|
|
||||||
<td class="colSource"><?= makePopupLink( '?view=monitor&mid='.$monitor['Id'], 'zmMonitor'.$monitor['Id'], 'monitor', '<span class="'.$dclass.'">'.preg_replace( '/^.*\//', '', $monitor['Path'] ).'</span>', canEdit( 'Monitors' ) ) ?></td>
|
<div class="panel-body center-block">
|
||||||
<?php } elseif ( $monitor['Type'] == "Ffmpeg" ) { ?>
|
<img src="http://placehold.it/120&text=<?= $monitor['Name'] ?>!" />
|
||||||
<td class="colSource"><?= makePopupLink( '?view=monitor&mid='.$monitor['Id'], 'zmMonitor'.$monitor['Id'], 'monitor', '<span class="'.$dclass.'">'.preg_replace( '/^.*\//', '', $monitor['Path'] ).'</span>', canEdit( 'Monitors' ) ) ?></td>
|
|
||||||
<?php } elseif ( $monitor['Type'] == "Libvlc" ) {
|
<p><span ng-bind="Counts<?= $monitor['Id'] ?>"></span> recent events</p>
|
||||||
$domain = parse_url( $monitor['Path'], PHP_URL_HOST );
|
</div>
|
||||||
$shortpath = $domain ? $domain : preg_replace( '/^.*\//', '', $monitor['Path'] );
|
</div>
|
||||||
?>
|
</div>
|
||||||
<td class="colSource"><?= makePopupLink( '?view=monitor&mid='.$monitor['Id'], 'zmMonitor'.$monitor['Id'], 'monitor', '<span class="'.$dclass.'">'.$shortpath.'</span>', canEdit( 'Monitors' ) ) ?></td>
|
|
||||||
<?php } elseif ( $monitor['Type'] == "cURL" ) { ?>
|
|
||||||
<td class="colSource"><?= makePopupLink( '?view=monitor&mid='.$monitor['Id'], 'zmMonitor'.$monitor['Id'], 'monitor', '<span class="'.$dclass.'">'.preg_replace( '/^.*\//', '', $monitor['Path'] ).'</span>', canEdit( 'Monitors' ) ) ?></td>
|
|
||||||
<?php } else { ?>
|
|
||||||
<td class="colSource"> </td>
|
|
||||||
<?php } ?>
|
<?php } ?>
|
||||||
<?php
|
</div>
|
||||||
for ( $i = 0; $i < count($eventCounts); $i++ )
|
</div>
|
||||||
{
|
|
||||||
?>
|
|
||||||
<td class="colEvents"><?= makePopupLink( '?view='.$eventsView.'&page=1'.$monitor['eventCounts'][$i]['filter']['query'], $eventsWindow, $eventsView, $monitor['EventCount'.$i], canView( 'Events' ) ) ?></td>
|
|
||||||
<?php
|
|
||||||
}
|
|
||||||
?>
|
|
||||||
<td class="colZones"><?= makePopupLink( '?view=zones&mid='.$monitor['Id'], 'zmZones', array( 'zones', $monitor['Width'], $monitor['Height'] ), $monitor['ZoneCount'], canView( 'Monitors' ) ) ?></td>
|
|
||||||
<?php
|
|
||||||
if ( canEdit('Monitors') )
|
|
||||||
{
|
|
||||||
?>
|
|
||||||
<td class="colOrder"><?= makeLink( '?view='.$view.'&action=sequence&mid='.$monitor['Id'].'&smid='.$seqIdUpList[$monitor['Id']], '<img src="'.$seqUpFile.'" alt="Up"/>', $monitor['Sequence']>$minSequence ) ?><?= makeLink( '?view='.$view.'&action=sequence&mid='.$monitor['Id'].'&smid='.$seqIdDownList[$monitor['Id']], '<img src="'.$seqDownFile.'" alt="Down"/>', $monitor['Sequence']<$maxSequence ) ?></td>
|
|
||||||
<?php
|
|
||||||
}
|
|
||||||
?>
|
|
||||||
<td class="colMark"><input class="btn btn-default" type="checkbox" name="markMids[]" value="<?= $monitor['Id'] ?>" onclick="setButtonStates( this )"<?php if ( !canEdit( 'Monitors' ) ) { ?> disabled="disabled"<?php } ?>/></td>
|
|
||||||
</tr>
|
|
||||||
<?php
|
|
||||||
}
|
|
||||||
?>
|
|
||||||
</tbody>
|
|
||||||
</table>
|
|
||||||
</div> <!-- End .col-md-10 -->
|
</div> <!-- End .col-md-10 -->
|
||||||
|
|
||||||
|
|
||||||
</div> <!-- End .row -->
|
</div> <!-- End .row -->
|
||||||
</div> <!-- End #content .container-fluid -->
|
</div> <!-- End #content .container-fluid -->
|
||||||
<?php include("footer.php"); ?>
|
|
||||||
</form>
|
</form>
|
||||||
|
<?php include("footer.php"); ?>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|
Loading…
Reference in New Issue