diff options
| -rw-r--r-- | www/index.html | 9 | ||||
| -rw-r--r-- | www/js/DataModel.js | 26 | ||||
| -rw-r--r-- | www/js/EventModalCtrl.js | 4 | ||||
| -rw-r--r-- | www/js/LoginCtrl.js | 3 | ||||
| -rw-r--r-- | www/js/MonitorModalCtrl.js | 119 | ||||
| -rw-r--r-- | www/js/MontageCtrl.js | 30 | ||||
| -rw-r--r-- | www/js/app.js | 3 | ||||
| -rw-r--r-- | www/lang/locale-en.json | 4 | ||||
| -rw-r--r-- | www/templates/devoptions.html | 7 | ||||
| -rw-r--r-- | www/templates/login.html | 8 | ||||
| -rw-r--r-- | www/templates/monitors-modal.html | 6 |
11 files changed, 123 insertions, 96 deletions
diff --git a/www/index.html b/www/index.html index e80ff77d..c6bea392 100644 --- a/www/index.html +++ b/www/index.html @@ -187,11 +187,16 @@ <ion-side-menu> <ion-header-bar class="bar bar-header bar-dark"> <h1 class="title">{{'kMenuOptions'|translate}}</h1> + </ion-header-bar> <ion-content has-header="true"> + <ion-list> <ion-item href="#/montage" menu-close> + + <span ng-if="$root.runMode=='low'" style="float:right;margin-top:-18px;background-color:#f1c40f;color:#000;font-size:11px;opacity:0.7;width:20px;border-radius: 0px 0px 5px 5px;display:inline-block;text-align:center;"> <i class="icon ion-arrow-graph-down-left"></i> </span> + <span class=" item-icon-left"> <i class="icon ion-ios-eye"></i> </span>{{'kMenuMontage'|translate}} @@ -228,6 +233,10 @@ </ion-item> <ion-item nav-clear menu-close href="#/login/false"> + + + + <span style="float:right;margin-top:-18px;background-color:#444444;color:#fff;font-size:11px;opacity:0.7;width:90px;border-radius: 0px 0px 5px 5px;:text-overflow:ellipsis;overflow:hidden;white-space:nowrap;display:inline-block;text-align:center;"> {{$root.getProfileName();}} </span> diff --git a/www/js/DataModel.js b/www/js/DataModel.js index 43f350d6..11451916 100644 --- a/www/js/DataModel.js +++ b/www/js/DataModel.js @@ -59,7 +59,8 @@ angular.module('zmApp.controllers') 'streamingurl': "", 'maxFPS': "3", // image streaming FPS 'montageQuality': "50", // montage streaming quality in % - 'singleImageQuality': "100", // single streaming quality in % + 'singleImageQuality': "100", // event single streaming quality in % + 'monSingleImageQuality': "100", // live view quality 'montageHistoryQuality': "50", 'useSSL': false, // "1" if HTTPS 'keepAwake': true, // don't dim/dim during live view @@ -69,6 +70,7 @@ angular.module('zmApp.controllers') 'eventServerMonitors': '', // list of monitors to notify from ES 'eventServerInterval': '', // list of intervals for all monitors 'refreshSec': '2', // timer value for frame change in sec + 'refreshSecLowBW': 8, 'enableLogs': true, 'enableDebug': true, // if enabled with log messages with "debug" 'usePin': false, @@ -106,6 +108,7 @@ angular.module('zmApp.controllers') 'soundOnPush': true, 'cycleMonitors': false, 'cycleMonitorsInterval':10, // 10sec + 'enableLowBandwidth':false, @@ -688,6 +691,27 @@ angular.module('zmApp.controllers') } + if (typeof loginData.enableLowBandwidth == 'undefined') { + + loginData.enableLowBandwidth = false; + + } + $rootScope.runMode = loginData.enableLowBandwith? "low": "normal"; + + if (typeof loginData.refreshSecLowBW == 'undefined') { + + loginData.refreshSecLowBW = 8; + + } + + + + + if (typeof loginData.monSingleImageQuality == 'undefined') { + + loginData.monSingleImageQuality = 100; + + } log("DataModel init recovered this loginData as " + JSON.stringify(loginData)); } else { diff --git a/www/js/EventModalCtrl.js b/www/js/EventModalCtrl.js index 6bafcf5e..247b486c 100644 --- a/www/js/EventModalCtrl.js +++ b/www/js/EventModalCtrl.js @@ -707,7 +707,7 @@ angular.module('zmApp.controllers').controller('EventModalCtrl', ['$scope', '$ro var ld = NVRDataModel.getLogin(); $scope.loginData = NVRDataModel.getLogin(); - $scope.singleImageQuality = ld.singleImageQuality; + $scope.singleImageQuality = ld.enableLowBandwidth? 70: ld.singleImageQuality; $scope.blockSlider = false; $scope.checkEventOn = false; //$scope.singleImageQuality = 100; @@ -743,7 +743,7 @@ angular.module('zmApp.controllers').controller('EventModalCtrl', ['$scope', '$ro eventQueryHandle = $interval(function () { checkEvent(); // console.log ("Refreshing Image..."); - }.bind(this), zm.eventPlaybackQuery); + }.bind(this), ld.enableLowBandwidth? zm.eventPlaybackQueryLowBW: zm.eventPlaybackQuery); } else { NVRDataModel.log(">>>Modal was exited, not starting checkAllEvents"); } diff --git a/www/js/LoginCtrl.js b/www/js/LoginCtrl.js index df85651e..457ebe79 100644 --- a/www/js/LoginCtrl.js +++ b/www/js/LoginCtrl.js @@ -422,6 +422,9 @@ angular.module('zmApp.controllers').controller('zmApp.LoginCtrl', ['$scope', '$r //console.log ("*********** SAVE ITEMS CALLED "); //console.log('Saving login'); NVRDataModel.setFirstUse(false); + + // used for menu display + $rootScope.runMode = $scope.loginData.enableLowBandwidth ? "low":"normal"; // lets so some basic sanitization of the data // I am already adding "/" so lets remove spurious ones diff --git a/www/js/MonitorModalCtrl.js b/www/js/MonitorModalCtrl.js index 36efb71b..e7e22e86 100644 --- a/www/js/MonitorModalCtrl.js +++ b/www/js/MonitorModalCtrl.js @@ -1,7 +1,7 @@ // Common Controller for the montage view /* jshint -W041 */ /* jslint browser: true*/ -/* global saveAs, cordova,StatusBar,angular,console,ionic, moment, imagesLoaded, ConnectSDK */ +/* global saveAs, cordova,StatusBar,angular,console,ionic, moment, imagesLoaded, chrome */ @@ -196,88 +196,34 @@ angular.module('zmApp.controllers').controller('MonitorModalCtrl', ['$scope', '$ $scope.cast = function (mid, mon) { + - //console.log ("PASSED WITH " + JSON.stringify(mon)); - //ConnectSDK.discoveryManager.startDiscovery(); - - //console.log ("Stopping"); - ConnectSDK.discoveryManager.stopDiscovery(); - - //console.log ("Starting"); - ConnectSDK.discoveryManager.startDiscovery(); - //console.log ("picking"); - ConnectSDK.discoveryManager.pickDevice() - .success(function (device) { - //device.disconnect(); - function sendVideo(mid, mon) { - //device.getMediaPlayer().playMedia("http://media.w3.org/2010/05/sintel/trailer.mp4", "video/mp4"); - - // var url = "http://www.connectsdk.com/files/9613/9656/8539/test_image.jpg"; - - //var url = mon.Monitor.streamingURL+"/nph-zms?mode=jpeg&monitor="+mid+$rootScope.authSession+"&rand="+$rootScope.modalRand; - - var ld = NVRDataModel.getLogin(); - var url = mon.Monitor.streamingURL + "/nph-zms?mode=jpeg&monitor=" + mid + "&user=" + ld.username + "&pass=" + ld.password + "&rand=" + $rootScope.modalRand; - - //console.log ("URL: " + url); - var iconUrl = "http://www.connectsdk.com/files/9613/9656/8539/test_image.jpg"; - var mimeType = "image/jpeg"; - - device.getMediaPlayer().displayImage(url, mimeType, { - title: "Monitor: " + mid, - description: "Monitor feed", - }).success(function (launchSession, mediaControl) { - //console.log("Image launch successful"); - }).error(function (err) { - //console.log("error: " + err.message); - }); - } - - if (device.isReady()) { // already connected - // console.log (">>> device ready sending video"); - sendVideo(mid, mon); - } else { - device.on("ready", function () { - sendVideo(mid, mon); - }); - //console.log (">>> device not ready connecting"); - device.connect(); - } - }) - .error( - function (error) { - // console.log ("ERROR"); - }); }; - + //---------------------------------- // toggles monitor cycling //---------------------------------- - $scope.toggleCycle = function() - { + $scope.toggleCycle = function () { //console.log ("HERE"); $scope.isCycle = !$scope.isCycle; var ld = NVRDataModel.getLogin(); ld.cycleMonitors = $scope.isCycle; NVRDataModel.setLogin(ld); - $scope.cycleText = $scope.isCycle ? $translate.instant ('kOn'):$translate.instant ('kOff'); - - if ($scope.isCycle) - { - NVRDataModel.log ("re-starting cycle timer"); + $scope.cycleText = $scope.isCycle ? $translate.instant('kOn') : $translate.instant('kOff'); + + if ($scope.isCycle) { + NVRDataModel.log("re-starting cycle timer"); $interval.cancel(cycleHandle); - cycleHandle = $interval(function () { - moveToMonitor($scope.monitorId,1); - // console.log ("Refreshing Image..."); - }.bind(this), ld.cycleMonitorsInterval * 1000); - } - else - { - NVRDataModel.log ("cancelling cycle timer"); - $interval.cancel(cycleHandle); + cycleHandle = $interval(function () { + moveToMonitor($scope.monitorId, 1); + // console.log ("Refreshing Image..."); + }.bind(this), ld.cycleMonitorsInterval * 1000); + } else { + NVRDataModel.log("cancelling cycle timer"); + $interval.cancel(cycleHandle); } - + }; //------------------------------------------------------------- @@ -334,19 +280,18 @@ angular.module('zmApp.controllers').controller('MonitorModalCtrl', ['$scope', '$ intervalModalHandle = $interval(function () { loadModalNotifications(); }.bind(this), 5000); - - if (ld.cycleMonitors) - { - NVRDataModel.debug ("Cycling enabled at "+ld.cycleMonitorsInterval); + + if (ld.cycleMonitors) { + NVRDataModel.debug("Cycling enabled at " + ld.cycleMonitorsInterval); $interval.cancel(cycleHandle); cycleHandle = $interval(function () { - moveToMonitor($scope.monitorId,1); + moveToMonitor($scope.monitorId, 1); // console.log ("Refreshing Image..."); }.bind(this), ld.cycleMonitorsInterval * 1000); - } + } $rootScope.modalRand = Math.floor((Math.random() * 100000) + 1); @@ -364,6 +309,9 @@ angular.module('zmApp.controllers').controller('MonitorModalCtrl', ['$scope', '$ return; } + + if (NVRDataModel.getLogin().enableLowBandwidth) + return; var status = [$translate.instant('kMonIdle'), $translate.instant('kMonPreAlarm'), @@ -1279,23 +1227,24 @@ angular.module('zmApp.controllers').controller('MonitorModalCtrl', ['$scope', '$ $scope.currentFrame = 1; $scope.monStatus = ""; $scope.isCycle = ld.cycleMonitors; - $scope.cycleText = $scope.isCycle ? $translate.instant ('kOn'):$translate.instant ('kOff'); + $scope.cycleText = $scope.isCycle ? $translate.instant('kOn') : $translate.instant('kOff'); + + $scope.quality = ld.enableLowBandwidth? 70:ld.monSingleImageQuality; configurePTZ($scope.monitorId); - - if (ld.cycleMonitors) - { - NVRDataModel.debug ("Cycling enabled at "+ld.cycleMonitorsInterval); - + + if (ld.cycleMonitors) { + NVRDataModel.debug("Cycling enabled at " + ld.cycleMonitorsInterval); + $interval.cancel(cycleHandle); cycleHandle = $interval(function () { - moveToMonitor($scope.monitorId,1); + moveToMonitor($scope.monitorId, 1); // console.log ("Refreshing Image..."); }.bind(this), ld.cycleMonitorsInterval * 1000); - + } - + }); diff --git a/www/js/MontageCtrl.js b/www/js/MontageCtrl.js index 3dfac5dc..5cc06739 100644 --- a/www/js/MontageCtrl.js +++ b/www/js/MontageCtrl.js @@ -22,7 +22,7 @@ angular.module('zmApp.controllers').controller('zmApp.MontageCtrl', ['$scope', ' var sizeInProgress; var modalIntervalHandle; var ld; - + var refreshSec; // -------------------------------------------------------- // Handling of back button in case modal is open should @@ -261,6 +261,11 @@ angular.module('zmApp.controllers').controller('zmApp.MontageCtrl', ['$scope', ' return; } + + if (NVRDataModel.getLogin().enableLowBandwidth) + { + return; + } for (var i = 0; i < $scope.MontageMonitors.length; i++) { if (($scope.MontageMonitors[i].Monitor.Function == 'None') || @@ -631,7 +636,7 @@ angular.module('zmApp.controllers').controller('zmApp.MontageCtrl', ['$scope', ' $scope.monitorName = NVRDataModel.getMonitorName(mid); $scope.controlid = controlid; - $scope.LoginData = NVRDataModel.getLogin(); + //$scope.LoginData = NVRDataModel.getLogin(); $rootScope.modalRand = Math.floor(Math.random() * (999999 - 111111 + 1)) + 111111; @@ -705,7 +710,7 @@ angular.module('zmApp.controllers').controller('zmApp.MontageCtrl', ['$scope', ' intervalHandleMontage = $interval(function () { loadNotifications(); // console.log ("Refreshing Image..."); - }.bind(this), ld.refreshSec * 1000); + }.bind(this), refreshSec * 1000); intervalHandleAlarmStatus = $interval(function () { loadAlarmStatus(); @@ -813,6 +818,18 @@ angular.module('zmApp.controllers').controller('zmApp.MontageCtrl', ['$scope', ' $scope.allImagesLoaded = false; $scope.gridScale = "grid-item-50"; $scope.LoginData = NVRDataModel.getLogin(); + + if ($scope.LoginData.enableLowBandwidth) + { + NVRDataModel.debug ("Enabling low bandwidth parameters"); + $scope.LoginData.montageQuality = 50; + $scope.LoginData.singleImageQuality = 70; + $scope.LoginData.montageHistoryQuality = 50; + + + } + + $scope.monLimit = $scope.LoginData.maxMontage; $scope.showSizeButtons = false; @@ -834,6 +851,11 @@ angular.module('zmApp.controllers').controller('zmApp.MontageCtrl', ['$scope', ' //$scope.areImagesLoading = true; var ld = NVRDataModel.getLogin(); + + refreshSec = ld.enableLowBandwidth ? ld.refreshSecLowBW: ld.refreshSec; + + NVRDataModel.debug ("Enable Low bandwidth: " + ld.enableLowBandwidth+ " montage refresh set to: " + refreshSec); + //console.log("Setting Awake to " + NVRDataModel.getKeepAwake()); NVRDataModel.setAwake(NVRDataModel.getKeepAwake()); @@ -843,7 +865,7 @@ angular.module('zmApp.controllers').controller('zmApp.MontageCtrl', ['$scope', ' intervalHandleMontage = $interval(function () { loadNotifications(); // console.log ("Refreshing Image..."); - }.bind(this), ld.refreshSec * 1000); + }.bind(this), refreshSec * 1000); intervalHandleAlarmStatus = $interval(function () { loadAlarmStatus(); diff --git a/www/js/app.js b/www/js/app.js index 22057355..367fc0af 100644 --- a/www/js/app.js +++ b/www/js/app.js @@ -46,6 +46,7 @@ angular.module('zmApp', [ authoremail: 'pliablepixels+zmNinja@gmail.com', logFileMaxSize: 20000, // after this limit log gets reset loginInterval: 300000, //5m*60s*1000 - ZM auto login after 5 mins + loginIntervalLowBW: 600000, //10m login //loginInterval: 30000, updateCheckInterval: 86400000, // 24 hrs loadingTimeout: 15000, @@ -77,6 +78,7 @@ angular.module('zmApp', [ nphSwitchTimer: 3000, eventHistoryTimer: 10000, eventPlaybackQuery: 3000, + eventPlaybackQueryLowBW: 6000, packeryTimer: 500, dbName: 'zmninja', cipherKey: 'sdf#@#%FSXSA_AR', @@ -1079,6 +1081,7 @@ angular.module('zmApp', [ $rootScope.db = null; + $rootScope.runMode = "normal"; $rootScope.platformOS = "desktop"; NVRDataModel.log("Device is ready"); diff --git a/www/lang/locale-en.json b/www/lang/locale-en.json index 96aedb05..7af0db3b 100644 --- a/www/lang/locale-en.json +++ b/www/lang/locale-en.json @@ -44,8 +44,8 @@ "kCredentialsTitle" :"Credentials Required", "kCurrentState" :"current state", "kCustomRange" :"Custom Range", - "kCycleMonitorsInterval" :"monitor cycle interval", "kCycleMonitors" :"cycle monitors", + "kCycleMonitorsInterval" :"monitor cycle interval", "kDay" :"Day", "kDecreaseSize" :"decrease size", "kDelete" :"Delete", @@ -147,6 +147,7 @@ "kLoginValidAPIFailedTitle" :"Login validated but API failed", "kLoginValidatedTitle" :"Login Validated", "kLogs" :"Logs", + "kLowBandwidth" :"low bandwidth mode", "kManageServerGroups" :"Manage Server Groups", "kMaxFPS" :"Max FPS", "kMaxItemsForTimeline" :"Max. items for Timeline", @@ -180,6 +181,7 @@ "kMonNone" :"None", "kMonPreAlarm" :"pre-alarm", "kMonRecord" :"record", + "kMonitorSingleImageScale" :"Live view single image scale", "kMonitors" :"Monitors", "kMontage" :"Montage", "kMontageImageScale" :"Montage image scale", diff --git a/www/templates/devoptions.html b/www/templates/devoptions.html index 4e6e1a7c..a2bf0e8c 100644 --- a/www/templates/devoptions.html +++ b/www/templates/devoptions.html @@ -78,6 +78,13 @@ <input type="tel" placeholder="" ng-model="loginData.singleImageQuality"> </label> </div> + + <div class="item item-input-inset"> + {{'kMonitorSingleImageScale' | translate}}(%) + <label class="item-input-wrapper"> + <input type="tel" placeholder="" ng-model="loginData.monSingleImageQuality"> + </label> + </div> <!--<div class="item item-input-inset"> {{'kResumeDelay' | translate}}(ms) diff --git a/www/templates/login.html b/www/templates/login.html index 15409e76..e2a65168 100644 --- a/www/templates/login.html +++ b/www/templates/login.html @@ -22,6 +22,14 @@ </label> </div> + <label> + + <ion-toggle ng-model="loginData.enableLowBandwidth" + + toggle-class="toggle-calm">{{'kLowBandwidth'|translate}} + </ion-toggle> + </label> + <div class="list list-inset"> <span style="color:rgb(100,100,100)"> <i class="ion-android-home" style="font-size:150%"></i> diff --git a/www/templates/monitors-modal.html b/www/templates/monitors-modal.html index de19c23c..8833a47c 100644 --- a/www/templates/monitors-modal.html +++ b/www/templates/monitors-modal.html @@ -16,7 +16,7 @@ <div ng-if="!animationInProgress && !isBackground() && connKey"> <!--<span style="color:white">{{currentStreamMode}}</span>--> - <img id="singlemonitor" style="width:100vw; height:100vh;" image-spinner-loader="lines" image-spinner-src="{{monitor.Monitor.streamingURL}}/nph-zms?mode={{currentStreamMode}}&monitor={{monitorId}}{{$root.authSession}}&rand={{$root.modalRand}}&connkey={{connKey}}" ng-class="{'object-fit_cover':imageFit==false, 'object-fit_contain':imageFit==true}" on-swipe-left="onSwipe(monitorId,1)" on-swipe-right="onSwipe(monitorId,-1)" on-double-tap="closeModal();" /> + <img id="singlemonitor" style="width:100vw; height:100vh;" image-spinner-loader="lines" image-spinner-src="{{monitor.Monitor.streamingURL}}/nph-zms?mode={{currentStreamMode}}&monitor={{monitorId}}&scale={{quality}}{{$root.authSession}}&rand={{$root.modalRand}}&connkey={{connKey}}" ng-class="{'object-fit_cover':imageFit==false, 'object-fit_contain':imageFit==true}" on-swipe-left="onSwipe(monitorId,1)" on-swipe-right="onSwipe(monitorId,-1)" on-double-tap="closeModal();" /> @@ -124,8 +124,8 @@ </li> - <!-- - <li> + + <!--<li> <a href="" ng-click="cast(monitorId, monitor)"> <i class="icon ion-android-funnel"></i></a> </li>--> |