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

First stab at Events view via angular and API

This commit is contained in:
Kyle Johnson 2014-12-23 22:38:54 -05:00
parent 930b94be40
commit 0c38102951
4 changed files with 67 additions and 227 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
web/skins/bootstrap/css/skin.css
View File

@ -415,3 +415,24 @@ th.table-th-sort-rev span.table-th-sort-span {
height: 240px; height: 240px;
margin: 5px; margin: 5px;
} }
.event {
float: left;
width: 184px;
margin: 5px;
}
.over {
position: relative;
}
.info {
background: none repeat scroll 0% 0% rgba(0, 0, 0, 0.7);
color: #FFF;
position: absolute;
padding:0 1px;
bottom: 5px;
font-size: 12px;
width: 174px;
left: 5px;
}

8
web/skins/bootstrap/js/app.js
View File

@ -62,6 +62,14 @@ ZoneMinder.factory('Footer', function($http) {
}; };
}); });
ZoneMinder.factory('Events', function($http) {
return {
getEvents: function() {
return $http.get('/api/events.json');
}
};
});
ZoneMinder.factory('Event', function($http) { ZoneMinder.factory('Event', function($http) {
return { return {
getEvent: function(eventId) { getEvent: function(eventId) {

8
web/skins/bootstrap/js/controllers.js
View File

@ -23,6 +23,14 @@ ZoneMinder.controller('LogController', function($scope, Log) {
}); });
}); });
ZoneMinder.controller('EventsController', function($scope, Events) {
Events.getEvents().then(function(results) {
$scope.events = results.data.events;
});
});
ZoneMinder.controller('EventController', function($scope, $location, Event) { ZoneMinder.controller('EventController', function($scope, $location, Event) {
var eventId = $location.search().eid; var eventId = $location.search().eid;

231
web/skins/bootstrap/views/events.php
View File

@ -1,236 +1,39 @@
<?php <?php xhtmlHeaders(__FILE__, $SLANG['Events'] ); ?>
//
// ZoneMinder web events view file, $Date$, $Revision$
// Copyright (C) 2001-2008 Philip Coombes
//
// This program is free software; you can redistribute it and/or
// modify it under the terms of the GNU General Public License
// as published by the Free Software Foundation; either version 2
// of the License, or (at your option) any later version.
//
// This program is distributed in the hope that it will be useful,
// but WITHOUT ANY WARRANTY; without even the implied warranty of
// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
// GNU General Public License for more details.
//
// You should have received a copy of the GNU General Public License
// along with this program; if not, write to the Free Software
// Foundation, Inc., 59 Temple Place - Suite 330, Boston, MA 02111-1307, USA.
//
if ( !canView( 'Events' ) || (!empty($_REQUEST['execute']) && !canEdit('Events')) )
{
$view = "error";
return;
}
if ( !empty($_REQUEST['execute']) )
{
executeFilter( $tempFilterName );
}
$countSql = 'SELECT count(E.Id) AS EventCount FROM Monitors AS M INNER JOIN Events AS E ON (M.Id = E.MonitorId) WHERE';
$eventsSql = 'SELECT E.Id,E.MonitorId,M.Name AS MonitorName,M.DefaultScale,E.Name,E.Width,E.Height,E.Cause,E.Notes,E.StartTime,E.Length,E.Frames,E.AlarmFrames,E.TotScore,E.AvgScore,E.MaxScore,E.Archived FROM Monitors AS M INNER JOIN Events AS E on (M.Id = E.MonitorId) WHERE';
if ( $user['MonitorIds'] ) {
$user_monitor_ids = " M.Id in (".join( ",", preg_split( '/["\'\s]*,["\'\s]*/', $user['MonitorIds'] ) ).")";
$countSql .= $user_monitor_ids;
$eventsSql .= $user_monitor_ids;
} else {
$countSql .= " 1";
$eventsSql .= " 1";
}
parseSort();
parseFilter( $_REQUEST['filter'] );
$filterQuery = $_REQUEST['filter']['query'];
if ( $_REQUEST['filter']['sql'] )
{
$countSql .= $_REQUEST['filter']['sql'];
$eventsSql .= $_REQUEST['filter']['sql'];
}
$eventsSql .= " ORDER BY $sortColumn $sortOrder";
if ( isset($_REQUEST['page']) )
$page = validInt($_REQUEST['page']);
else
$page = 0;
if ( isset($_REQUEST['limit']) )
$limit = validInt($_REQUEST['limit']);
else
$limit = 0;
$nEvents = dbFetchOne( $countSql, 'EventCount' );
if ( !empty($limit) && $nEvents > $limit )
{
$nEvents = $limit;
}
$pages = (int)ceil($nEvents/ZM_WEB_EVENTS_PER_PAGE);
if ( $pages > 1 ) {
if ( !empty($page) ) {
if ( $page < 0 )
$page = 1;
if ( $page > $pages )
$page = $pages;
}
}
if ( !empty($page) ) {
$limitStart = (($page-1)*ZM_WEB_EVENTS_PER_PAGE);
if ( empty( $limit ) )
{
$limitAmount = ZM_WEB_EVENTS_PER_PAGE;
}
else
{
$limitLeft = $limit - $limitStart;
$limitAmount = ($limitLeft>ZM_WEB_EVENTS_PER_PAGE)?ZM_WEB_EVENTS_PER_PAGE:$limitLeft;
}
$eventsSql .= " limit $limitStart, $limitAmount";
} elseif ( !empty( $limit ) ) {
$eventsSql .= " limit 0, ".$limit;
}
$maxWidth = 0;
$maxHeight = 0;
$archived = false;
$unarchived = false;
$events = array();
foreach ( dbFetchAll( $eventsSql ) as $event )
{
$events[] = $event;
$scale = max( reScale( SCALE_BASE, $event['DefaultScale'], ZM_WEB_DEFAULT_SCALE ), SCALE_BASE );
$eventWidth = reScale( $event['Width'], $scale );
$eventHeight = reScale( $event['Height'], $scale );
if ( $maxWidth < $eventWidth ) $maxWidth = $eventWidth;
if ( $maxHeight < $eventHeight ) $maxHeight = $eventHeight;
if ( $event['Archived'] )
$archived = true;
else
$unarchived = true;
}
$maxShortcuts = 5;
$pagination = getPagination( $pages, $page, $maxShortcuts, $filterQuery.$sortQuery.'&amp;limit='.$limit );
$focusWindow = true;
xhtmlHeaders(__FILE__, $SLANG['Events'] );
?>
<body> <body>
<?php include("header.php"); ?> <?php include("header.php"); ?>
<div class="container-fluid"> <div class="container-fluid">
<div class="row"> <div class="row">
<form name="contentForm" id="contentForm" method="post" action="">
<div class="col-md-2"> <div class="col-md-2">
<h2><?= sprintf( $CLANG['EventCount'], $nEvents, zmVlang( $VLANG['Event'], $nEvents ) ) ?></h2> <h2><?= sprintf( $CLANG['EventCount'], $nEvents, zmVlang( $VLANG['Event'], $nEvents ) ) ?></h2>
<?php if ( true || canEdit( 'Events' ) ) { ?> <?php if ( true || canEdit( 'Events' ) ) { ?>
<div class="btn-group-vertical"> <div class="btn-group-vertical">
<input class="btn btn-default" type="button" name="viewBtn" value="<?= $SLANG['View'] ?>" onclick="viewEvents( this, 'markEids' );" disabled="disabled"/>
<input class="btn btn-default" type="button" name="archiveBtn" value="<?= $SLANG['Archive'] ?>" onclick="archiveEvents( this, 'markEids' )" disabled="disabled"/> <input class="btn btn-default" type="button" name="archiveBtn" value="<?= $SLANG['Archive'] ?>" onclick="archiveEvents( this, 'markEids' )" disabled="disabled"/>
<input class="btn btn-default" type="button" name="unarchiveBtn" value="<?= $SLANG['Unarchive'] ?>" onclick="unarchiveEvents( this, 'markEids' );" disabled="disabled"/> <input class="btn btn-default" type="button" name="unarchiveBtn" value="<?= $SLANG['Unarchive'] ?>" onclick="unarchiveEvents( this, 'markEids' );" disabled="disabled"/>
<input class="btn btn-default" type="button" name="editBtn" value="<?= $SLANG['Edit'] ?>" onclick="editEvents( this, 'markEids' )" disabled="disabled"/> <input class="btn btn-default" type="button" name="editBtn" value="<?= $SLANG['Edit'] ?>" onclick="editEvents( this, 'markEids' )" disabled="disabled"/>
<input class="btn btn-default" type="button" name="exportBtn" value="<?= $SLANG['Export'] ?>" onclick="exportEvents( this, 'markEids' )" disabled="disabled"/> <input class="btn btn-default" type="button" name="exportBtn" value="<?= $SLANG['Export'] ?>" onclick="exportEvents( this, 'markEids' )" disabled="disabled"/>
<input class="btn btn-default" type="button" name="deleteBtn" value="<?= $SLANG['Delete'] ?>" onclick="deleteEvents( this, 'markEids' );" disabled="disabled"/> <input class="btn btn-default" type="button" name="deleteBtn" value="<?= $SLANG['Delete'] ?>" onclick="deleteEvents( this, 'markEids' );" disabled="disabled"/>
</div> </div>
<?php } ?> <?php } ?>
</div> </div> <!-- End sidebar .col-md-2 -->
<div class="col-md-10"> <div class="col-md-10" ng-controller="EventsController">
<input type="hidden" name="view" value="<?= $view ?>"/> <div class="event" ng-repeat="event in events">
<input type="hidden" name="action" value=""/> <div>
<input type="hidden" name="page" value="<?= $page ?>"/> <img ng-src="/events/{{ event.thumbData.Path }}" class="img-thumbnail" alt="..." />
<?= $_REQUEST['filter']['fields'] ?> <div class="over">
<input type="hidden" name="sort_field" value="<?= validHtmlStr($_REQUEST['sort_field']) ?>"/> <div class="info">
<input type="hidden" name="sort_asc" value="<?= validHtmlStr($_REQUEST['sort_asc']) ?>"/> <span>Monitor {{event.Event.MonitorId}}</span>
<input type="hidden" name="limit" value="<?= $limit ?>"/> <span>{{ event.Event.StartTime | DateDiff:event.Event.EndTime:'pretty' }}</span>
<?php <span>Event {{event.Event.Id}}</span>
if ( $pagination )
{
?>
<ul class="pagination"><?= $pagination ?></ul>
<?php
}
?>
<table class="table">
<tbody>
<?php
$count = 0;
foreach ( $events as $event )
{
if ( ($count++%ZM_WEB_EVENTS_PER_PAGE) == 0 )
{
?>
<tr>
<th class="colId"><a href="<?= sortHeader( 'Id' ) ?>"><?= $SLANG['Id'] ?><?= sortTag( 'Id' ) ?></a></th>
<th class="colName"><a href="<?= sortHeader( 'Name' ) ?>"><?= $SLANG['Name'] ?><?= sortTag( 'Name' ) ?></a></th>
<th class="colMonitor"><a href="<?= sortHeader( 'MonitorName' ) ?>"><?= $SLANG['Monitor'] ?><?= sortTag( 'MonitorName' ) ?></a></th>
<th class="colCause"><a href="<?= sortHeader( 'Cause' ) ?>"><?= $SLANG['Cause'] ?><?= sortTag( 'Cause' ) ?></a></th>
<th class="colTime"><a href="<?= sortHeader( 'StartTime' ) ?>"><?= $SLANG['Time'] ?><?= sortTag( 'StartTime' ) ?></a></th>
<th class="colDuration"><a href="<?= sortHeader( 'Length' ) ?>"><?= $SLANG['Duration'] ?><?= sortTag( 'Length' ) ?></a></th>
<th class="colFrames"><a href="<?= sortHeader( 'Frames' ) ?>"><?= $SLANG['Frames'] ?><?= sortTag( 'Frames' ) ?></a></th>
<th class="colAlarmFrames"><a href="<?= sortHeader( 'AlarmFrames' ) ?>"><?= $SLANG['AlarmBrFrames'] ?><?= sortTag( 'AlarmFrames' ) ?></a></th>
<th class="colTotScore"><a href="<?= sortHeader( 'TotScore' ) ?>"><?= $SLANG['TotalBrScore'] ?><?= sortTag( 'TotScore' ) ?></a></th>
<th class="colAvgScore"><a href="<?= sortHeader( 'AvgScore' ) ?>"><?= $SLANG['AvgBrScore'] ?><?= sortTag( 'AvgScore' ) ?></a></th>
<th class="colMaxScore"><a href="<?= sortHeader( 'MaxScore' ) ?>"><?= $SLANG['MaxBrScore'] ?><?= sortTag( 'MaxScore' ) ?></a></th>
<?php
if ( ZM_WEB_LIST_THUMBS )
{
?>
<th class="colThumbnail"><?= $SLANG['Thumbnail'] ?></th>
<?php
}
?>
<th class="colMark"><input type="checkbox" name="toggleCheck" value="1" onclick="toggleCheckbox( this, 'markEids' );"<?php if ( !canEdit( 'Events' ) ) { ?> disabled="disabled"<?php } ?>/></th>
</tr>
<?php
}
$scale = max( reScale( SCALE_BASE, $event['DefaultScale'], ZM_WEB_DEFAULT_SCALE ), SCALE_BASE );
?>
<tr>
<td class="colId"><?= makePopupLink( '?view=event&amp;eid='.$event['Id'].$filterQuery.$sortQuery.'&amp;page=1', 'zmEvent', array( 'event', reScale( $event['Width'], $scale ), reScale( $event['Height'], $scale ) ), $event['Id'].($event['Archived']?'*':'') ) ?></td>
<td class="colName"><?= makePopupLink( '?view=event&amp;eid='.$event['Id'].$filterQuery.$sortQuery.'&amp;page=1', 'zmEvent', array( 'event', reScale( $event['Width'], $event['DefaultScale'], ZM_WEB_DEFAULT_SCALE ), reScale( $event['Height'], $event['DefaultScale'], ZM_WEB_DEFAULT_SCALE ) ), validHtmlStr($event['Name']).($event['Archived']?'*':'' ) ) ?></td>
<td class="colMonitorName"><?= $event['MonitorName'] ?></td>
<td class="colCause"><?= makePopupLink( '?view=eventdetail&amp;eid='.$event['Id'], 'zmEventDetail', 'eventdetail', validHtmlStr($event['Cause']), canEdit( 'Events' ), 'title="'.htmlspecialchars($event['Notes']).'"' ) ?></td>
<td class="colTime"><?= strftime( STRF_FMT_DATETIME_SHORTER, strtotime($event['StartTime']) ) ?></td>
<td class="colDuration"><?= $event['Length'] ?></td>
<td class="colFrames"><?= makePopupLink( '?view=frames&amp;eid='.$event['Id'], 'zmFrames', 'frames', $event['Frames'] ) ?></td>
<td class="colAlarmFrames"><?= makePopupLink( '?view=frames&amp;eid='.$event['Id'], 'zmFrames', 'frames', $event['AlarmFrames'] ) ?></td>
<td class="colTotScore"><?= $event['TotScore'] ?></td>
<td class="colAvgScore"><?= $event['AvgScore'] ?></td>
<td class="colMaxScore"><?= makePopupLink( '?view=frame&amp;eid='.$event['Id'].'&amp;fid=0', 'zmImage', array( 'image', reScale( $event['Width'], $scale ), reScale( $event['Height'], $scale ) ), $event['MaxScore'] ) ?></td>
<?php
if ( ZM_WEB_LIST_THUMBS )
{
if ( $thumbData = createListThumbnail( $event ) )
{
?>
<td class="colThumbnail"><?= makePopupLink( '?view=frame&amp;eid='.$event['Id'].'&amp;fid='.$thumbData['FrameId'], 'zmImage', array( 'image', reScale( $event['Width'], $scale ), reScale( $event['Height'], $scale ) ), '<img src="'.viewImagePath( $thumbData['Path'] ).'" width="'.$thumbData['Width'].'" height="'.$thumbData['Height'].'" alt="'.$thumbData['FrameId'].'/'.$event['MaxScore'].'"/>' ) ?></td>
<?php
}
else
{
?>
<td class="colThumbnail">&nbsp;</td>
<?php
}
}
?>
<td class="colMark"><input type="checkbox" name="markEids[]" value="<?= $event['Id'] ?>" onclick="configureButton( this, 'markEids' );"<?php if ( !canEdit( 'Events' ) ) { ?> disabled="disabled"<?php } ?>/></td>
</tr>
<?php
}
?>
</tbody>
</table>
<?php if ( $pagination ) { ?>
<ul class="pagination"><?= $pagination ?></ul>
<?php } ?>
</form>
</div> </div>
</div> </div>
</div> </div>
</div>
</div> <!-- End main .col-md-10 -->
</div>
</div>
</body> </body>
</html> </html>