diff options
| -rwxr-xr-x | www/js/DataModel.js | 99 | ||||
| -rw-r--r-- | www/js/EventCtrl.js | 7 | ||||
| -rw-r--r-- | www/js/EventModalCtrl.js | 94 | ||||
| -rw-r--r-- | www/js/MomentCtrl.js | 9 | ||||
| -rw-r--r-- | www/js/MonitorCtrl.js | 7 | ||||
| -rw-r--r-- | www/lang/locale-en.json | 3 | ||||
| -rw-r--r-- | www/templates/events-modal.html | 37 |
7 files changed, 165 insertions, 91 deletions
diff --git a/www/js/DataModel.js b/www/js/DataModel.js index 05daf5f0..4ac38097 100755 --- a/www/js/DataModel.js +++ b/www/js/DataModel.js @@ -330,6 +330,58 @@ angular.module('zmApp.controllers') } + function getAuthKey (mid,ck) { + var d = $q.defer(); + var as = 'undefined'; + + if (!mid) { + log("Deferring auth key, as monitorId unknown"); + d.resolve("undefined"); + $rootScope.authSession = as; + return (d.promise); + } + + // Skipping monitor number as I only need an auth key + // so no need to generate an image + var myurl = loginData.url + "/index.php?view=watch&mid=" + mid ; + debug("DataModel: Getting auth from " + myurl + " with mid=" + mid); + $http.get(myurl) + .then(function (success) { + // console.log ("**** RESULT IS " + JSON.stringify(success)); + // Look for auth= + var auth = success.data.match("auth=(.*?)&"); + if (auth && (auth[1] != null)) { + log("DataModel: Extracted a stream authentication key of: " + auth[1]); + as = "&auth="+auth[1]; + $rootScope.authSession = as; + d.resolve(as); + } else { + log("DataModel: Did not find a stream auth key, looking for user="); + auth = success.data.match("user=(.*?)&"); + if (auth && (auth[1] != null)) { + log("DataModel: Found simple stream auth mode (user=)"); + as = "&user=" + loginData.username + "&pass=" + loginData.password; + $rootScope.authSession = as; + d.resolve(as); + } else { + log("Data Model: Did not find any stream mode of auth"); + as=""; + d.resolve(as); + } + + return (d.promise); + } + + }, + function (error) { + log("DataModel: Error resolving auth key " + JSON.stringify(error)); + d.resolve("undefined"); + return (d.promise); + }); + return (d.promise); + + } + function log(val, logtype) { @@ -1437,47 +1489,7 @@ angular.module('zmApp.controllers') // need a mid as restricted users won't be able to get // auth with just &watch getAuthKey: function (mid, ck) { - var d = $q.defer(); - - if (!mid) { - log("Deferring auth key, as monitorId unknown"); - d.resolve(""); - return (d.promise); - } - - // Skipping monitor number as I only need an auth key - // so no need to generate an image - var myurl = loginData.url + "/index.php?view=watch&mid=" + mid ; - debug("DataModel: Getting auth from " + myurl + " with mid=" + mid); - $http.get(myurl) - .then(function (success) { - // console.log ("**** RESULT IS " + JSON.stringify(success)); - // Look for auth= - var auth = success.data.match("auth=(.*?)&"); - if (auth && (auth[1] != null)) { - log("DataModel: Extracted a stream authentication key of: " + auth[1]); - d.resolve("&auth=" + auth[1]); - } else { - log("DataModel: Did not find a stream auth key, looking for user="); - auth = success.data.match("user=(.*?)&"); - if (auth && (auth[1] != null)) { - log("DataModel: Found simple stream auth mode (user=)"); - d.resolve("&user=" + loginData.username + "&pass=" + loginData.password); - } else { - log("Data Model: Did not find any stream mode of auth"); - d.resolve(""); - } - return (d.promise); - } - - }, - function (error) { - log("DataModel: Error resolving auth key " + JSON.stringify(error)); - d.resolve(""); - return (d.promise); - }); - return (d.promise); - + return getAuthKey (mid,ck); }, //----------------------------------------------------------------------------- @@ -1738,6 +1750,11 @@ angular.module('zmApp.controllers') .success(function (data) { //console.log("HTTP success got " + JSON.stringify(data.monitors)); monitors = data.monitors; + + if ($rootScope.authSession == 'undefined') { + log ("Now that we have monitors, lets get AuthKey..."); + getAuthKey(monitors[0].Monitor.Id, (Math.floor((Math.random() * 999999) + 1)).toString()) + } monitors.sort(function (a, b) { return parseInt(a.Monitor.Sequence) - parseInt(b.Monitor.Sequence); }); diff --git a/www/js/EventCtrl.js b/www/js/EventCtrl.js index 423de0d2..45b750b2 100644 --- a/www/js/EventCtrl.js +++ b/www/js/EventCtrl.js @@ -2896,13 +2896,6 @@ angular.module('zmApp.controllers') { $scope.modal = modal; - $ionicLoading.show( - { - template: $translate.instant('kPleaseWait') + "...", - noBackdrop: true, - duration: 10000 - }); - $scope.modal.show(); var ld = NVRDataModel.getLogin(); diff --git a/www/js/EventModalCtrl.js b/www/js/EventModalCtrl.js index d6a540ea..1b95c5f3 100644 --- a/www/js/EventModalCtrl.js +++ b/www/js/EventModalCtrl.js @@ -6,6 +6,12 @@ angular.module('zmApp.controllers').controller('EventModalCtrl', ['$scope', '$rootScope', 'zm', 'NVRDataModel', '$ionicSideMenuDelegate', '$timeout', '$interval', '$ionicModal', '$ionicLoading', '$http', '$state', '$stateParams', '$ionicHistory', '$ionicScrollDelegate', '$q', '$sce', 'carouselUtils', '$ionicPopup', '$translate', '$filter', 'SecuredPopups', function($scope, $rootScope, zm, NVRDataModel, $ionicSideMenuDelegate, $timeout, $interval, $ionicModal, $ionicLoading, $http, $state, $stateParams, $ionicHistory, $ionicScrollDelegate, $q, $sce, carouselUtils, $ionicPopup, $translate, $filter, SecuredPopups) { + + const streamState = { + SNAPSHOT:1, + ACTIVE:2, + STOPPED:3 + }; // from parent scope var currentEvent = $scope.currentEvent; var nphTimer; @@ -17,8 +23,13 @@ angular.module('zmApp.controllers').controller('EventModalCtrl', ['$scope', '$ro var gEvent; var handle; var showLive = true; + var maxAlarmFid = 0; + + + var broadcastHandles = []; - var isStreamPaused = true; + var currentStreamState = streamState.STOPPED; + var framearray = { @@ -66,16 +77,7 @@ angular.module('zmApp.controllers').controller('EventModalCtrl', ['$scope', '$ro document.addEventListener("pause", onPause, false); document.addEventListener("resume", onResume, false); - $rootScope.authSession = "undefined"; - $ionicLoading.show( - { - template: $translate.instant('kNegotiatingStreamAuth'), - animation: 'fade-in', - showBackdrop: true, - duration: zm.loadingTimeout, - maxWidth: 300, - showDelay: 0 - }); + var ld = NVRDataModel.getLogin(); $scope.currentStreamMode = ld.gapless ? 'gapless' : 'single'; @@ -87,7 +89,8 @@ angular.module('zmApp.controllers').controller('EventModalCtrl', ['$scope', '$ro NVRDataModel.debug("Setting playback to " + $scope.streamMode); $rootScope.validMonitorId = $scope.monitors[0].Monitor.Id; - NVRDataModel.getAuthKey($rootScope.validMonitorId, (Math.floor((Math.random() * 999999) + 1)).toString()) + + /* NVRDataModel.getAuthKey($rootScope.validMonitorId, (Math.floor((Math.random() * 999999) + 1)).toString()) .then(function(success) { $ionicLoading.hide(); @@ -102,7 +105,8 @@ angular.module('zmApp.controllers').controller('EventModalCtrl', ['$scope', '$ro NVRDataModel.debug("ModalCtrl: Error details of stream auth:" + error); //$rootScope.authSession=""; NVRDataModel.log("Modal: Error returned Stream authentication construction. Retaining old value of: " + $rootScope.authSession); - }); + });*/ + //-------------------------------------------------------------------------------------- // Handles bandwidth change, if required @@ -251,6 +255,8 @@ angular.module('zmApp.controllers').controller('EventModalCtrl', ['$scope', '$ro function checkEvent() { + if (currentStreamState == streamState.SNAPSHOT) return; + if ($scope.modalFromTimelineIsOpen == false) { NVRDataModel.log("Modal was closed in timeline, cancelling timer"); @@ -910,8 +916,48 @@ angular.module('zmApp.controllers').controller('EventModalCtrl', ['$scope', '$ro $scope.constructStream = function (monitor) { + + + var stream=""; + // eventId gets populated when prepareModal completes + // if maxAlarmFrame was not set and we don't have an eventID yet, + // we can't show a snapshot + if (currentStreamState == streamState.STOPPED || (maxAlarmFid == 0 && !$scope.eventId)) { + stream=""; + } + else if (currentStreamState == streamState.SNAPSHOT) { + stream = $scope.loginData.url + + "/index.php?view=image" + + + (maxAlarmFid? "&fid="+maxAlarmFid: "&eid="+$scope.eventId+"&fid=1") + + "&scale="+$scope.singleImageQuality + + $rootScope.authSession + } + else if (currentStreamState == streamState.ACTIVE) { + stream = $scope.loginData.streamingurl + + "/nph-zms?source=event&mode=jpeg" + + "&event="+$scope.eventId+"&frame=1" + + "&replay="+$scope.currentStreamMode + + "&rate=100" + + "&connkey="+$scope.connKey + + "&scale="+$scope.singleImageQuality + + $rootScope.authSession + } + + // console.log ("STREAM="+stream); + return stream; + }; + $scope.isSnapShot = function () { + // console.log (currentStreamState); + return currentStreamState == streamState.SNAPSHOT; + }; + + $scope.convertSnapShotToStream = function() { + currentStreamState = streamState.ACTIVE; + }; + $scope.scaleImage = function() { @@ -921,23 +967,35 @@ angular.module('zmApp.controllers').controller('EventModalCtrl', ['$scope', '$ro $scope.$on('$ionicView.beforeEnter', function() { - //console.log (">>>>>>>>>>>>>>>>>>>> MODAL VIEW ENTER"); - isStreamPaused = true; + + currentStreamState = streamState.STOPPED; }); - $scope.imageLoaded = function() { - isStreamPaused = false; - } + $scope.modalImageLoaded = function() { + console.log ("MODAL IMAGE LOADED"); + if (m.snapshot != 'enabled') currentStreamState = streamState.ACTIVE; + }; $scope.$on('modal.shown', function(e, m) { + console.log ("AUTH="+$rootScope.authSession); if (m.id != 'footage') return; showLive = true; + + if (m.snapshot == 'enabled') { + currentStreamState = streamState.SNAPSHOT; + maxAlarmFid = m.snapshotId; + + } + + else currentStreamState = streamState.ACTIVE; + + if (m.showLive == 'disabled') { showLive = false; NVRDataModel.debug ("I was explictly asked not to show live, cross my fingers..."); diff --git a/www/js/MomentCtrl.js b/www/js/MomentCtrl.js index 4a0d41ec..635e79b5 100644 --- a/www/js/MomentCtrl.js +++ b/www/js/MomentCtrl.js @@ -589,15 +589,14 @@ angular.module('zmApp.controllers').controller('zmApp.MomentCtrl', ['$scope', '$ animation: 'slide-in-up', id: 'footage', showLive:sl, + snapshot: 'enabled', + snapshotId:event.Event.MaxScoreFrameId, + }) .then(function (modal) { $scope.modal = modal; - $ionicLoading.show({ - template: $translate.instant('kPleaseWait') + "...", - noBackdrop: true, - duration: 10000 - }); + $scope.modal.show(); diff --git a/www/js/MonitorCtrl.js b/www/js/MonitorCtrl.js index 928a15b9..74842c08 100644 --- a/www/js/MonitorCtrl.js +++ b/www/js/MonitorCtrl.js @@ -420,13 +420,6 @@ angular.module('zmApp.controllers') .then(function(modal) { $scope.modal = modal; - - $ionicLoading.show( - { - template: $translate.instant('kPleaseWait') + "...", - noBackdrop: true, - duration: zm.loadingTimeout - }); $scope.isModalActive = true; $scope.modal.show(); }); diff --git a/www/lang/locale-en.json b/www/lang/locale-en.json index 2ff00d64..3830dcf4 100644 --- a/www/lang/locale-en.json +++ b/www/lang/locale-en.json @@ -106,6 +106,7 @@ "kEventNotificationUrl" :"event notification url", "kEventRecording" :"Event Recording", "kEventServer" :"Event Server", + "kEventServerConnErr" :"Event Server connection error", "kEventServerConfig1" :"Please make sure your ZM settings are configured and saved before you configure the event server", "kEventServerNotLoggedIn" :"You are not yet logged in. Please make sure you have logged in successfully (save your login data, and ensure login is successful)", "kEventServerVersionBody1" :"You are running version", @@ -275,6 +276,7 @@ "kPlaceHolderBasicAuthUser" :"basic auth user name", "kPlaceHolderZMAuthPass" :"zm auth password", "kPlaceHolderZMAuthUser" :"zm auth user name", + "kPlay" : "Play", "kPlaybackInterval" :"playback interval", "kPleaseAuthenticate" :"Please Authenticate", "kPleaseCheckCredentials" :"Please check your credentials", @@ -390,6 +392,7 @@ "kUseSSL" :"Use SSL", "kUseVideoControls" :"Please use video player controls for H264 events. ZoneMinder doesn't yet support zms controls", "kUseZmAuth" :"use ZM authentication", + "kUseBasicAuth" : "use basic authentication", "kUserName" :"user name", "kValidNameBasicAuth" :"Please enter a valid username and password for basic auth", "kValidNameZMAuth" :"Please enter a valid username and password for ZM auth", diff --git a/www/templates/events-modal.html b/www/templates/events-modal.html index 7d59995b..f070fe9b 100644 --- a/www/templates/events-modal.html +++ b/www/templates/events-modal.html @@ -2,23 +2,32 @@ <!-- style="width: 90%; height: 90%; top: 5%; left: 5%; right: 5%; bottom: 5%;"--> <ion-modal-view cache-view="false"> <ion-content style="background-color:#444444" ng-cloak> + + + <ion-scroll has-bouncing=false min-zoom=1 zooming="true" direction="xy" delegate-handle="imgscroll" on-swipe-left="onSwipeEvent(nextId,1)" on-swipe-right="onSwipeEvent(prevId,-1)" overflow-scroll="false"> <div id="full-screen-event" style="height: 100vh;"> <!--<div>--> <!-- route via ZMS --> - <div ng-if="( (defaultVideo=='') || (loginData.enableh264==false)) && (loginData.useNphZmsForEvents==true)"> + <div ng-if="defaultVideo=='' || isSnapShot()"> <!--<div style="color:white">connkey:{{connKey}}</div>--> <div style="width:100vw; height:100vh;"> - <img ng-if="!liveFeedMid" image-spinner-src="{{loginData.streamingurl}}/nph-zms?source=event&mode=jpeg&event={{eventId}}&frame=1&replay={{currentStreamMode}}&rate=100&connkey={{connKey}}&scale={{singleImageQuality}}{{$root.authSession}}" ng-class="{'object-fit_cover':imageFit==false, 'object-fit_contain':imageFit==true}" on-double-tap="closeModal();" - img-spinner-w="1024" img-spinner-h="768" - onload="imageLoaded()" + + <div ng-if="isSnapShot()" class="event-modal-play"> + <button class="button button-assertive icon ion-play" ng-click="convertSnapShotToStream()"> {{'kPlay'|translate}}</button> + </div> + + <img ng-if="!liveFeedMid" image-spinner-src="{{constructStream()}}" ng-class="{'object-fit_cover':imageFit==false, 'object-fit_contain':imageFit==true}" on-double-tap="closeModal();" + img-spinner-w="1024" img-spinner-h="768" image-spinner-loader="lines" + onload="modalImageLoaded()" /> <div ng-if="liveFeedMid"> <img image-spinner-src="{{loginData.streamingurl}}/nph-zms?mode=jpeg&monitor={{liveFeedMid}}&connkey={{connKey}}{{$root.authSession}}" ng-class="{'object-fit_cover':imageFit==false, 'object-fit_contain':imageFit==true}" on-double-tap="closeModal();" img-spinner-w="1024" img-spinner-h="768" - onload="imageLoaded()" + image-spinner-loader="lines" + onload="modalImageLoaded()" /> <div class="events-range-modal-text"><span class="events-range-modal-warning-text">{{eventWarning}}</span> </div> </div> @@ -31,12 +40,9 @@ </div> </div> <!-- no default video --> - <div ng-if="defaultVideo!==undefined && defaultVideo!='' && loginData.enableh264 == true"> + <div ng-if="defaultVideo!==undefined && defaultVideo!='' && !isSnapShot()"> <div ng-if="videoIsReady"> - - - - + <div style="height:{{$root.devHeight}}px; width:{{$root.devWidth}}px;"> <!-- @@ -82,7 +88,9 @@ </div> <!-- 100vh --> </ion-scroll> - <div ng-if="( (defaultVideo=='') || (loginData.enableh264==false)) && (loginData.useNphZmsForEvents==true) && !liveFeedMid"> + + + <div ng-show="defaultVideo=='' && !liveFeedMid && !isSnapShot()"> <div id="event_canvas"> <canvas style="padding-left:23px; padding-right:23px;" id="eventchart" width="auto" height="20"></canvas> @@ -98,11 +106,14 @@ </div> </div> + + </ion-content> </ion-modal-view> - <div ng-if="!liveFeedMid"> + + <div ng-show="!liveFeedMid && !isSnapShot()"> <nav mfb-menu position="tr" effect="zoomin" label="{{'kCollapse'|translate}}" active-icon="ion-chevron-up" resting-icon="ion-chevron-down" toggling-method="click"> <a mfb-button icon="ion-arrow-right-c" label="{{'kNextEvent'|translate}}" ng-click="jumpToEvent(nextId,1);"></a> <a mfb-button icon="ion-arrow-left-c" label="{{'kPrevEvent'|translate}}" ng-click="jumpToEvent(prevId,-1);"></a> @@ -135,5 +146,5 @@ </li> </ul> </div> - </div> <!-- not live feed --> + </div> <!-- not live feed or snapshot --> </div> |