various updates to lazy to document why

Former-commit-id: 21224eb61a2b5e060b38cca3bfd5e0ccb85f95d7

7 files changed, 73 insertions, 77 deletions

diff --git a/www/templates/devoptions.html b/www/templates/devoptions.html
index 7cc087d0..15ff0d1d 100644
--- a/www/templates/devoptions.html
+++ b/www/templates/devoptions.html
@@ -1,11 +1,11 @@
 <ion-view view-title="Dev. Settings">
     <ion-nav-buttons side="left">
         <button class="button button-icon button-clear ion-navicon" ng-click="openMenu()"></button>
-        
+
         <button data-badge="{{$root.alarmCount}}" class="animated infinite tada button button-icon button-clear ion-ios-bell notification-badge" ng-click="handleAlarms();" ng-if="$root.isAlarm"></button>
-        
+
     </ion-nav-buttons>
-    
+
     <ion-nav-buttons side="right">
         <button class="button button-clear" ng-click="saveDevOptions()">Save</button>
     </ion-nav-buttons>
@@ -17,28 +17,24 @@
                 <i class="ion-android-settings" style="font-size:150%"></i> Developer Options for {{loginData.serverName}}
             </span>
 
-             <div class="item item-input-inset">
+            <div class="item item-input-inset">
                 Frame update (sec.)&nbsp;
                 <label class="item-input-wrapper">
                     <input type="tel" placeholder="min is 1s" ng-model="loginData.refreshSec">
                 </label>
             </div>
-            
-            
+
+
             <label>
-                <ion-toggle ng-model="loginData.use24hr"
-                            ng-checked="{{loginData.use24hr}}"
-                            toggle-class="toggle-calm">enable 24hr time format</ion-toggle>
+                <ion-toggle ng-model="loginData.use24hr" ng-checked="{{loginData.use24hr}}" toggle-class="toggle-calm">enable 24hr time format</ion-toggle>
             </label>
-            
+
             <div ng-if="$root.platformOS=='android'">
                 <label>
-                    <ion-toggle ng-model="loginData.exitOnSleep"
-                                ng-checked="{{loginData.exitOnSleep}}"
-                                toggle-class="toggle-calm">exit app in background</ion-toggle>
+                    <ion-toggle ng-model="loginData.exitOnSleep" ng-checked="{{loginData.exitOnSleep}}" toggle-class="toggle-calm">exit app in background</ion-toggle>
                 </label>
             </div>
-            
+
             <!--
             <label>
                 <ion-toggle ng-model="loginData.useNphZms"
@@ -52,7 +48,7 @@
                             toggle-class="toggle-calm">use ZMS for events footage</ion-toggle>
             </label>
             -->
-            
+
             <div class="item item-input-inset">
                 Max monitors in montage&nbsp;
                 <label class="item-input-wrapper">
@@ -75,81 +71,77 @@
                     <input type="tel" placeholder="max is 70" ng-model="loginData.montageQuality">
                 </label>
             </div>
-            
+
             <div class="item item-input-inset">
-                 Event single image scale(%)&nbsp;
+                Event single image scale(%)&nbsp;
                 <label class="item-input-wrapper">
                     <input type="tel" placeholder="" ng-model="loginData.singleImageQuality">
                 </label>
             </div>
-            
+
             <div class="item item-input-inset">
-                 resume delay(ms)&nbsp;
+                resume delay(ms)&nbsp;
                 <label class="item-input-wrapper">
                     <input type="tel" placeholder="" ng-model="loginData.resumeDelay">
-                
+
                 </label>
-                
+
             </div>
-            
+
             <div class="item item-input-inset">
-                 Event Montage image scale(%)&nbsp;
+                Event Montage image scale(%)&nbsp;
                 <label class="item-input-wrapper">
                     <input type="tel" placeholder="" ng-model="loginData.montageHistoryQuality">
                 </label>
             </div>
-            
+
             <div class="item item-input-inset">
-                 Max. items for Timeline&nbsp;
+                Max. items for Timeline&nbsp;
                 <label class="item-input-wrapper">
                     <input type="tel" placeholder="" ng-model="loginData.graphSize">
                     <br/>
-            
+
                 </label>
                 <br/>
-        
+
             </div>
-            
+
             <div class="item" style="background-color:#C8F7C5" ng-if="loginData.graphSize > 5000">
-                <label class="animated fadeInDown item-text-wrap" >
-                    
-                A large value can affect timeline performance. If you find timeline performance slow, try reducing the value to 200 and work your way up from there.
-                    
+                <label class="animated fadeInDown item-text-wrap">
+
+                    A large value can affect timeline performance. If you find timeline performance slow, try reducing the value to 200 and work your way up from there.
+
                 </label>
             </div>
