summaryrefslogtreecommitdiff
path: root/www
diff options
context:
space:
mode:
Diffstat (limited to 'www')
-rw-r--r--www/css/style.css7
-rw-r--r--www/img/noevent.pngbin0 -> 42270 bytes
-rw-r--r--www/js/MontageHistoryCtrl.js109
-rw-r--r--www/templates/montage-history.html78
4 files changed, 147 insertions, 47 deletions
diff --git a/www/css/style.css b/www/css/style.css
index 2a4ba025..ffda637f 100644
--- a/www/css/style.css
+++ b/www/css/style.css
@@ -220,6 +220,13 @@ http://www.cssportal.com/tryit/index.php?file=blog/css-notification-badge */
transform: translate(-50%, -50%);
}
+.timeline_text {
+ text-align:center;
+ color:white;
+
+
+}
+
.ptzcenteredbutton
{
position: absolute;
diff --git a/www/img/noevent.png b/www/img/noevent.png
new file mode 100644
index 00000000..3fb3bfd4
--- /dev/null
+++ b/www/img/noevent.png
Binary files differ
diff --git a/www/js/MontageHistoryCtrl.js b/www/js/MontageHistoryCtrl.js
index fa1e9247..bdbfeea5 100644
--- a/www/js/MontageHistoryCtrl.js
+++ b/www/js/MontageHistoryCtrl.js
@@ -4,6 +4,8 @@
/* global cordova,StatusBar,angular,console,ionic,Masonry,moment */
+// FIXME: This is a copy of montageCtrl - needs a lot of code cleanup
+
angular.module('zmApp.controllers').controller('zmApp.MontageHistoryCtrl', ['$scope', '$rootScope', 'ZMDataModel', 'message', '$ionicSideMenuDelegate', '$timeout', '$interval', '$ionicModal', '$ionicLoading', '$http', '$state', '$ionicPopup', '$stateParams', '$ionicHistory', '$ionicScrollDelegate', '$ionicPlatform', 'zm', '$ionicPopover', '$controller', 'imageLoadingDataShare', '$window', function ($scope, $rootScope, ZMDataModel, message, $ionicSideMenuDelegate, $timeout, $interval, $ionicModal, $ionicLoading, $http, $state, $ionicPopup, $stateParams, $ionicHistory, $ionicScrollDelegate, $ionicPlatform, zm, $ionicPopover, $controller, imageLoadingDataShare, $window) {
$controller('zmApp.BaseController', {
@@ -27,7 +29,7 @@ angular.module('zmApp.controllers').controller('zmApp.MontageHistoryCtrl', ['$sc
}
$scope.prettifyTime = function (str) {
- console.log ("got " + str);
+
return moment(str).format('h:mm a');
};
@@ -36,33 +38,61 @@ angular.module('zmApp.controllers').controller('zmApp.MontageHistoryCtrl', ['$sc
return moment(str).format('h:mm:ssa on MMMM Do YYYY');
};
- $scope.toggleTimeDisplay = function()
+
+
+
+ $scope.footerCollapse = function()
{
- console.log ("TOGGLING");
- $scope.displayDateTimeSliders = !$scope.displayDateTimeSliders;
- if ($scope.displayDateTimeSliders)
- {
- $scope.showtimers=true;
- }
- else
+ window.stop();
+
+
+ $scope.sliderVal.realRate = $scope.sliderVal.rate *100;
+ ZMDataModel.zmDebug ("Playback rate is:" + $scope.sliderVal.realRate);
+ for (var i=0; i< $scope.MontageMonitors.length; i++)
{
- $timeout(function()
- { $scope.showtimers=false; },300);
+ $scope.MontageMonitors[i].eventUrl = "img/noevent.png";
+
}
-
- /*var element = angular.element(document.getElementById("historydials"));
- if (!$scope.displayDateTimeSliders)
- {
+ var TimeObjectFrom = $scope.sliderVal.year+"-"+$scope.sliderVal.month+"-"+$scope.sliderVal.day+" "+$scope.sliderVal.hour+":"+$scope.sliderVal.min;
+
+
+
+ var TimeObjectTo = moment(TimeObjectFrom).add(1,'hour').format('YYYY-MM-DD HH:mm');
+
- element.removeClass("animated fadeInDown");
- element.addClass("animated fadeOutUp");
- }
- */
-
+ var apiurl = ld.apiurl + "/events/index/StartTime >=:"+TimeObjectFrom+"/StartTime <=:"+ TimeObjectTo+".json";
+
+ console.log ("New URL to get is " + apiurl);
+
+ $http.get(apiurl)
+ .success( function(data) {
+ ZMDataModel.zmDebug ("Got new history events:"+ JSON.stringify(data));
+ var eid, mid;
+ for (i=0; i<data.events.length; i++)
+ {
+ mid = data.events[i].Event.MonitorId;
+ eid = data.events[i].Event.Id;
+
+ // only take the first one for each monitor
+ // that's the earliest match and play gapless from there
+ if ($scope.MontageMonitors[mid].eventUrl == 'img/noevent.png')
+ $scope.MontageMonitors[mid].eventUrl=ld.streamingurl+"/nph-zms?source=event&mode=jpeg&event="+eid+"&frame=1&replay=gapless";
+ console.log ("Monitor " + mid + " url is " + $scope.MontageMonitors[mid].eventUrl);
+ }
+
+
+
+
+ })
+ .error (function (data) {
+ ZMDataModel.zmDebug ("history ERROR:"+ JSON.stringify(data));
+
+ });
+
};
$scope.displayDateTimeSliders = true;
@@ -73,9 +103,24 @@ angular.module('zmApp.controllers').controller('zmApp.MontageHistoryCtrl', ['$sc
month:1,
day:1,
hour:0,
- min:0
+ min:0,
+ rate:1,
+ realRate:100,
+ hideNoEvents:false,
};
+ // start with a day ago
+ var timenow = moment().subtract('1','day');
+ $scope.sliderVal.year = timenow.format("YYYY");
+ $scope.sliderVal.month = timenow.format("MM");
+ $scope.sliderVal.day = timenow.format("DD");
+ $scope.sliderVal.hour = timenow.format("HH");
+ $scope.sliderVal.min = 0;
+ $scope.sliderVal.rate = 1;
+ $scope.sliderVal.realRate = $scope.sliderVal.rate *100;
+
+
+
var commonCss =
{
@@ -98,6 +143,20 @@ angular.module('zmApp.controllers').controller('zmApp.MontageHistoryCtrl', ['$sc
"background-color": "red"
} // use it if double value
};
+
+
+ $scope.slider_modal_options_rate = {
+ from: 1,
+ to: 10,
+ realtime: true,
+ step: 1,
+ className: "mySliderClass",
+ //modelLabels:function(val) {return "";},
+ smooth: false,
+ css: commonCss,
+ dimension:'X'
+
+ };
$scope.slider_modal_options_YY = {
from: 2010,
@@ -148,7 +207,7 @@ angular.module('zmApp.controllers').controller('zmApp.MontageHistoryCtrl', ['$sc
from: 0,
to: 59,
realtime: true,
- step: 1,
+ step: 29,
className: "mySliderClass",
//modelLabels:function(val) {return "";},
smooth: false,
@@ -214,6 +273,12 @@ angular.module('zmApp.controllers').controller('zmApp.MontageHistoryCtrl', ['$sc
$scope.packMontage = loginData.packMontage;
+ for (i=0; i< $scope.MontageMonitors.length; i++)
+ {
+ $scope.MontageMonitors[i].eventUrl = "img/noevent.png";
+
+ }
+
diff --git a/www/templates/montage-history.html b/www/templates/montage-history.html
index 620f8386..173aaf5a 100644
--- a/www/templates/montage-history.html
+++ b/www/templates/montage-history.html
@@ -1,4 +1,4 @@
-<ion-view title="Montage" cache-view="false" hide-nav-bar="{{minimal}}">
+<ion-view title="History" cache-view="false" hide-nav-bar="{{minimal}}">
<ion-nav-buttons side="left">
<button class="button button-icon button-clear ion-navicon" ng-click="openMenu()"></button>
@@ -22,9 +22,9 @@
</button>
</span>
-
+ <!--
<button class="button button-icon button-clear ion-android-contract" ng-click="switchMinimal()">
- </button>
+ </button>-->
<!--<button class="button button-icon ion-ios-help-outline" ng-click="popover.show($event)"></button>-->
@@ -41,6 +41,9 @@
<span ng-show="!minimal">
+
+ <div class="timeline_text"><b>Timeline starting: {{prettifyDate(sliderVal.year+"-"+sliderVal.month+"-"+sliderVal.day)}} at {{prettifyTime(sliderVal.year+"-"+sliderVal.month+"-"+sliderVal.day+" "+sliderVal.hour+":"+sliderVal.min)}}@ {{sliderVal.rate}}x</b></div>
+
<div class="range range-positive">
<i style="color:#bbbbbb" class="icon ion-image"></i>
<input type="range" ng-model="slider.monsize" min="1"
@@ -58,26 +61,33 @@
<span ng-repeat="monitor in MontageMonitors|limitTo: monLimit"
ng-if="monitor.Monitor.Function!='None' && monitor.Monitor.listDisplay!='noshow' && monitor.Monitor.Enabled !='0'">
- <!-- back to ng-src. spinner was not updating when rand changes-->
- <!-- moving to single so I can rely on rand for reloads -->
-
-
- <!--src=" /zm/cgi-bin/nph-zms?source=event&mode=jpeg&event=7664&frame=1&scale=100&rate=100&maxfps=5&replay=gapless&auth=6b8c60f81fa2edff94f80f12bdebd98d&connkey=286643&rand=1453671607"
-
-
-https://arjunrc.ddns.net:8889/zm/api/events/index/StartTime%20=:2016-01-25.json
-
-Events started in X-X+30
-https://arjunrc.ddns.net:8889/zm/api/events/index/StartTime%20%3E=:2016-01-25%2000:00:00/StartTime%20%3C=:2016-01-25%2000:30:00.json
--->
+
<div style="position: relative;width:{{devWidth/slider.monsize}}px;">
<div ng-if="!isModalActive">
<div ng-if="$root.authSession!='undefined' && !isBackground()">
- <div ng-if = "!minimal">
- <img id="img-$index" image-spinner-src="{{LoginData.streamingurl}}/nph-zms?mode=single&monitor={{monitor.Monitor.Id}}&scale={{LoginData.montageQuality}}{{$root.authSession}}&rand={{$root.rand}}" image-spinner-loader="lines" style="
+ <div ng-if = "!minimal && monitor.eventUrl == 'img/noevent.png' && !sliderVal.hideNoEvents">
+ <img id="img-$index" image-spinner-src="{{monitor.eventUrl}}" image-spinner-loader="lines" style="
+ width: 100% !important;
+ height: auto !important;" />
+ <div style="position:absolute; bottom:0%; right:0%;white-space:nowrap;overflow:hidden;"
+ class="header">
+ &nbsp;<i class="ion-monitor"></i>
+ {{monitor.Monitor.Name}}&nbsp;
+ </div>
+ </div>
+
+ <div ng-if = "!minimal && monitor.eventUrl != 'img/noevent.png'">
+ <img id="img-$index" image-spinner-src="{{monitor.eventUrl}}&scale={{LoginData.singleImageQuality}}{{$root.authSession}}&rand={{$root.rand}}&rate={{sliderVal.realRate}}" image-spinner-loader="lines" style="
width: 100% !important;
height: auto !important;" />
+
+ <div style="position:absolute; bottom:0%; right:0%;white-space:nowrap;overflow:hidden;"
+ class="header">
+ &nbsp;<i class="ion-monitor"></i>
+ {{monitor.Monitor.Name}}&nbsp;
+ </div>
+
</div>
<div ng-if = "minimal">
@@ -94,6 +104,7 @@ https://arjunrc.ddns.net:8889/zm/api/events/index/StartTime%20%3E=:2016-01-25%20
height: auto !important;" />
</div>
+
</div>
@@ -142,31 +153,48 @@ https://arjunrc.ddns.net:8889/zm/api/events/index/StartTime%20%3E=:2016-01-25%20
</div>
- <ion-pull-up-footer class="bar-dark" on-expand="footerExpand()" on-collapse="footerCollapse()" initial-state="minimized" default-behavior="expand">
+ <ion-pull-up-footer class="bar-dark" on-minimize="footerCollapse()" on-collapse="footerCollapse()" initial-state="minimized" default-behavior="expand">
<ion-pull-up-handle width="100" height="25" toggle="ion-chevron-up ion-chevron-down" style="border-radius: 25px 25px 0 0">
<i class="icon ion-chevron-up"></i>
</ion-pull-up-handle>
<ion-pull-up-bar>
- <h1 class="title" ion-pull-up-trigger>Timeline Browser</h1>
+ <h1 class="title" ion-pull-up-trigger>Event History</h1>
</ion-pull-up-bar>
<ion-pull-up-content scroll="true">
<div class="list list-inset">
- <div class="item item-divider">Timeline starting: {{prettifyDate(sliderVal.year+"-"+sliderVal.month+"-"+sliderVal.day)}} at {{prettifyTime(sliderVal.year+"-"+sliderVal.month+"-"+sliderVal.day+" "+sliderVal.hour+":"+sliderVal.min)}}</div>
+
+ <ion-toggle ng-model="sliderVal.hideNoEvents"
+ ng-checked="{{sliderVal.hideNoEvents}}"
+ toggle-class="toggle-dark">Hide monitors without events</ion-toggle>
+
+
+ <div class="item item-divider">History at: {{prettifyDate(sliderVal.year+"-"+sliderVal.month+"-"+sliderVal.day)}} at {{prettifyTime(sliderVal.year+"-"+sliderVal.month+"-"+sliderVal.day+" "+sliderVal.hour+":"+sliderVal.min)}} </div>
+
+
+ <div class="item"><br/><div style="width:90%"><input ng-model="sliderVal.rate" type="text" id="mySlider6" slider options="slider_modal_options_rate"/></div><br/></div>
+
+ <div class="item"><br/><div style="width:90%"><input ng-model="sliderVal.min" type="text" id="mySlider5" slider options="slider_modal_options_mm"/></div><br/></div>
+
+ <div class="item"><br/><div style="width:90%"><input ng-model="sliderVal.hour" type="text" id="mySlider4" slider options="slider_modal_options_hh"/></div><br/></div>
+
+ <div class="item"><br/><div style="width:90%"><input ng-model="sliderVal.day" type="text" id="mySlider3" slider options="slider_modal_options_DD"/></div><br/></div>
+
+ <div class="item" ><br/><div style="width:90%"><input ng-model="sliderVal.month" type="text" id="mySlider2" slider options="slider_modal_options_MM"/></div><br/></div>
- <div class="item" ><br/><input ng-model="sliderVal.year" type="text" id="mySlider1" slider options="slider_modal_options_YY" /><br/></div>
+ <div class="item" ><br/><div style="width:90%"><input ng-model="sliderVal.year" type="text" id="mySlider1" slider options="slider_modal_options_YY" /></div><br/></div>
- <div class="item" ><br/><input ng-model="sliderVal.month" type="text" id="mySlider2" slider options="slider_modal_options_MM"/><br/></div>
+
- <div class="item"><br/><input ng-model="sliderVal.day" type="text" id="mySlider3" slider options="slider_modal_options_DD"/><br/></div>
+
- <div class="item"><br/><input ng-model="sliderVal.hour" type="text" id="mySlider4" slider options="slider_modal_options_hh"/><br/></div>
+
- <div class="item"><br/><input ng-model="sliderVal.min" type="text" id="mySlider5" slider options="slider_modal_options_mm"/><br/></div>
+
</div>
</ion-pull-up-content>
</ion-pull-up-footer>
generated by cgit v1.2.3 (git 2.25.1) at 2025-12-06 14:14:25 +0000