summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rw-r--r--package.json4
-rw-r--r--www/js/DevOptionsCtrl.js3
-rw-r--r--www/js/EventCtrl.js37
-rw-r--r--www/lang/locale-en.json1
-rw-r--r--www/templates/events-popover.html2
-rw-r--r--www/templates/events.html4
6 files changed, 40 insertions, 11 deletions
diff --git a/package.json b/package.json
index 77b86ccc..0ea65508 100644
--- a/package.json
+++ b/package.json
@@ -70,6 +70,9 @@
"ANDROID_GSON_VERSION": "2.8.6"
},
"cordova-plugin-advanced-http": {},
+ "cordova-plugin-ionic-webview": {
+ "ANDROID_SUPPORT_ANNOTATIONS_VERSION": "27.+"
+ },
"cordova-plugin-media-pp-fork": {}
}
},
@@ -97,6 +100,7 @@
"cordova-plugin-ignore-lint-translation": "0.0.1",
"cordova-plugin-insomnia": "^4.3.0",
"cordova-plugin-ionic-keyboard": "^2.2.0",
+ "cordova-plugin-ionic-webview": "git+https://github.com/pliablepixels/cordova-plugin-ionic-webview.git",
"cordova-plugin-media-pp-fork": "^1.0.2-dev",
"cordova-plugin-multi-window": "0.0.3",
"cordova-plugin-network-information": "^2.0.2",
diff --git a/www/js/DevOptionsCtrl.js b/www/js/DevOptionsCtrl.js
index 2af824b5..6ca300ca 100644
--- a/www/js/DevOptionsCtrl.js
+++ b/www/js/DevOptionsCtrl.js
@@ -216,8 +216,9 @@ angular.module('zmApp.controllers').controller('zmApp.DevOptionsCtrl', ['$scope'
var buttons = [
+ { text: $translate.instant('kEventViewThumbsXSmall'), value:'xsmall' },
{ text: $translate.instant('kEventViewThumbsSmall'), value:'small' },
- { text: $translate.instant('kEventViewThumbsLarge'), value:'large' },
+ { text: $translate.instant('kEventViewThumbsLarge'), value:'large' }
];
diff --git a/www/js/EventCtrl.js b/www/js/EventCtrl.js
index b770dd7c..16406f73 100644
--- a/www/js/EventCtrl.js
+++ b/www/js/EventCtrl.js
@@ -72,6 +72,12 @@ angular.module('zmApp.controllers')
var eHandle;
var scrubOngoing = false;
+ $scope.thumbSizeOptions = {
+ 'xsmall': $translate.instant('kEventViewThumbsXSmall'),
+ 'small': $translate.instant('kEventViewThumbsSmall'),
+ 'large':$translate.instant('kEventViewThumbsLarge'),
+ };
+
//---------------------------------------------------
// initial code
@@ -257,9 +263,13 @@ angular.module('zmApp.controllers')
if (ld.eventViewThumbsSize == 'large') {
NVR.debug ('Switching to big thumbs style');
$scope.thumbClass = 'large';
- } else {
- NVR.debug ('using small thumbs style');
+ } else if (ld.eventViewThumbsSize == 'small') {
+ NVR.debug ('Switching to small thumbs style');
$scope.thumbClass = 'small';
+ }
+ else {
+ NVR.debug ('using xsmall thumbs style');
+ $scope.thumbClass = 'xsmall';
}
} else {
NVR.debug ('No thumbs');
@@ -281,14 +291,13 @@ angular.module('zmApp.controllers')
The layout I am using:
a) If you are using large thumbs, it's a single column format
- b) If you are using small thumbs, it's a two column format
+ b) If you are using small or xsmall thumbs, it's a two column format
The max size of the image is in computeThumbnailSize()
*/
-
+ var ld = NVR.getLogin();
recomputeRowHeights();
$scope.mid = '';
- var ld = NVR.getLogin();
if (ld.eventViewThumbs != 'objdetect_gif') {
maxEventsToLoad = 50;
} else {
@@ -3404,7 +3413,7 @@ angular.module('zmApp.controllers')
return calculateAspectRatioFit(mw, mh, maxThumbWidth, maxThumbHeight);
}
- } else { // small
+ } else if (ld.eventViewThumbsSize == 'small') { // small
maxThumbHeight = 250;
maxThumbWidth = 0.5* $rootScope.devWidth;
if (landscape) {
@@ -3415,6 +3424,17 @@ angular.module('zmApp.controllers')
return calculateAspectRatioFit(mw, mh, maxThumbWidth, maxThumbHeight);
}
+ } else { // xsmall
+ maxThumbHeight = 280;
+ maxThumbWidth = 0.2* $rootScope.devWidth;
+ if (landscape) {
+ // go till 50% of width in small landscape, but restricted to useable row height
+ return calculateAspectRatioFit(mw, mh, maxThumbWidth, maxThumbHeight);
+ } else {
+ // go till 30% of width in small portrait, but restricted to useable row height
+ return calculateAspectRatioFit(mw, mh, maxThumbWidth, maxThumbHeight);
+ }
+
}
}
@@ -3472,7 +3492,10 @@ angular.module('zmApp.controllers')
$scope.toggleThumbSize = function() {
var ld = NVR.getLogin();
- ld.eventViewThumbsSize = (ld.eventViewThumbsSize == 'large')?'small':'large';
+ if (ld.eventViewThumbsSize=='xsmall') {ld.eventViewThumbsSize='small';}
+ else if (ld.eventViewThumbsSize=='small') {ld.eventViewThumbsSize='large';}
+ else if (ld.eventViewThumbsSize=='large') {ld.eventViewThumbsSize='xsmall';}
+ NVR.debug ('changing thumb size to:'+ld.eventViewThumbsSize);
NVR.setLogin(ld);
$scope.loginData = ld;
recomputeRowHeights();
diff --git a/www/lang/locale-en.json b/www/lang/locale-en.json
index a4208e97..e23d44a8 100644
--- a/www/lang/locale-en.json
+++ b/www/lang/locale-en.json
@@ -114,6 +114,7 @@
"kEventSingleImageScale" :"Event single image scale",
"kEventStillRecording" :"event is still recording - showing live feed",
"kEventViewThumbsSize" :"thumbnail size",
+ "kEventViewThumbsXSmall" :"x-small",
"kEventViewThumbsSmall" :"small",
"kEventViewThumbsLarge" :"large",
"kEvents" :"events",
diff --git a/www/templates/events-popover.html b/www/templates/events-popover.html
index 425360c5..b37a70a0 100644
--- a/www/templates/events-popover.html
+++ b/www/templates/events-popover.html
@@ -7,7 +7,7 @@
Event Graphs
</a>-->
<a class="item" style="text-transform:capitalize;" ng-href="" ng-click="popover.hide();toggleThumbSize();doRefresh();">
- {{'kEventViewThumbsSize' | translate}}:{{(loginData.eventViewThumbsSize == 'small' ? 'kEventViewThumbsSmall': 'kEventViewThumbsLarge') | translate}}
+ {{'kEventViewThumbsSize' | translate}}: {{thumbSizeOptions[loginData.eventViewThumbsSize]}}
</a>
<a class="item" ng-href="" ng-click="popover.hide();doRefresh();">
{{'kRefresh' | translate}}
diff --git a/www/templates/events.html b/www/templates/events.html
index e8f5dfa7..f23f37d1 100644
--- a/www/templates/events.html
+++ b/www/templates/events.html
@@ -79,7 +79,7 @@
<!-- this ngswitch displays different icons
depending on the cause of the event -->
<span ng-switch on="event.Event.Cause"
- ng-class="::{'largeThumbsSpan': thumbClass=='large', 'smallThumbsSpan': thumbClass=='small'}">
+ ng-class="::{'largeThumbsSpan': thumbClass=='large', 'smallThumbsSpan': (thumbClass=='small' || thumbClass=='xsmall')}">
<span ng-switch-when="Motion">
<i class="ion-android-walk" style="font-size:150%;"></i>&nbsp;
<!-- <i ng-class="(event.Event.DefaultVideo !== undefined && event.Event.DefaultVideo!='')? 'ion-ios-videocam':'ion-images'" style="float:left; padding-left:5px; font-size:100%;"></i>-->
@@ -106,7 +106,7 @@
</span>
</div> <!-- col-->
<!-- 2 col format for small, 1 col format for large -->
- <span ng-if="thumbClass=='small' && loginData.eventViewThumbs!='none'">
+ <span ng-if="(thumbClass=='small' || thumbClass=='xsmall') && loginData.eventViewThumbs!='none'">
<div class="col">
<img bg-color="#6C7A89" ng-src="{{constructThumbnail(event)}}"
on-tap="closeIfOpen(event);openModalWithSnapshot(event)" width="{{event.Event.thumbWidth}}px"