diff options
Diffstat (limited to 'www')
| -rw-r--r-- | www/css/style.css | 6 | ||||
| -rw-r--r-- | www/js/TimelineCtrl.js | 81 | ||||
| -rw-r--r-- | www/lang/locale-en.json | 4 | ||||
| -rw-r--r-- | www/templates/timeline.html | 8 |
4 files changed, 63 insertions, 36 deletions
diff --git a/www/css/style.css b/www/css/style.css index 8bb8c692..0baec5fb 100644 --- a/www/css/style.css +++ b/www/css/style.css @@ -97,6 +97,12 @@ image-loader { z-index: 9999; } + + +#visualization { + + height: 70vh; +} ion-popover-view.fit { height: auto; } diff --git a/www/js/TimelineCtrl.js b/www/js/TimelineCtrl.js index e2305e6f..450f5a6e 100644 --- a/www/js/TimelineCtrl.js +++ b/www/js/TimelineCtrl.js @@ -196,7 +196,8 @@ angular.module('zmApp.controllers').controller('zmApp.TimelineCtrl', ['$ionicPla scope: $scope, // give ModalCtrl access to this scope animation: 'slide-in-up', id: 'footage', - showLive: sl + showLive: sl, + disableDrag: true }) .then(function (modal) { $scope.modal = modal; @@ -227,6 +228,7 @@ angular.module('zmApp.controllers').controller('zmApp.TimelineCtrl', ['$ionicPla NVR.debug("TimelineCtrl:Close & Destroy Modal"); NVR.stopNetwork("TimelineCtrl: closeModal"); NVR.setAwake(false); + if ($scope.modal !== undefined) { $scope.modal.remove(); } @@ -235,6 +237,7 @@ angular.module('zmApp.controllers').controller('zmApp.TimelineCtrl', ['$ionicPla $timeout(function () { drawGraph($scope.fromDate, $scope.toDate, maxItems); + }, 500); } @@ -324,18 +327,18 @@ angular.module('zmApp.controllers').controller('zmApp.TimelineCtrl', ['$ionicPla });*/ $scope.$on('$ionicView.beforeEnter', function () { - - $scope.$on ( "process-push", function () { - NVR.debug (">> TimelineCtrl: push handler"); - var s = NVR.evaluateTappedNotification(); - NVR.debug("tapped Notification evaluation:"+ JSON.stringify(s)); - $ionicHistory.nextViewOptions({ - disableAnimate:true, - disableBack: true + $ionicSideMenuDelegate.canDragContent(false); + $scope.$on ( "process-push", function () { + NVR.debug (">> TimelineCtrl: push handler"); + var s = NVR.evaluateTappedNotification(); + NVR.debug("tapped Notification evaluation:"+ JSON.stringify(s)); + $ionicHistory.nextViewOptions({ + disableAnimate:true, + disableBack: true + }); + $state.go(s[0],s[1],s[2]); }); - $state.go(s[0],s[1],s[2]); - }); - + //$ionicHistory.clearCache(); //$ionicHistory.clearHistory(); timeline_instance = ''; @@ -448,7 +451,7 @@ angular.module('zmApp.controllers').controller('zmApp.TimelineCtrl', ['$ionicPla // Make sure sliding for menu is disabled so it // does not interfere with graph panning - $ionicSideMenuDelegate.canDragContent(false); + var ld = NVR.getLogin(); maxItemsConf = ($rootScope.platformOS == 'desktop') ? zm.graphDesktopItemMax : zm.graphItemMax; maxItems = ld.graphSize || maxItemsConf; @@ -564,7 +567,7 @@ angular.module('zmApp.controllers').controller('zmApp.TimelineCtrl', ['$ionicPla var groups, graphData; var isProcessNewEventsWaiting = false; var options; - var dblclick = false; + var lastClicked = moment(); $scope.mycarousel = { index: 0 @@ -1100,10 +1103,17 @@ angular.module('zmApp.controllers').controller('zmApp.TimelineCtrl', ['$ionicPla //tzs = tzs.format("YYYY-MM-DD HH:mm:ss"); //tze = tze.format("YYYY-MM-DD HH:mm:ss"); + // var th = Math.round( window.height() * 0.85 ) + 'px'; options = { showCurrentTime: true, editable: false, + verticalScroll: true, + height: '100%', + //zoomKey: 'ctrlKey', + + //groupHeightMode:'fixed', + //height:$rootScope.devHeight - 10, moment: function (date) { //var t; @@ -1116,6 +1126,7 @@ angular.module('zmApp.controllers').controller('zmApp.TimelineCtrl', ['$ionicPla }, //throttleRedraw: 100, moveable: true, + // height:100, zoomable: true, selectable: true, // multiselect: true, @@ -1309,7 +1320,7 @@ angular.module('zmApp.controllers').controller('zmApp.TimelineCtrl', ['$ionicPla $scope.graphLoaded = true; NVR.debug("graph loaded: " + $scope.graphLoaded); $scope.navControls = false; - dblclick = false; + @@ -1329,18 +1340,20 @@ angular.module('zmApp.controllers').controller('zmApp.TimelineCtrl', ['$ionicPla }); // different handlers for mobile and desktop - // due to how they seem to react to touch differently + // due to how they seeem to react to touch differently if ($rootScope.platformOS == 'desktop') { NVR.debug ("setting up desktop handlers"); timeline_instance.on('click', function (prop) { NVR.debug ("click handler called"); - timelineShowEvent(prop); + timelineShowHover(prop); + }); timeline_instance.on('doubleClick', function (prop) { NVR.debug ("double click handler called"); - timelineAnalyzeFrames(prop); + timelineShowEvent(prop); + //timelineAnalyzeFrames(prop); }); } // mobile handlers @@ -1348,23 +1361,31 @@ angular.module('zmApp.controllers').controller('zmApp.TimelineCtrl', ['$ionicPla // click doesn't seem to work on mobile (iOS at least. wuh?) // this is called for both tap and double tap NVR.debug ("setting up mobile handlers"); - timeline_instance.on('click', function (prop) { - NVR.debug ("click handler called"); - if (dblclick) { - NVR.debug ("Double click detected <= 300ms"); - timelineAnalyzeFrames(prop); + + timeline_instance.on('touchstart', function (prop) { + $timeout (function () { + var now = moment(); + var diff = now.diff(lastClicked); + NVR.debug ('Touch Start called with ms since last clicked:'+diff); + lastClicked = now; + //NVR.debug ('lastClick set to:'+lastClicked); + if (diff <= 500) { + NVR.debug ("Double tap detected <= 500ms"); + //timelineAnalyzeFrames(prop); + timelineShowEvent(prop); } // differntiate between dbl click and click - if (!dblclick) { - dblclick = true; - $timeout (function () { - dblclick = false; - NVR.debug ("Timeout for double click >300ms, single click assumed"); + else { + NVR.debug ("single tap assumed (double tap timeout)"); timelineShowHover(prop); - },300); + } + }); + + + }); } @@ -1442,7 +1463,7 @@ angular.module('zmApp.controllers').controller('zmApp.TimelineCtrl', ['$ionicPla for (var x = 0; x < visible.length; x++) { _item = graphData.get(visible[x]); if (_item.group != prop.group) continue; - console.log ("ITEM start/end is:"+_item.start+'/'+_item.end); + //console.log ("ITEM start/end is:"+_item.start+'/'+_item.end); var dist = Math.min( Math.abs(_item.start - target), Math.abs(_item.end - target)); if (dist < minDist ) { closestId = _item.id; diff --git a/www/lang/locale-en.json b/www/lang/locale-en.json index d4b48150..ac25692e 100644 --- a/www/lang/locale-en.json +++ b/www/lang/locale-en.json @@ -395,8 +395,8 @@ "kTime" :"time", "kTimeZoneNotSupported" :"your API doesn't support this", "kTimeline" :"Timeline", - "kTimelineControlsD" : "hover: thumbnail, tap: event, double-tap: frames", - "kTimelineControlsM" : "tap: thumbnail (tap thumbnail for event), double-tap: frames", + "kTimelineControlsD" : "hover: thumbnail, double-tap: play", + "kTimelineControlsM" : "tap: thumbnail, double-tap: play", "kTimelineEvent" :"view event", "kTimelineGraph" :"analyze frames", "kTimelineMessage" :"double-tap exits. touch/mouse-over and drag over items to see frames", diff --git a/www/templates/timeline.html b/www/templates/timeline.html index 0a0d399f..73a6c7c5 100644 --- a/www/templates/timeline.html +++ b/www/templates/timeline.html @@ -19,7 +19,7 @@ <!--<ion-content data-tap-disabled="true">--> <ion-content delegate-handle="none" overflow-scroll="false" mouse-wheel-scroll> <div style="padding-left:15px; font-size:10px; color:grey"> - {{prettify(fromDate)}} - {{prettify(toDate)}} {{tzAbbr}} ({{'kTimelineOnlyDisplaying1' | + {{prettify(fromDate)}} - {{prettify(toDate)}} {{tzAbbr}} ({{'kTimelineOnlyDisplaying1' | translate:translationData}}) <strong> <br />{{timelineControls}}</strong> @@ -33,10 +33,10 @@ </center> </div> <div style="padding-left:15px; padding-right:15px;"> - <div id="visualization" data-tap-disabled="true"> + <div id="visualization" data-tap-disabled="true" > </div> </div> - <br /> + <br/> <div style="padding-left:15px; font-size:10px; color:grey"> @@ -47,7 +47,7 @@ {{'kNow' | translate}} </button> <div ng-if="follow.time"> - <p>{{newEvents}}</p> + <p> {{newEvents}}</p> </div> <div ng-if="thumbData.url != ''"> <br/><br/> |