summaryrefslogtreecommitdiff
path: root/www/js
diff options
context:
space:
mode:
authorPliable Pixels <pliablepixels@gmail.com>2017-12-20 19:30:48 -0500
committerPliable Pixels <pliablepixels@gmail.com>2017-12-20 19:30:48 -0500
commit25154a48d216f5eba7fa78671af0edff169c7dd8 (patch)
tree78d5a22319630fe603cde2d5cadaddc68dac658f /www/js
parent51ac4d1e37b0c5797e419caeaab427fcffc52937 (diff)
#570 formatting and commenting. The feature seems kinda complete
Diffstat (limited to 'www/js')
-rw-r--r--www/js/MomentCtrl.js369
1 files changed, 180 insertions, 189 deletions
diff --git a/www/js/MomentCtrl.js b/www/js/MomentCtrl.js
index 84af262e..e6fc34cf 100644
--- a/www/js/MomentCtrl.js
+++ b/www/js/MomentCtrl.js
@@ -41,24 +41,29 @@ angular.module('zmApp.controllers').controller('zmApp.MomentCtrl', ['$scope', '$
}
};
+ //----------------------------------------------------------------
+ // Given a set of monitor IDs, constructs a string that can
+ // be directly passed to the cake PHP API (/MonitorId != X/...)
+ //----------------------------------------------------------------
function constructMask() {
excludeMonitorsFilter = "";
- for (var i=0; i < excludeMonitors.length; i++) {
- excludeMonitorsFilter = excludeMonitorsFilter + "/MonitorId !=:"+excludeMonitors[i];
+ for (var i = 0; i < excludeMonitors.length; i++) {
+ excludeMonitorsFilter = excludeMonitorsFilter + "/MonitorId !=:" + excludeMonitors[i];
}
- NVRDataModel.debug ("Constructed Monitor Filter ="+excludeMonitorsFilter);
+ NVRDataModel.debug("Constructed Monitor Filter =" + excludeMonitorsFilter);
}
- function process(rawdata) {
- // console.log (JSON.stringify(data));
+ //----------------------------------------------------------------
+ // Given a payload of raw events from JSON, massages it with more
+ // params for moments display
+ //----------------------------------------------------------------
+ function process(rawdata) {
var data = rawdata.data;
NVRDataModel.debug("--------> attempting PAGE " + data.pagination.page + " of " + data.pagination.pageCount);
for (var i = 0; i < data.events.length; i++) {
- // console.log ("pushing "+ JSON.stringify(data.data.events[i]));
-
var d = getMonitorDimensions(data.events[i].Event.MonitorId);
if (d) {
data.events[i].Event.width = d.width;
@@ -83,50 +88,31 @@ angular.module('zmApp.controllers').controller('zmApp.MomentCtrl', ['$scope', '$
}
if (mo != 0) {
-
- /*myevents[i].Event.Rotation = {
- 'transform' : 'rotate('+mo+'deg'+')'
- }; */
-
var tmp = data.events[i].Event.thumbHeight;
data.events[i].Event.thumbHeight = data.events[i].Event.thumbWidth;
data.events[i].Event.thumbWidth = tmp;
} // swap
-
- //console.log (d.width+"*"+d.height);
-
}
data.events[i].Event.hide = false;
data.events[i].Event.icon = "ion-code-working";
//data.events[i].Event.baseURL = NVRDataModel.getBaseURL(data.events[i].Event.MonitorId);
-
- // huh? why did I need the above?
+ // huh? why did I need the above? eventCtrl reverses it with below...
data.events[i].Event.baseURL = NVRDataModel.getLogin().url;
-
data.events[i].Event.monitorName = NVRDataModel.getMonitorName(data.events[i].Event.MonitorId);
-
data.events[i].Event.dateObject = new Date(data.events[i].Event.StartTime);
-
data.events[i].Event.humanizeTime = humanizeTime(data.events[i].Event.StartTime);
-
var mid = data.events[i].Event.MonitorId;
- data.events[i].Event.order = i;
+ data.events[i].Event.order = i; // likely not needed if I stop force sorting
data.events[i].Event.pinned = false;
data.events[i].Event.pinnedIcon = "ion-pin";
-
- // console.log ("---> PUSHING "+data.events[i].Event.StartTime);
moments.push(data.events[i]);
}
-
-
-
-
}
// credit https://stackoverflow.com/a/17265125/1361529
@@ -144,15 +130,12 @@ angular.module('zmApp.controllers').controller('zmApp.MomentCtrl', ['$scope', '$
}
return array.sort(function (obj1, obj2) {
-
- // console.log ("obj1="+JSON.stringify(obj1));
- // console.log ("obj2="+JSON.stringify(obj2));
for (i = 1; i < keys_length; i++) {
key = args[i];
if (typeof key !== 'string') {
- // console.log ("ARGS I 0"+args[i][0]);
desc = key[1];
key = key[0];
+ // hack to extend it as I have nested fields
a = obj1["Event"][args[i][0]];
b = obj2["Event"][args[i][0]];
} else {
@@ -180,6 +163,9 @@ angular.module('zmApp.controllers').controller('zmApp.MomentCtrl', ['$scope', '$
});
} //end of objSort() function
+ //----------------------------------------------------------------
+ // used for placeholder sizing
+ //----------------------------------------------------------------
function getMonitorDimensions(mid) {
for (var i = 0; i < monitors.length; i++) {
@@ -194,22 +180,19 @@ angular.module('zmApp.controllers').controller('zmApp.MomentCtrl', ['$scope', '$
}
}
-
$scope.toggleSubMenu = function () {
-
-
$scope.isSubMenu = !$scope.isSubMenu;
var ld = NVRDataModel.getLogin();
ld.enableMomentSubMenu = $scope.isSubMenu;
NVRDataModel.setLogin(ld);
-
-
if ($scope.isSubMenu)
$ionicScrollDelegate.$getByHandle("moment-delegate").scrollTop();
- //($scope.isSubMenu);
};
+ //----------------------------------------------------------------
+ // increase/decrease thumbnail size
+ //----------------------------------------------------------------
$scope.sizeChanged = function (dirn) {
var sz = $scope.gridSize;
sz = sz + 5 * dirn;
@@ -228,6 +211,9 @@ angular.module('zmApp.controllers').controller('zmApp.MomentCtrl', ['$scope', '$
};
+ //----------------------------------------------------------------
+ // the times when images take too long and masonry gets messed
+ //----------------------------------------------------------------
$scope.reLayout = function () {
NVRDataModel.log("relaying masonry");
$timeout(function () {
@@ -236,61 +222,63 @@ angular.module('zmApp.controllers').controller('zmApp.MomentCtrl', ['$scope', '$
};
- $scope.togglePin =function(ndx) {
+ //----------------------------------------------------------------
+ // Pinning a thumbnail means don't collapse it. Useful to drill
+ // down quickly.
+ //----------------------------------------------------------------
+
+ $scope.togglePin = function (ndx) {
$scope.moments[ndx].Event.pinned = !$scope.moments[ndx].Event.pinned;
if ($scope.moments[ndx].Event.pinned) {
- $scope.moments[ndx].Event.pinnedIcon =" ion-pin assertive";
- }
- else {
- $scope.moments[ndx].Event.pinnedIcon ="ion-pin";
+ $scope.moments[ndx].Event.pinnedIcon = " ion-pin assertive";
+ } else {
+ $scope.moments[ndx].Event.pinnedIcon = "ion-pin";
}
};
-// When a user taps on collapse on an eid,
-// all events after that for the same monitor should be collapsed
-// events before that should remain
+ //----------------------------------------------------------------
+ // fold/unfold monitor groups
+ //----------------------------------------------------------------
+ // When a user taps on collapse on an eid,
+ // all events after that for the same monitor should be collapsed
+ // events before that should remain
-// when a user expands back on an eid, all eids after that for the
-// same monitor should expand, even if they were grouped earlier
+ // when a user expands back on an eid, all eids after that for the
+ // same monitor should expand, even if they were grouped earlier
$scope.toggleCollapse = function (mid, eid, ndx) {
NVRDataModel.debug("toggling collapse for:" + mid);
var collapseCount = 0;
var hide = false;
-
+
$scope.moments[ndx].Event.hide = false;
if ($scope.moments[ndx].Event.icon == 'ion-code-working') {
// we want to hide
hide = true;
$scope.moments[ndx].Event.icon = 'ion-images';
- }
- else { // we want to show
+ } else { // we want to show
hide = false;
$scope.moments[ndx].Event.icon = 'ion-code-working';
}
- for (var i = ndx+1; i < $scope.moments.length; i++ ) {
- if ($scope.moments[i].Event.MonitorId == mid && !$scope.moments[i].Event.pinned ) {
+ for (var i = ndx + 1; i < $scope.moments.length; i++) {
+ if ($scope.moments[i].Event.MonitorId == mid && !$scope.moments[i].Event.pinned) {
$scope.moments[i].Event.hide = hide;
$scope.moments[i].Event.icon = "ion-code-working";
$scope.moments[i].Event.collapseCount = "";
if (hide) collapseCount++;
- //console.log ("Hiding " + i);
}
} //for
if (hide) {
// +1 for the marked frame which doesn't get counted
- $scope.moments[ndx].Event.collapseCount = collapseCount+1;
+ $scope.moments[ndx].Event.collapseCount = collapseCount + 1;
} else {
$scope.moments[ndx].Event.collapseCount = "";
}
-
-
-
$timeout(function () {
masonry.reloadItems();
@@ -304,12 +292,15 @@ angular.module('zmApp.controllers').controller('zmApp.MomentCtrl', ['$scope', '$
$timeout(function () {
masonry.layout();
- // $ionicScrollDelegate.$getByHandle("moment-delegate").scrollTop();
+ // $ionicScrollDelegate.$getByHandle("moment-delegate").scrollTop();
}, 600);
};
+ //----------------------------------------------------------------
+ // convenience fn to show hh:mm of event
+ //----------------------------------------------------------------
$scope.hourmin = function (str) {
return moment(str).format(NVRDataModel.getTimeFormat());
@@ -320,18 +311,22 @@ angular.module('zmApp.controllers').controller('zmApp.MomentCtrl', ['$scope', '$
$scope.modal.remove();
};
+ //----------------------------------------------------------------
+ // Write hidden monitors to storage so its remembered
+ //----------------------------------------------------------------
+
$scope.saveMask = function () {
$scope.modal.remove();
excludeMonitors = [];
-
- for (var i=0; i < $scope.monitors.length; i++) {
- if ($scope.monitors[i].Monitor.listDisplay == 'noshow') {
- excludeMonitors.push($scope.monitors[i].Monitor.Id);
- }
+ // convert selection list to array, so we can pass it to createMask
+ // which in turn creates the actual string for the API to exclude mons
+ for (var i = 0; i < $scope.monitors.length; i++) {
+ if ($scope.monitors[i].Monitor.listDisplay == 'noshow') {
+ excludeMonitors.push($scope.monitors[i].Monitor.Id);
+ }
}
- //console.log ("ENDED");
constructMask();
var ld = NVRDataModel.getLogin();
@@ -344,55 +339,52 @@ angular.module('zmApp.controllers').controller('zmApp.MomentCtrl', ['$scope', '$
};
- $scope.toggleHide = function(i)
- {
+ //----------------------------------------------------------------
+ // Called by moments-mask to change color of list items
+ //----------------------------------------------------------------
+ $scope.toggleHide = function (i) {
- if ($scope.monitors[i].Monitor.listDisplay == 'show') {
- $scope.monitors[i].Monitor.listDisplay = 'noshow';
+ if ($scope.monitors[i].Monitor.listDisplay == 'show') {
+ $scope.monitors[i].Monitor.listDisplay = 'noshow';
- }
-
- else {
- $scope.monitors[i].Monitor.listDisplay = 'show';
-
- }
-
+ } else {
+ $scope.monitors[i].Monitor.listDisplay = 'show';
+
+ }
- NVRDataModel.debug("index " + i + " is now " + $scope.monitors[i].Monitor.listDisplay);
-
- };
+ NVRDataModel.debug("index " + i + " is now " + $scope.monitors[i].Monitor.listDisplay);
- $scope.hideUnhide = function() {
+ };
- //console.log (JSON.stringify(monitors));
-
+ //----------------------------------------------------------------
+ // Invokes moment-mask to enable/disable hidden mons
+ //----------------------------------------------------------------
+ $scope.hideUnhide = function () {
$scope.monitors = monitors;
- $ionicModal.fromTemplateUrl('templates/moment-mask.html',
- {
- scope: $scope,
- animation: 'slide-in-up',
- id:'reorder',
- })
- .then(function(modal)
- {
- $scope.modal = modal;
- $scope.modal.show();
- });
+ $ionicModal.fromTemplateUrl('templates/moment-mask.html', {
+ scope: $scope,
+ animation: 'slide-in-up',
+ id: 'reorder',
+ })
+ .then(function (modal) {
+ $scope.modal = modal;
+ $scope.modal.show();
+ });
};
+
function humanizeTime(str) {
- //console.log ("Time:"+str+" TO LOCAL " + moment(str).local().toString());
- //if (NVRDataModel.getLogin().useLocalTimeZone)
return moment.tz(str, NVRDataModel.getTimeZoneNow()).fromNow();
- // else
- // return moment(str).fromNow();
-
}
+ //----------------------------------------------------------------
+ // Like Packery but Masonry offers a mechanism to keep the order
+ // of images. Pretty important for a timeline related function
+ //----------------------------------------------------------------
function initMasonry() {
$ionicLoading.show({
template: $translate.instant('kArrangingImages'),
@@ -406,14 +398,13 @@ angular.module('zmApp.controllers').controller('zmApp.MomentCtrl', ['$scope', '$
var elem = angular.element(document.getElementById("mygrid"));
masonry = new Masonry('.grid', {
itemSelector: '.grid-item',
- // columnWidth: 10
- horizontalOrder: true,
+ horizontalOrder: true, // this keeps the order
gutter: 0,
initLayout: true,
percentPosition: true,
});
- //console.log ("**** mygrid is " + JSON.stringify(elem));
+
imagesLoaded(elem).on('progress', function (instance, img) {
masonry.layout();
@@ -444,6 +435,10 @@ angular.module('zmApp.controllers').controller('zmApp.MomentCtrl', ['$scope', '$
};
+ //----------------------------------------------------------------
+ // Loads the modal to play an event
+ //----------------------------------------------------------------
+
$scope.playEvent = function (event) {
$scope.currentEvent = event;
@@ -453,38 +448,39 @@ angular.module('zmApp.controllers').controller('zmApp.MomentCtrl', ['$scope', '$
$scope.followSameMonitor = "0";
$scope.mycarousel = {
index: 0
- };
+ };
- $scope.ionRange = {
+ $scope.ionRange = {
index: 1
- };
+ };
- $ionicModal.fromTemplateUrl('templates/events-modal.html',
- {
- scope: $scope,
- animation: 'slide-in-up',
- id: 'footage',
- })
- .then(function(modal)
- {
- $scope.modal = modal;
+ $ionicModal.fromTemplateUrl('templates/events-modal.html', {
+ scope: $scope,
+ animation: 'slide-in-up',
+ id: 'footage',
+ })
+ .then(function (modal) {
+ $scope.modal = modal;
- $ionicLoading.show(
- {
- template: $translate.instant('kPleaseWait') + "...",
- noBackdrop: true,
- duration: 10000
- });
+ $ionicLoading.show({
+ template: $translate.instant('kPleaseWait') + "...",
+ noBackdrop: true,
+ duration: 10000
+ });
- $scope.modal.show();
+ $scope.modal.show();
- var ld = NVRDataModel.getLogin();
+ var ld = NVRDataModel.getLogin();
- });
+ });
};
+ //----------------------------------------------------------------
+ // Not used for now - superceded by play Event
+ //----------------------------------------------------------------
+
$scope.showThumbnail = function (b, f) {
if (!f) { // api update needed
@@ -517,8 +513,11 @@ angular.module('zmApp.controllers').controller('zmApp.MomentCtrl', ['$scope', '$
};
+ //----------------------------------------------------------------
+ // Only called by "here" button without cond. So prev type is used
+ //----------------------------------------------------------------
$scope.getMoments = function (cond) {
- if (!cond) cond = momentType;
+ if (!cond) cond = momentType;
getMoments(cond);
};
@@ -527,29 +526,35 @@ angular.module('zmApp.controllers').controller('zmApp.MomentCtrl', ['$scope', '$
}
+ //----------------------------------------------------------------
+ // used to go forward (+1) or back (-1) in time by 24 hrs
+ //----------------------------------------------------------------
$scope.changeFrom = function (dirn) {
var f;
- if (dirn==1) { // add a day
+ if (dirn == 1) { // add a day
t = moment(timeTo);
- t.add (1, "day");
+ t.add(1, "day");
if (t > moment()) {
- NVRDataModel.log ("Future date selected, ignoring");
+ NVRDataModel.log("Future date selected, ignoring");
return;
}
- console.log ("T="+t.format("MMM DD,YYYY HH:mm"));
- }
- else {
+ console.log("T=" + t.format("MMM DD,YYYY HH:mm"));
+ } else {
t = moment(timeTo);
- t.subtract (1, "day");
- console.log ("T="+t.format("MMM DD,YYYY HH:mm"));
+ t.subtract(1, "day");
+ console.log("T=" + t.format("MMM DD,YYYY HH:mm"));
}
var newTo = t.format("YYYY-MM-DD HH:mm:ss");
- getMoments(momentType,newTo);
+ getMoments(momentType, newTo);
};
+ //----------------------------------------------------------------
+ // The entire point of this controller.
+ //----------------------------------------------------------------
+
function getMoments(sortCondition, to) {
if (sortCondition == 'MaxScore')
@@ -566,38 +571,39 @@ angular.module('zmApp.controllers').controller('zmApp.MomentCtrl', ['$scope', '$
var tmptimeto, tmptimefrom;
- if (!to) {// assume current time
+ if (!to) { // assume current time
tmptimeto = moment();
- }
- else {
+ } else {
tmptimeto = moment(to);
}
-
+
tmptimefrom = angular.copy(tmptimeto);
tmptimefrom.subtract(24, 'hours'); // mutable, hence deep copy above
-
var page = 1;
timeFrom = tmptimefrom.format('YYYY-MM-DD HH:mm:ss');
timeTo = tmptimeto.format('YYYY-MM-DD HH:mm:ss');
- $scope.displayTimeFrom = moment(timeFrom).format("MMM DD,"+NVRDataModel.getTimeFormat());
- $scope.displayTimeTo = moment(timeTo).format("MMM DD,"+NVRDataModel.getTimeFormat());
+ $scope.displayTimeFrom = moment(timeFrom).format("MMM DD," + NVRDataModel.getTimeFormat());
+ $scope.displayTimeTo = moment(timeTo).format("MMM DD," + NVRDataModel.getTimeFormat());
NVRDataModel.debug("Moments from " + timeFrom + " to " + timeTo);
+ // format:
//https:///zm/api/events/index/AlarmFrames%20%3E=:1/StartTime%20%3E=:2017-12-16%2009:08:50.json?sort=TotScore&direction=desc
var ld = NVRDataModel.getLogin();
// in API, always sort by StartTime so all monitors are represented
- var myurl = ld.apiurl + "/events/index/AlarmFrames >=:1"+excludeMonitorsFilter+"/StartTime >=:" + timeFrom + "/StartTime <=:"+timeTo+ ".json?sort=" + "StartTime" + "&direction=desc";
+ var myurl = ld.apiurl + "/events/index/AlarmFrames >=:1" + excludeMonitorsFilter + "/StartTime >=:" + timeFrom + "/StartTime <=:" + timeTo + ".json?sort=" + "StartTime" + "&direction=desc";
NVRDataModel.debug("Retrieving " + myurl);
-
+ // very cool trick to parallel fork HTTP requests and not bork on errors. Basically, we catch errors and ignore
+ // noop is a dummy function that does nothing
+ // credit https://stackoverflow.com/a/20594522/1361529
$q.all([
$http.get(myurl + '&page=1').then(process).catch(noop),
$http.get(myurl + '&page=2').then(process).catch(noop),
@@ -606,7 +612,7 @@ angular.module('zmApp.controllers').controller('zmApp.MomentCtrl', ['$scope', '$
])
.then(function () {
- NVRDataModel.debug ("$a.all Parallel queries completed");
+ NVRDataModel.debug("$a.all Parallel queries completed");
if (!moments.length) {
$scope.loadingStatus = $translate.instant('kMomentNoneFound');
@@ -633,30 +639,20 @@ angular.module('zmApp.controllers').controller('zmApp.MomentCtrl', ['$scope', '$
// check the very first element for presence of maxscoreframe id
// if its not there, we can't show snuff
if (moments.length && !moments[0].Event.MaxScoreFrameId) {
- $ionicPopup.alert({
- title: $translate.instant('kNote'),
- template: "{{'kApiUpgrade' | translate }}",
- okText: $translate.instant('kButtonOk'),
- cancelText: $translate.instant('kButtonCancel'),
- });
- }
-
- else {
- $scope.moments = moments;
- $timeout(function () {
- initMasonry();
- }, 300);
+ $ionicPopup.alert({
+ title: $translate.instant('kNote'),
+ template: "{{'kApiUpgrade' | translate }}",
+ okText: $translate.instant('kButtonOk'),
+ cancelText: $translate.instant('kButtonCancel'),
+ });
+ } else {
+ $scope.moments = moments;
+ $timeout(function () {
+ initMasonry();
+ }, 300);
}
-
- /* if (sortCondition == "MonitorId") {
- moments.sort(function(a, b) {
- var da = a.Event.MonitorId;
- var db = b.Event.MonitorId;
- return da>db ? -1 : da<db ? 1 : 0;
- });
- }*/
});
@@ -664,56 +660,53 @@ angular.module('zmApp.controllers').controller('zmApp.MomentCtrl', ['$scope', '$
}
+ //----------------------------------------------------------------
+ //
+ //----------------------------------------------------------------
+
$scope.$on('$ionicView.beforeLeave', function () {
NVRDataModel.debug("Destroying masonry");
masonry.destroy();
});
- $scope.toggleIcons = function() {
+ //----------------------------------------------------------------
+ // lets you hide overlays - useful for tiny screens
+ //----------------------------------------------------------------
+ $scope.toggleIcons = function () {
$scope.showIcons = !$scope.showIcons;
};
- $scope.$on('$ionicView.beforeEnter', function () {
- /*var w = Math.round(parseInt($rootScope.devWidth) / parseInt($rootScope.pixelRatio)) ;
-
- w = $rootScope.devWidth;
-
- var p = w / 100;
+ //----------------------------------------------------------------
+ // Stuff before the view loads
+ //----------------------------------------------------------------
- console.log ("old P="+p);
- p = Math.ceil(p/5)*5;
- console.log ("P="+p);*/
+ $scope.$on('$ionicView.beforeEnter', function () {
$scope.showIcons = true;
-
var ld = NVRDataModel.getLogin();
$scope.loadingStatus = $translate.instant('kLoading');
$scope.gridSize = ld.momentGridSize;
excludeMonitors = JSON.parse(ld.momentMonitorFilter || []);
- console.log ("RETRIEVED EXCLUDE="+JSON.stringify(excludeMonitors));
+ console.log("RETRIEVED EXCLUDE=" + JSON.stringify(excludeMonitors));
constructMask();
$scope.isSubMenu = ld.enableMomentSubMenu;
- monitors = angular.copy(message);
+ monitors = angular.copy(message); // don't mess up the main monitors list
+
+ for (var i = 0; i < monitors.length; i++) {
+ if (excludeMonitors.indexOf(monitors[i].Monitor.Id) != -1) {
+ monitors[i].Monitor.listDisplay = 'noshow';
+ console.log("Marking monitor " + monitors[i].Monitor.Id + " as noshow");
+ }
- for (var i=0; i < monitors.length; i++) {
- if (excludeMonitors.indexOf(monitors[i].Monitor.Id) != -1) {
- monitors[i].Monitor.listDisplay = 'noshow';
- console.log ("Marking monitor " + monitors[i].Monitor.Id+ " as noshow");
- }
-
}
-
+
});
$scope.$on('$ionicView.afterEnter', function () {
-
-
-
-
$ionicPopover.fromTemplateUrl('templates/moment-popover.html', {
scope: $scope,
}).then(function (popover) {
@@ -722,8 +715,6 @@ angular.module('zmApp.controllers').controller('zmApp.MomentCtrl', ['$scope', '$
getMoments(momentType);
- //getMoments ("MaxScore");
-
});