-            
+
             <label>
-            <ion-toggle ng-model="loginData.enableDebug"
-                        ng-checked="{{loginData.enableDebug}}"
-                        toggle-class="toggle-calm">Enable debug logs</ion-toggle>
+
+                <ion-toggle ng-model="loginData.enableLogs" ng-checked="{{loginData.enableLogs}}" toggle-class="toggle-calm">Enable logs</ion-toggle>
             </label>
-            
+
             <label>
-            <ion-toggle ng-model="loginData.canSwipeMonitors"
-                        ng-checked="{{loginData.canSwipeMonitors}}"
-                        toggle-class="toggle-calm">Swipe to change monitors</ion-toggle>
+
+                <ion-toggle ng-if="loginData.enableLogs" ng-model="loginData.enableDebug" ng-checked="{{loginData.enableDebug}}" toggle-class="toggle-calm">Enable debug logs</ion-toggle>
             </label>
-            
+
             <label>
-            <ion-toggle ng-model="loginData.persistMontageOrder"
-                        ng-checked="{{loginData.persistMontageOrder}}"
-                        toggle-class="toggle-calm">Persist hidden monitors</ion-toggle>
+                <ion-toggle ng-model="loginData.canSwipeMonitors" ng-checked="{{loginData.canSwipeMonitors}}" toggle-class="toggle-calm">Swipe to change monitors</ion-toggle>
             </label>
-            
-            
+
             <label>
-                <ion-toggle ng-model="loginData.enableh264"
-                        ng-checked="{{loginData.enableh264}}"
-                        toggle-class="toggle-calm"> H264 Video support</ion-toggle>
+                <ion-toggle ng-model="loginData.persistMontageOrder" ng-checked="{{loginData.persistMontageOrder}}" toggle-class="toggle-calm">Persist hidden monitors</ion-toggle>
             </label>
-            
+
+
             <label>
-                <ion-toggle ng-model="loginData.enableBlog"
-                        ng-checked="{{loginData.enableBlog}}"
-                        toggle-class="toggle-calm"> enable news updates</ion-toggle>
+                <ion-toggle ng-model="loginData.enableh264" ng-checked="{{loginData.enableh264}}" toggle-class="toggle-calm"> H264 Video support</ion-toggle>
             </label>
 
-            
+            <label>
+                <ion-toggle ng-model="loginData.enableBlog" ng-checked="{{loginData.enableBlog}}" toggle-class="toggle-calm"> enable news updates</ion-toggle>
+            </label>
+
+
         </div>
     </ion-content>
-</ion-view>
+</ion-view>
\ No newline at end of file
diff --git a/www/templates/events.html b/www/templates/events.html
index e85c4d03..88dab016 100644
--- a/www/templates/events.html
+++ b/www/templates/events.html
@@ -47,7 +47,7 @@
                 <ion-item collection-repeat="event in events| filter:search.text" item-height="event.Event.height" id="item-{{$index}}"  >
                     
                     
-                    <span style="float:right;margin-top:-18px;background-color:#6d0909;color:#fff;font-size:11px;opacity:0.7;width:90px;border-radius: 0px 0px 5px 5px;">&nbsp;&nbsp;&nbsp;<i class="ion-clock"></i>&nbsp;&nbsp;{{prettifyTime(event.Event.StartTime)}}</span>
+                    <span style="float:right;margin-top:-18px;background-color:#96281B;color:#fff;font-size:11px;opacity:0.7;width:90px;border-radius: 0px 0px 5px 5px;">&nbsp;&nbsp;&nbsp;<i class="ion-clock"></i>&nbsp;&nbsp;{{prettifyTime(event.Event.StartTime)}}</span>
 
                     <span style="float:left;margin-top:-18px;background-color:#444444;color:#fff;font-size:11px;opacity:0.7;width:90px;border-radius: 0px 0px 5px 5px;">&nbsp;&nbsp;&nbsp;<i class="ion-calendar"></i>&nbsp;&nbsp;{{prettifyDate(event.Event.StartTime)}}</span>
 
@@ -114,20 +114,20 @@
                     <span style="float:right">
                                 <div ng-if="event.Event.EndTime">
                                     
-                                    <button class="button button-small icon icon-left ion-stats-bars"
+                                    <button class="button button-small button-outline icon icon-left ion-stats-bars"
                                             ng-click="closeIfOpen(event);analyzeEvent(event)" >  Analyze
                                     </button>
                                     
-                                    <button class="button button-small icon icon-left ion-ios-eye"
+                                    <button class="button button-outline button-small icon icon-left ion-ios-eye"
                                             ng-click="toggleGroupScrub(event,$index,event.Event.Frames)" >  Scrub
                                     </button>
                                     
-                                    <button ng-if="event.Event.AlarmFrames > 0" class="button button-small icon icon-left ion-ios-bell"
+                                    <button  ng-if="event.Event.AlarmFrames > 0" class="button button-outline button-small icon icon-left ion-ios-bell"
                                             ng-click="toggleGroupAlarms(event,$index,event.Event.Frames)" >  alarms
                                     </button>
 
 
-                                    <button class="button button-small icon icon-left ion-ios-eye"
+                                    <button class="button button-outline button-small icon icon-left ion-ios-eye"
                                             ng-click="closeIfOpen(event);openModal(event)" > Footage
                                     </button>
                                 </div>
@@ -265,7 +265,7 @@
     </ion-content>
     <div class="events-float-filter" ng-if="isEventFilterOn" on-tap="filterTapped();">Filter On</div>
 
-    <ion-pull-up-footer class="bar-energized" on-expand="footerExpand()" on-collapse="footerCollapse()" initial-state="minimized" default-behavior="expand">
+    <ion-pull-up-footer class="zmPullup" on-expand="footerExpand()" on-collapse="footerCollapse()" initial-state="minimized" default-behavior="expand">
 
         <ion-pull-up-handle width="100" height="25" toggle="ion-chevron-up ion-chevron-down" style="border-radius: 25px 25px 0 0">
             <i class="icon ion-chevron-up"></i>
diff --git a/www/templates/important_message.html b/www/templates/important_message.html
index 5ad922e5..a97f1ada 100644
--- a/www/templates/important_message.html
+++ b/www/templates/important_message.html
@@ -19,7 +19,7 @@
                     <br/>
                     <h4 style="color:white">I'd appreciate if you upgraded ZoneMinder</h4>
                     <br/>
-                    You are running v{{currentVersion}}.<br/> v{{recommendedVersion}} has an important fix that eliminates a bug related to network data consumption build up of zmNinja. While your version will work, I'd recommend you upgrade ZoneMinder. Till you do, please make sure you don't keep zmNinja running in the background (for Android). Thank you. 
+                    You are running v{{currentVersion}}.<br/> v{{recommendedVersion}} has some important fixes that enhance the API amongst other things. This is required to avail of the new alarm APIs and other new features.
                     <br/>
                     Reported Version: <b>v{{currentVersion}}</b><br/>
                      Recommended Version:<b>v{{recommendedVersion}}</b><br/><br/>
diff --git a/www/templates/lowversion.html b/www/templates/lowversion.html
index 4e976846..3b50683b 100644
--- a/www/templates/lowversion.html
+++ b/www/templates/lowversion.html
@@ -1,6 +1,6 @@
 <ion-view view-title="zmNinja" hide-nav-bar="true" hide-back-button="true" cache-view="false">
     <!--<ion-view view-title="zmNinja" hide-nav-bar="false" hide-back-button="true" cache-view="false">-->
-    <ion-content class="pin-background" >
+    <ion-content class="pin-background">
         <div style="margin-left:20px; margin-right:20px">
             <center>
                 <br/>
@@ -9,8 +9,8 @@
                     <img src="img/authlogo.png">
                 </div>
 
-                    
-                    <br/> 
+
+                <br/>
                 <span style="color:white">
                     <h2 style="color:white" class="animated bounce">ZoneMinder upgrade needed</h2>
                     <br/>
@@ -18,12 +18,12 @@
                     <br/>
                     Reported Version: <b>{{currentVersion}}</b><br/>
                     Minimum Required Version:<b>{{requiredVersion}}</b><br/>
-                    </p>
                     
-                    </span>
-                    <br/>
                     
-                </div>
+                    </span>
+                <br/>
+
+
             </center>
         </div>
 
diff --git a/www/templates/montage-history.html b/www/templates/montage-history.html
index b91b3e16..392f390c 100644
--- a/www/templates/montage-history.html
+++ b/www/templates/montage-history.html
@@ -36,7 +36,7 @@
 
 
 
-        <div class="range range-positive">
+        <div class="range">
             <i style="color:#bbbbbb" class="icon ion-grid"></i>
             <input type="range" ng-model="slider.monsize" min="1" max="9" ng-change="sliderChanged(slider.monsize)">
             <i style="color:#bbbbbb" class="icon ion-image"></i>
diff --git a/www/templates/montage.html b/www/templates/montage.html
index 8f6b6adc..50944b3c 100644
--- a/www/templates/montage.html
+++ b/www/templates/montage.html
@@ -3,6 +3,11 @@
         <button class="button button-icon button-clear ion-navicon" ng-click="openMenu()"></button>
          <button class="button button-icon button-clear ion-eye" ng-click="hideUnhide();">&nbsp;
         </button>
+        
+        
+        <button class="button button-icon button-clear ion-arrow-resize" ng-click="toggleSizeButtons();">&nbsp;
+        </button>
+        
         <button data-badge="{{$root.alarmCount}}" class="animated infinite tada button button-icon button-clear ion-ios-bell notification-badge" ng-click="handleAlarms();" ng-if="$root.isAlarm"></button>
         
     </ion-nav-buttons>
@@ -24,14 +29,13 @@
 
     <ion-content ng-cloak has-bouncing="false" style="background-color:#444444" delegate-handle="montage-delegate"  >
     
-    
 
-        <span ng-show="!minimal">
+        <span ng-show="!minimal && showSizeButtons">
             <!-- this is header -->
             
-            <span ng-click="sliderChanged(1)" style="float:right;margin-top:0px;padding-top:8px;background-color:#6d0909;color:#fff;font-size:25px;opacity:1;width:40px;height:36px;border-radius: 0px 0px 0px 5px;">&nbsp;<i class="ion-plus-circled">&nbsp;</i></span>
+            <span ng-click="sliderChanged(1)" style="float:right;margin-top:0px;padding-top:8px;background-color:#5c6767;color:#fff;font-size:25px;opacity:1;width:40px;height:36px;border-radius: 0px 0px 0px 5px;">&nbsp;<i class="ion-plus-circled">&nbsp;</i></span>
             
-            <span ng-click="sliderChanged(-1)" style="float:left;margin-top:0px;padding-top:8px;background-color:#6d0909;color:#fff;font-size:22px;opacity:1;width:40px;height:36px;border-radius: 0px 0px 5px 0px;">&nbsp;<i class="ion-minus-circled">&nbsp;</i></span>
+            <span ng-click="sliderChanged(-1)" style="float:left;margin-top:0px;padding-top:8px;background-color:#5c6767;color:#fff;font-size:22px;opacity:1;width:40px;height:36px;border-radius: 0px 0px 5px 0px;">&nbsp;<i class="ion-minus-circled">&nbsp;</i></span>
             <br/><br/>
         </span>
         
@@ -115,7 +119,7 @@
             </button>
             <button mfb-button icon="ion-arrow-shrink" label="decrease size" ng-click="sliderChanged(-1)">
             </button>
-            <button mfb-button icon="ion-refresh" label="refresh" ng-click="reloadView();">
+            <button mfb-button icon="ion-refresh" label="refresh" ng-click="resetSizes();">
             </button>
             <button mfb-button icon="ion-close" label="exit full screen" ng-click="switchMinimal()">
             </button>
diff --git a/www/templates/timeline-modal.html b/www/templates/timeline-modal.html
index 1584b961..89753f72 100644
--- a/www/templates/timeline-modal.html
+++ b/www/templates/timeline-modal.html
@@ -35,9 +35,9 @@
                                 
                             <figure style="display:inline-block">
                                 <figcaption><small>f:{{alarm.fid}} scr:{{alarm.score}} @ {{alarm.time}}</small></figcaption>       
-                                <img ng-if="event.Event.imageMode=='path'" image-spinner-src="{{event.Event.baseURL}}/index.php?view=image&path={{event.Event.relativePath}}{{alarm.fname}}&height=380"    style="width: auto; height: auto;max-width: 100%;max-height: 170px" on-tap="showImage(event.Event.baseURL,event.Event.relativePath,alarm.fname, alarm.frameid, event.Event.Id, event.Event.imageMode, alarm.id)"/>
+                                <img ng-if="event.Event.imageMode=='path'" image-spinner-src="{{event.Event.baseURL}}/index.php?view=image&path={{event.Event.relativePath}}{{alarm.fname}}&height=380"    style="width: auto; height: auto;max-width: 100%;max-height: 170px" on-tap="showImage(event.Event.baseURL,event.Event.relativePath,alarm.fname, alarm.fid, event.Event.Id, event.Event.imageMode, alarm.id)"/>
                                                 
-                                <img ng-if="event.Event.imageMode=='fid'" image-spinner-src="{{event.Event.baseURL}}/index.php?view=image&fid={{alarm.id}}"    style="width: auto; height: auto;max-width: 100%;max-height: 170px" on-tap="showImage(event.Event.baseURL,event.Event.relativePath,alarm.fname, alarm.frameid, event.Event.Id, event.Event.imageMode, alarm.id)"/>
+                                <img ng-if="event.Event.imageMode=='fid'" image-spinner-src="{{event.Event.baseURL}}/index.php?view=image&fid={{alarm.id}}"    style="width: auto; height: auto;max-width: 100%;max-height: 170px" on-tap="showImage(event.Event.baseURL,event.Event.relativePath,alarm.fname, alarm.fid, event.Event.Id, event.Event.imageMode, alarm.id)"/>