From fb73ec7092b1763c4d64148dd8230751e10eec68 Mon Sep 17 00:00:00 2001
From: Pliable Pixels <pliablepixels@gmail.com>
Date: Mon, 15 Oct 2018 10:25:30 -0400
Subject: template cleanup

---
 www/templates/bookmark.html                | 34 +++++++++---------
 www/templates/devoptions.html              | 13 +++----
 www/templates/events-date-time-filter.html |  2 +-
 www/templates/events-graphs.html           | 12 ++++---
 www/templates/events-modal.html            | 34 +++++++++---------
 www/templates/events-popover.html          |  9 +++--
 www/templates/eventserversettings.html     | 14 +++++---
 www/templates/first-use.html               | 27 +++++++-------
 www/templates/important_message.html       | 22 ++++++------
 www/templates/invalidapi.html              | 21 +++++------
 www/templates/log.html                     |  6 ++--
 www/templates/login.html                   | 12 ++++---
 www/templates/lowversion.html              | 16 ++++-----
 www/templates/menu.html                    | 32 ++++++++---------
 www/templates/moment-popover.html          |  6 ++--
 www/templates/moment.html                  | 10 +++---
 www/templates/monitors-modal.html          | 58 ++++++++++++++++--------------
 www/templates/monitors.html                | 31 ++++++++--------
 www/templates/montage-history.html         | 38 +++++++++++---------
 www/templates/montage.html                 | 58 +++++++++++++++---------------
 www/templates/refresh.html                 |  8 ++---
 www/templates/state.html                   | 11 +++---
 www/templates/timeline-modal.html          |  6 ++--
 www/templates/timeline-popover.html        |  6 ++--
 www/templates/timeline.html                | 11 +++---
 www/templates/wizard.html                  | 48 ++++++++++++++-----------
 www/templates/zm-portal-login.html         | 12 +++----
 27 files changed, 303 insertions(+), 254 deletions(-)

diff --git a/www/templates/bookmark.html b/www/templates/bookmark.html
index 3538dbfd..af5e4516 100644
--- a/www/templates/bookmark.html
+++ b/www/templates/bookmark.html
@@ -11,7 +11,7 @@
       <div class="col col-25" ng-if="$index < bookmarks.length" ng-click="action(bookmarks[$index])">
         <div class="bookmarkButton">
           <i ng-class="(bookmarks[$index].text=='') ? 'ion-plus-circled':'ion-share'">
-            <br/>
+            <br />
             <span class="bookmark_text"> {{bookmarks[$index].text}}</span>
           </i>
         </div>
@@ -21,31 +21,31 @@
       <div class="col col-25" ng-if="$index + 1 < bookmarks.length" ng-click="action(bookmarks[$index+1])">
         <div class="bookmarkButton">
           <i ng-class="(bookmarks[$index+1].text=='') ? 'ion-plus-circled':'ion-share'">
-            <br/>
+            <br />
             <span class="bookmark_text"> {{bookmarks[$index+1].text}}</span>
           </i>
         </div>
-        </div>
+      </div>
 
-        <div class="col col-25" ng-if="$index + 2 < bookmarks.length" ng-click="action(bookmarks[$index+2])">
-          <div class="bookmarkButton">
-            <i ng-class="(bookmarks[$index+2].text=='') ? 'ion-plus-circled':'ion-share'">
-              <br/>
-              <span class="bookmark_text"> {{bookmarks[$index+2].text}}</span>
-            </i>
-          </div>
+      <div class="col col-25" ng-if="$index + 2 < bookmarks.length" ng-click="action(bookmarks[$index+2])">
+        <div class="bookmarkButton">
+          <i ng-class="(bookmarks[$index+2].text=='') ? 'ion-plus-circled':'ion-share'">
+            <br />
+            <span class="bookmark_text"> {{bookmarks[$index+2].text}}</span>
+          </i>
         </div>
+      </div>
 
-        <div class="col col-25" ng-if="$index + 3 < bookmarks.length" ng-click="action(bookmarks[$index+3])">
-          <div class="bookmarkButton">
-            <i ng-class="(bookmarks[$index+3].text=='') ? 'ion-plus-circled':'ion-share'">
-              <br/>
-              <span class="bookmark_text"> {{bookmarks[$index+3].text}}</span>
-            </i>
+      <div class="col col-25" ng-if="$index + 3 < bookmarks.length" ng-click="action(bookmarks[$index+3])">
+        <div class="bookmarkButton">
+          <i ng-class="(bookmarks[$index+3].text=='') ? 'ion-plus-circled':'ion-share'">
+            <br />
+            <span class="bookmark_text"> {{bookmarks[$index+3].text}}</span>
+          </i>
 
-          </div>
         </div>
       </div>
+    </div>
 
   </ion-content>
 </ion-view>
diff --git a/www/templates/devoptions.html b/www/templates/devoptions.html
index 77608027..c2937a3b 100644
--- a/www/templates/devoptions.html
+++ b/www/templates/devoptions.html
@@ -11,7 +11,8 @@
   <ion-content delegate-handle="none" overflow-scroll="false" mouse-wheel-scroll>
     <div class="list list-inset">
       <span style="color:rgb(100,100,100)">
-        <i class="ion-android-settings" style="font-size:150%"></i> {{'kDeveloperOptionsFor'|translate}} {{loginData.serverName}}
+        <i class="ion-android-settings" style="font-size:150%"></i> {{'kDeveloperOptionsFor'|translate}}
+        {{loginData.serverName}}
       </span>
       <div class="item item-input-inset">
         {{'kFrameUpdate'|translate}} ({{'kSec'|translate}}.)&nbsp;
@@ -109,17 +110,17 @@
         {{'kMaxItemsForTimeline' | translate}}&nbsp;
         <label class="item-input-wrapper">
           <input type="tel" placeholder="" ng-model="loginData.graphSize">
-          <br/>
+          <br />
         </label>
-        <br/>
+        <br />
       </div>
       <div class="item item-text-wrap item-input-inset">
         {{'kMinAlarmCount' | translate}}&nbsp;
         <label class="item-input-wrapper">
           <input type="tel" placeholder="" ng-model="loginData.minAlarmCount">
-          <br/>
+          <br />
         </label>
-        <br/>
+        <br />
       </div>
       <div class="item" style="background-color:#C8F7C5" ng-if="loginData.graphSize > 5000">
         <label class="animated fadeInDown item-text-wrap">
@@ -142,7 +143,7 @@
         </ion-toggle>
       </label>
 
-      
+
       <label>
         <ion-toggle ng-model="loginData.enableThumbs" toggle-class="toggle-calm">
           <span class="item-text-wrap">{{'kEnableThumbs' | translate}}
diff --git a/www/templates/events-date-time-filter.html b/www/templates/events-date-time-filter.html
index 395c29d2..262feed8 100644
--- a/www/templates/events-date-time-filter.html
+++ b/www/templates/events-date-time-filter.html
@@ -16,7 +16,7 @@
       <span class="input-label">{{'kToTime'|translate}}</span>
       <input type="time" ng-model="$root.toTime">
     </label>
-    <br/>
+    <br />
     <center>
       <button class="button" ng-click="saveFilters();"> {{'kSave'|translate}}
       </button>
diff --git a/www/templates/events-graphs.html b/www/templates/events-graphs.html
index 573bf6ad..33287e3f 100644
--- a/www/templates/events-graphs.html
+++ b/www/templates/events-graphs.html
@@ -17,7 +17,8 @@
       <ion-nav-view>
         <ion-content class="has-header">
           <div ng-controller="zmApp.EventsGraphsCtrl">
-            <canvas tc-chartjs-bar chart-data="chart.data" chart-options="chart.options" ng-click="handleChartClick($event)" chart="chartwithbars">
+            <canvas tc-chartjs-bar chart-data="chart.data" chart-options="chart.options" ng-click="handleChartClick($event)"
+              chart="chartwithbars">
             </canvas>
           </div>
         </ion-content>
@@ -29,7 +30,8 @@
         <ion-content>
           <div ng-controller="zmApp.EventsGraphsCtrl">
             <div style="overflow:scroll;">
-              <canvas tc-chartjs-bar chart-data="chart.data" chart-options="chart.options" ng-click="handleChartClick($event)" chart="chartwithbars">
+              <canvas tc-chartjs-bar chart-data="chart.data" chart-options="chart.options" ng-click="handleChartClick($event)"
+                chart="chartwithbars">
               </canvas>
             </div>
           </div>
@@ -42,7 +44,8 @@
         <ion-content>
           <div ng-controller="zmApp.EventsGraphsCtrl">
             <div style="overflow:scroll;">
-              <canvas tc-chartjs-bar chart-data="chart.data" chart-options="chart.options" chart="chartwithbars" ng-click="handleChartClick($event)">
+              <canvas tc-chartjs-bar chart-data="chart.data" chart-options="chart.options" chart="chartwithbars"
+                ng-click="handleChartClick($event)">
               </canvas>
             </div>
           </div>
@@ -55,7 +58,8 @@
         <ion-content>
           <div ng-controller="zmApp.EventsGraphsCtrl">
             <div style="overflow:scroll;">
-              <canvas tc-chartjs-bar chart-data="chart.data" chart-options="chart.options" chart="chartwithbars" ng-click="handleChartClick($event)">
+              <canvas tc-chartjs-bar chart-data="chart.data" chart-options="chart.options" chart="chartwithbars"
+                ng-click="handleChartClick($event)">
               </canvas>
             </div>
           </div>
diff --git a/www/templates/events-modal.html b/www/templates/events-modal.html
index 1f168b69..164c3f62 100644
--- a/www/templates/events-modal.html
+++ b/www/templates/events-modal.html
@@ -19,8 +19,8 @@
         </ion-scroll>
       </div>
 
-      <ion-scroll has-bouncing=false min-zoom=1 zooming="true" direction="xy" delegate-handle="imgscroll" overflow-scroll="false"
-        scrollbar-x="false" scrollbar-y="false">
+      <ion-scroll has-bouncing=false min-zoom=1 zooming="true" direction="xy" delegate-handle="imgscroll"
+        overflow-scroll="false" scrollbar-x="false" scrollbar-y="false">
         <div id="full-screen-event" style="height: 100vh;">
 
           <div ng-if="defaultVideo=='' || isSnapShot()">
@@ -35,15 +35,15 @@
 
 
               <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" imageonload="modalImageLoaded()"
-                on-swipe-left="onSwipeEvent(nextId,1)" on-swipe-right="onSwipeEvent(prevId,-1)" />
+                on-double-tap="closeModal();" img-spinner-w="1024" img-spinner-h="768" image-spinner-loader="lines"
+                imageonload="modalImageLoaded()" on-swipe-left="onSwipeEvent(nextId,1)" on-swipe-right="onSwipeEvent(prevId,-1)" />
 
 
               <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" image-spinner-loader="lines" imageonload="modalImageLoaded()" on-swipe-left="onSwipeEvent(nextId,1)"
-                  on-swipe-right="onSwipeEvent(prevId,-1)" />
+                  img-spinner-w="1024" img-spinner-h="768" image-spinner-loader="lines" imageonload="modalImageLoaded()"
+                  on-swipe-left="onSwipeEvent(nextId,1)" on-swipe-right="onSwipeEvent(prevId,-1)" />
                 <div class="events-range-modal-text">
                   <span class="events-range-modal-warning-text">{{eventWarning}}</span>
                 </div>
@@ -51,7 +51,8 @@
 
 
 
-              <div ng-if="isPaused" style="position:absolute; top:50%; left:50%;white-space:nowrap;overflow:hidden;z-index:999" class="header-paused">
+              <div ng-if="isPaused" style="position:absolute; top:50%; left:50%;white-space:nowrap;overflow:hidden;z-index:999"
+                class="header-paused">
                 &nbsp;
                 <i class="ion-pause"></i> {{'kPaused' | translate}}&nbsp;
               </div>
@@ -64,11 +65,11 @@
               <!-- <div style="height:{{$root.devHeight}}px; width:{{$root.devWidth}}px;">-->
               <div on-swipe-left="onSwipeEvent(nextId,1)" on-swipe-right="onSwipeEvent(prevId,-1)" ng-style="{'height':$root.devHeight+'px', 'width':$root.devWidth+'px'}">
 
-                <videogular vg-can-play="onCanPlay()" vg-native-fullscreen="videoObject.config.nativeFullScreen" vg-player-ready="onPlayerReady($API)"
-                  vg-update-playback="onPlaybackUpdate($playBack)" vg-plays-inline="videoObject.config.playsInline" vg-theme="videoObject.config.theme"
-                  vg-complete="playbackFinished()" on-double-tap="closeModal();" vg-autoplay="videoObject.config.autoPlay"
-                  vg-responsive="videoObject.config.responsive" vg-update-time="videoTime(event.Event.StartTime,$currentTime)"
-                  vg-error="onVideoError($event)">
+                <videogular vg-can-play="onCanPlay()" vg-native-fullscreen="videoObject.config.nativeFullScreen"
+                  vg-player-ready="onPlayerReady($API)" vg-update-playback="onPlaybackUpdate($playBack)"
+                  vg-plays-inline="videoObject.config.playsInline" vg-theme="videoObject.config.theme" vg-complete="playbackFinished()"
+                  on-double-tap="closeModal();" vg-autoplay="videoObject.config.autoPlay" vg-responsive="videoObject.config.responsive"
+                  vg-update-time="videoTime(event.Event.StartTime,$currentTime)" vg-error="onVideoError($event)">
                   <vg-media vg-src="videoObject.config.sources" vg-native-controls="videoObject.config.nativeControls">
                   </vg-media>
                   <vg-controls>
@@ -102,7 +103,8 @@
       <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>
+                        padding-right:23px;" id="eventchart" width="auto"
+            height="20"></canvas>
         </div>
 
         <div ng-if="checkEventOn" id="event_slider" data-tap-disabled="false">
@@ -124,8 +126,8 @@
 
 
   <div ng-show="!liveFeedMid">
-    <nav mfb-menu position="br" effect="zoomin" label="{{'kCollapse'|translate}}" active-icon="ion-chevron-down" resting-icon="ion-chevron-up"
-      toggling-method="click">
+    <nav mfb-menu position="br" effect="zoomin" label="{{'kCollapse'|translate}}" active-icon="ion-chevron-down"
+      resting-icon="ion-chevron-up" 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>
       <a ng-if="!isSnapShot()" mfb-button icon="ion-arrow-resize" label="{{imageFit? ('kFillScreen' | translate):('kFitScreen' | translate)}}"
@@ -161,7 +163,7 @@
           </a>
         </li>
 
-        
+
 
         <li ng-if="isToggleListMenu && defaultVideo !='' && defaultVideo != undefined">
           <a href="" ng-click="saveEventVideoToPhoneWithPerms()">
diff --git a/www/templates/events-popover.html b/www/templates/events-popover.html
index 5c7e7c15..d61f8f5b 100644
--- a/www/templates/events-popover.html
+++ b/www/templates/events-popover.html
@@ -1,15 +1,18 @@
 <ion-popover-view class="fit">
   <ion-content>
     <div class="list" ng-click="popover.hide()">
-      <a class="item" ng-href="" ng-click="popover.hide();$state.go('app.events-date-time-filter');">{{'kFilterByDateTime' | translate}}</a>
+      <a class="item" ng-href="" ng-click="popover.hide();$state.go('app.events-date-time-filter');">{{'kFilterByDateTime'
+        | translate}}</a>
       <!-- <a class="item" ng-href="" ng-click=" popover.hide();$state.go('events-graphs');" >
               Event Graphs
             </a>-->
       <a class="item" ng-href="" ng-click="popover.hide();doRefresh();">
         {{'kRefresh' | translate}}
       </a>
-      <a class="item" ng-href="" ng-click="popover.hide();toggleMinAlarmFrameCount();" ng-if="loginData.enableAlarmCount">{{'kShowAllEvents' | translate}}</a>
-      <a class="item" ng-href="" ng-click="popover.hide();toggleMinAlarmFrameCount();" ng-if="!loginData.enableAlarmCount"> {{'kShowAlarmedEvents' | translate}}</a>
+      <a class="item" ng-href="" ng-click="popover.hide();toggleMinAlarmFrameCount();" ng-if="loginData.enableAlarmCount">{{'kShowAllEvents'
+        | translate}}</a>
+      <a class="item" ng-href="" ng-click="popover.hide();toggleMinAlarmFrameCount();" ng-if="!loginData.enableAlarmCount">
+        {{'kShowAlarmedEvents' | translate}}</a>
     </div>
   </ion-content>
 </ion-popover-view>
diff --git a/www/templates/eventserversettings.html b/www/templates/eventserversettings.html
index 602f8ca4..a56652e4 100644
--- a/www/templates/eventserversettings.html
+++ b/www/templates/eventserversettings.html
@@ -21,18 +21,22 @@
       <input autocapitalize="none" autocomplete="off" autocorrect="off" type="text" placeholder="{{'kEventNotificationUrl' | translate}}"
         ng-model="loginData.eventServer">
     </label>
-    <ion-toggle ng-if="loginData.isUseEventServer" ng-model="loginData.disablePush" toggle-class="toggle-calm" class="item-text-wrap">{{'kOnlyUseWebSocket'| translate }}
-      <br/>
+    <ion-toggle ng-if="loginData.isUseEventServer" ng-model="loginData.disablePush" toggle-class="toggle-calm" class="item-text-wrap">{{'kOnlyUseWebSocket'|
+      translate }}
+      <br />
       <p>{{'kDisablePush' | translate }}</p>
     </ion-toggle>
     <!-- vibrate app setting is not av. on iOS-->
-    <ion-toggle ng-if="loginData.isUseEventServer && $root.platformOS !='ios'" ng-model="loginData.vibrateOnPush" toggle-class="toggle-calm">{{'kVibrateOnPush'| translate }}</ion-toggle>
-    <ion-toggle ng-if="loginData.isUseEventServer" ng-model="loginData.soundOnPush" toggle-class="toggle-calm" class="item-text-wrap">{{'kSoundOnPush'| translate }}</ion-toggle>
+    <ion-toggle ng-if="loginData.isUseEventServer && $root.platformOS !='ios'" ng-model="loginData.vibrateOnPush"
+      toggle-class="toggle-calm">{{'kVibrateOnPush'| translate }}</ion-toggle>
+    <ion-toggle ng-if="loginData.isUseEventServer" ng-model="loginData.soundOnPush" toggle-class="toggle-calm" class="item-text-wrap">{{'kSoundOnPush'|
+      translate }}</ion-toggle>
 
     <ion-list>
       <div ng-repeat="monitor in monitors">
         <ion-item class="custom-list" ng-click="toggleGroup(monitor)" ng-class="{active: isGroupShown(monitor)}">
-          <i class="icon" ng-class="isGroupShown(monitor) ? 'ion-minus' : 'ion-plus'"></i> &nbsp; {{monitor.Monitor.Name}}
+          <i class="icon" ng-class="isGroupShown(monitor) ? 'ion-minus' : 'ion-plus'"></i> &nbsp;
+          {{monitor.Monitor.Name}}
         </ion-item>
         <ion-item class="item-accordion" ng-show="isGroupShown(monitor)">
           <span class="item-checkbox">
diff --git a/www/templates/first-use.html b/www/templates/first-use.html
index 616f0cd0..5f98bb6b 100644
--- a/www/templates/first-use.html
+++ b/www/templates/first-use.html
@@ -2,23 +2,23 @@
   <ion-content class="pin-background">
     <div style="margin-left:20px; margin-right:20px">
       <center>
-        <br/>
-        <br/>
+        <br />
+        <br />
         <div id="responsive-image">
           <img src="img/authlogo.png">
         </div>
-        <br/>
+        <br />
         <span style="color:white">
           <h2 style="color:white">Hi There!</h2>
-          <br/>
+          <br />
           <h4 style="color:white">{{'kThanksForUsing' | translate}} {{$root.appName}}.
-            <br/>
-            <br/> {{'kNeedToKnow' | translate}}
+            <br />
+            <br /> {{'kNeedToKnow' | translate}}
           </h4>
-          <br/>
+          <br />
 
         </span>
-        <br/>
+        <br />
         <div id="firstuse">
           <button class="button icon icon-left ion-wand button-stable animated bounceInUp" ng-click="goToWizard()">
             {{'kWizard' | translate}}
@@ -26,14 +26,15 @@
           <button class="button icon icon-left ion-university button-stable animated bounceInUp" ng-click="goToLogin()">
             {{'kExpert' | translate }}
           </button>
-          <br/>
+          <br />
           <center>
-            <button class="button button-clear icon icon-left ion-android-globe white-button-text animated bounceInUp" ng-click="switchLang()">
-              {{'kLanguage' | translate}} 
+            <button class="button button-clear icon icon-left ion-android-globe white-button-text animated bounceInUp"
+              ng-click="switchLang()">
+              {{'kLanguage' | translate}}
             </button>
             <div class="animated bounceInUp">
-              <small ><a style="text-decoration:none; color:white" 
-                 href="#" onclick="window.open('https://medium.com/zmninja/zmninja-privacy-and-your-data-5489a5974baf', '_blank', 'location=yes'); return false;">{{'kDataPrivacy' | translate}}</a>
+              <small><a style="text-decoration:none; color:white" href="#" onclick="window.open('https://medium.com/zmninja/zmninja-privacy-and-your-data-5489a5974baf', '_blank', 'location=yes'); return false;">{{'kDataPrivacy'
+                  | translate}}</a>
               </small>
             </div>
           </center>
diff --git a/www/templates/important_message.html b/www/templates/important_message.html
index 3838dd76..933c3802 100644
--- a/www/templates/important_message.html
+++ b/www/templates/important_message.html
@@ -5,24 +5,24 @@
   <ion-content class="pin-background">
     <div style="margin-left:20px; margin-right:20px">
       <center>
-        <br/>
-        <br/>
+        <br />
+        <br />
         <div id="responsive-image">
           <img src="img/authlogo.png">
         </div>
-        <br/>
+        <br />
         <span style="color:white">
           <h2 style="color:white" class="animated bounce">{{'kImpMsg1' | translate}}</h2>
-          <br/>
+          <br />
           <h4 style="color:white">{{'kImpMsg2' | translate}}</h4>
-          <br/> {{'kImpMsg3' | translate}} v{{currentVersion}}.
-          <br/> v{{recommendedVersion}} {{'kImpMsg4' | translate}}
-          <br/> {{'kImpMsg5' | translate}}:
+          <br /> {{'kImpMsg3' | translate}} v{{currentVersion}}.
+          <br /> v{{recommendedVersion}} {{'kImpMsg4' | translate}}
+          <br /> {{'kImpMsg5' | translate}}:
           <b>v{{currentVersion}}</b>
-          <br/> {{'kImpMsg6' | translate}}:
+          <br /> {{'kImpMsg6' | translate}}:
           <b>v{{recommendedVersion}}</b>
-          <br/>
-          <br/>
+          <br />
+          <br />
 
           <button class="button button-stable animated bounceInUp" ng-click="openMenu()">
             {{'kImpMsg7' | translate}}
@@ -31,7 +31,7 @@
 
         </span>
       </center>
-      <br/>
+      <br />
     </div>
   </ion-content>
 </ion-view>
diff --git a/www/templates/invalidapi.html b/www/templates/invalidapi.html
index 3a63e545..c73e8be7 100644
--- a/www/templates/invalidapi.html
+++ b/www/templates/invalidapi.html
@@ -5,27 +5,28 @@
   <ion-content class="pin-background">
     <div style="margin-left:20px; margin-right:20px">
       <center>
-        <br/>
-        <br/>
+        <br />
+        <br />
         <div id="responsive-image">
           <img src="img/authlogo.png">
         </div>
-        <br/>
+        <br />
         <span style="color:white">
           <h2 style="color:white" class="animated bounce">{{'kInvalidAPIHeader' | translate}}</h2>
-          <br/>
+          <br />
           <h4 style="color:white">{{'kInvalidAPIBody' | translate}}</h4>
 
-          <br/>
-          <br/>
+          <br />
+          <br />
 
           <button class="button button-stable animated bounceInUp" ng-click="readFAQ()">
-            {{'kInvalidAPIRead' | translate}}</button> <button class="button button-stable animated bounceInUp" ng-click="openMenu()">
-                {{'kMenuOptions' | translate}}</button>
-    
+            {{'kInvalidAPIRead' | translate}}</button> <button class="button button-stable animated bounceInUp"
+            ng-click="openMenu()">
+            {{'kMenuOptions' | translate}}</button>
+
         </span>
       </center>
-      <br/>
+      <br />
     </div>
   </ion-content>
 </ion-view>
diff --git a/www/templates/log.html b/www/templates/log.html
index fb97ff72..0ad840d8 100644
--- a/www/templates/log.html
+++ b/www/templates/log.html
@@ -21,11 +21,11 @@
   </ion-nav-buttons>
   <ion-content delegate-handle="none" overflow-scroll="false" mouse-wheel-scroll>
 
-   <!-- <h2> iCloud: </h2>
+    <!-- <h2> iCloud: </h2>
     {{cloudString}}
 
     <br/>-->
-    
+
     <div ng-if="logEntity=='ZoneMinder'">
 
       <button class="button button-small button-stable icon ion-chevron-left" ng-click="changePage(1)">
@@ -44,7 +44,7 @@
     </div>
 
 
-    <br/>
+    <br />
     <!-- don't indent here its a pre-->
     <pre class="selectable" data-tap-disabled="{{selectOn}}">{{log.logString}}</pre>
   </ion-content>
diff --git a/www/templates/login.html b/www/templates/login.html
index 8fbd1dc3..2d406223 100644
--- a/www/templates/login.html
+++ b/www/templates/login.html
@@ -16,12 +16,12 @@
       </label>
     </div>
     <label>
-        
-    <ion-toggle ng-if="$root.platformOS != 'desktop'" ng-model="loginData.saveToCloud" toggle-class="toggle-calm">
+
+      <ion-toggle ng-if="$root.platformOS != 'desktop'" ng-model="loginData.saveToCloud" toggle-class="toggle-calm">
         <span class="item-text-wrap">{{'kSaveToCloud'|translate}}</span>
         <p ng-if="$root.platformOS=='ios'"> <span class="item-text-wrap">{{'kSaveToCloudIOS' | translate}}</span></p>
         <p ng-if="$root.platformOS=='android'"> <span class="item-text-wrap">{{'kSaveToCloudANDROID' | translate}}</span></p>
-    </ion-toggle>
+      </ion-toggle>
 
       <ion-toggle ng-model="loginData.enableLowBandwidth" toggle-class="toggle-calm">
         <span class="item-text-wrap">{{'kLowBandwidth'|translate}}</span>
@@ -43,7 +43,8 @@
         <div ng-if="loginData.isUseAuth">
           <label class="item item-input item-floating-label">
             <span class="input-label">{{'kUserName'|translate}}</span>
-            <input autocapitalize="none" autocomplete="off" autocorrect="off" type="text" placeholder="{{'kUserName' | translate}}" ng-model="loginData.username">
+            <input autocapitalize="none" autocomplete="off" autocorrect="off" type="text" placeholder="{{'kUserName' | translate}}"
+              ng-model="loginData.username">
           </label>
           <label class="item item-input item-floating-label">
             <span class="input-label">{{'kPassword' | translate}}</span>
@@ -57,7 +58,8 @@
         <div ng-if="loginData.isUseBasicAuth">
           <label class="item item-input item-floating-label">
             <span class="input-label">{{'kUserName'|translate}}</span>
-            <input autocapitalize="none" autocomplete="off" autocorrect="off" type="text" placeholder="{{'kUserName' | translate}}" ng-model="loginData.basicAuthUser">
+            <input autocapitalize="none" autocomplete="off" autocorrect="off" type="text" placeholder="{{'kUserName' | translate}}"
+              ng-model="loginData.basicAuthUser">
           </label>
           <label class="item item-input item-floating-label">
             <span class="input-label">{{'kPassword' | translate}}</span>
diff --git a/www/templates/lowversion.html b/www/templates/lowversion.html
index 50a3e978..440406b7 100644
--- a/www/templates/lowversion.html
+++ b/www/templates/lowversion.html
@@ -2,25 +2,25 @@
   <ion-content class="pin-background">
     <div style="margin-left:20px; margin-right:20px">
       <center>
-        <br/>
-        <br/>
+        <br />
+        <br />
         <div id="responsive-image">
           <img src="img/authlogo.png">
         </div>
-        <br/>
+        <br />
         <span style="color:white">
           <h2 style="color:white" class="animated bounce">{{'kZMUpgradeNeeded' | translate}}</h2>
-          <br/>
+          <br />
           <h4 style="color:white">{{'kVersionIncompatible' | translate }}</h4>
-          <br/> {{'kReportedVersion' | translate}}:
+          <br /> {{'kReportedVersion' | translate}}:
           <b>{{currentVersion}}</b>
-          <br/> {{'kMinVersion' | translate}}:
+          <br /> {{'kMinVersion' | translate}}:
           <b>{{requiredVersion}}</b>
-          <br/>
+          <br />
 
 
         </span>
-        <br/>
+        <br />
       </center>
     </div>
   </ion-content>
diff --git a/www/templates/menu.html b/www/templates/menu.html
index 32fc15e7..4e70c9b3 100644
--- a/www/templates/menu.html
+++ b/www/templates/menu.html
@@ -10,7 +10,7 @@
     </ion-side-menu-content>
     <ion-side-menu>
       <ion-header-bar class="bar bar-header bar-stable">
-          <button class="button icon ion-person-stalker" ng-click="switchProfiles()"></button>
+        <button class="button icon ion-person-stalker" ng-click="switchProfiles()"></button>
         <h1 class="title">{{'kMenuOptions'|translate}}</h1>
         </button>
       </ion-header-bar>
@@ -21,11 +21,11 @@
 
           <ion-item ng-if="0" href="#/app/bookmark" ng-click="go('/app/bookmark)')">
             <span class=" item-icon-left">
-                <i class="icon ion-bookmark"></i>
-              </span>{{'kBookmark'| translate}}
+              <i class="icon ion-bookmark"></i>
+            </span>{{'kBookmark'| translate}}
           </ion-item>
 
-          <ion-item id="menu-move-1" href="#/app/montage" ng-click="go('/app/montage')" >
+          <ion-item id="menu-move-1" href="#/app/montage" ng-click="go('/app/montage')">
 
             <!--<span ng-if="$root.runMode=='lowbw'" 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;">&nbsp;<i class="icon ion-arrow-graph-down-left"></i>&nbsp;</span>-->
             <span class=" item-icon-left">
@@ -34,28 +34,28 @@
           </ion-item>
 
           <!--<ion-item ng-click="navigateView('app.timeline')" menu-close>-->
-          <ion-item id="menu-move-2"   href="#/app/timeline"  ng-click="go('/app/timeline')" >
+          <ion-item id="menu-move-2" href="#/app/timeline" ng-click="go('/app/timeline')">
             <span class=" item-icon-left">
               <i class="icon ion-android-time"></i>
             </span>{{'kMenuTimeline'|translate}}
           </ion-item>
 
           <!--<ion-item ng-click="navigateView('app.events', {id:0,playEvent:false})"  menu-close>-->
-          <ion-item id="menu-move-3"  href="#/app/events/0/false" ng-click="go('/app/events/0/false')"  >
+          <ion-item id="menu-move-3" href="#/app/events/0/false" ng-click="go('/app/events/0/false')">
             <span class=" item-icon-left">
               <i class="icon ion-ios-calendar-outline"></i>
             </span>{{'kMenuEvents'|translate}}
           </ion-item>
 
           <!--<ion-item  ng-click="navigateView('app.moment')" menu-close>-->
-          <ion-item id="menu-move-4" ng-click="go('/app/moment')"  href="#/app/moment" ng-click="go('/app/moment')">
+          <ion-item id="menu-move-4" ng-click="go('/app/moment')" href="#/app/moment" ng-click="go('/app/moment')">
             <span class=" item-icon-left">
               <i class="icon ion-star"></i>
             </span>{{'kMoment24Heading'|translate}}
           </ion-item>
 
           <!-- <ion-item  ng-click="navigateView('app.montage-history')" menu-close>-->
-          <ion-item id="menu-move-5"  href="#/app/montage-history" ng-click="go('/app/montage-history')" >
+          <ion-item id="menu-move-5" href="#/app/montage-history" ng-click="go('/app/montage-history')">
             <span class=" item-icon-left">
               <i class="icon ion-ios-keypad-outline"></i>
             </span>{{'kMenuEventMontage'|translate}}
@@ -63,21 +63,21 @@
 
 
           <!--<ion-item ng-click="navigateView('app.monitors')" menu-close>-->
-          <ion-item id="menu-move-6"  href="#/app/monitors"  ng-click="go('/app/monitors')" >
+          <ion-item id="menu-move-6" href="#/app/monitors" ng-click="go('/app/monitors')">
             <span class=" item-icon-left">
               <i class="icon ion-ios-videocam-outline"></i>
             </span>{{'kMenuMonitors'|translate}}
           </ion-item>
 
           <!--<ion-item ng-click="navigateView('app.state')" menu-close>-->
-          <ion-item  id="menu-move-7"  href="#/app/state"  ng-click="go('/app/state')">
+          <ion-item id="menu-move-7" href="#/app/state" ng-click="go('/app/state')">
             <span class=" item-icon-left">
               <i class="icon ion-information-circled"></i>
             </span> {{'kMenuSystemStatus'|translate}}
           </ion-item>
 
           <!--<ion-item nav-clear menu-close ng-click="navigateView('app.login', {wizard:false})" >-->
-          <ion-item id="menu-move-8"  nav-clear  href="#/app/login/false" ng-click="go('/app/login/false')">
+          <ion-item id="menu-move-8" nav-clear href="#/app/login/false" ng-click="go('/app/login/false')">
             <span class=" item-icon-left">
               <i class="icon ion-person"></i>
               {{'kMenuZMSettings'|translate}}
@@ -88,7 +88,7 @@
             </span>
           </ion-item>
 
-          <ion-item id="menu-move-9"  nav-clear  href="#/app/devoptions" ng-click="go('/app/devoptions')" >
+          <ion-item id="menu-move-9" nav-clear href="#/app/devoptions" ng-click="go('/app/devoptions')">
             <!--<ion-item nav-clear menu-close ng-click="navigateView('app.devoptions')">-->
             <span class=" item-icon-left">
               <i class="icon ion-settings"></i>
@@ -102,7 +102,7 @@
           </ion-item>
 
           <!--<ion-item nav-clear menu-close ng-click="navigateView('app.help')" >-->
-          <ion-item id="menu-move-10"  nav-clear  href="#/app/help" ng-click="go('/app/help')">
+          <ion-item id="menu-move-10" nav-clear href="#/app/help" ng-click="go('/app/help')">
             <span class=" item-icon-left">
               <i class="icon ion-help"></i>
             </span> {{'kMenuHelp'|translate}}
@@ -110,7 +110,7 @@
 
 
           <!--<ion-item nav-clear menu-close ng-click="navigateView('app.wizard')" >-->
-          <ion-item id="menu-move-11"  nav-clear  href="#/app/wizard" ng-click="go('/app/wizard')">
+          <ion-item id="menu-move-11" nav-clear href="#/app/wizard" ng-click="go('/app/wizard')">
             <span class=" item-icon-left">
               <i class="icon ion-wand"></i>
             </span> {{'kMenuWizard'|translate}}
@@ -127,7 +127,7 @@
           </div>
 
           <!--<ion-item nav-clear menu-close ng-click="navigateView('app.log')" >-->
-          <ion-item id="menu-move-12"  nav-clear   href="#/app/log" ng-click="go('/app/log')">
+          <ion-item id="menu-move-12" nav-clear href="#/app/log" ng-click="go('/app/log')">
             <span class=" item-icon-left">
               <i class="icon ion-clipboard"></i>
             </span> {{'kMenuLogs'|translate}}
@@ -150,7 +150,7 @@
           </div>
           <ion-item style="color:rgb(106, 106, 106); font-size:90%;">
             <i class="ion-ios-location"></i> {{$root.getLocalTimeZone();}}
-            <br/>
+            <br />
             <span ng-if="$root.isTzSupported()">
               <i class="icon icon-server"></i> {{$root.getServerTimeZoneNow();}} </span>
           </ion-item>
diff --git a/www/templates/moment-popover.html b/www/templates/moment-popover.html
index 8cc8cab4..6d2485ca 100644
--- a/www/templates/moment-popover.html
+++ b/www/templates/moment-popover.html
@@ -8,12 +8,14 @@
 
       </a>
 
-      <a class="item" ng-href="" ng-click="popover.remove();getMoments('monitorName');">{{'kMomentMenuByMonitor' | translate}}
+      <a class="item" ng-href="" ng-click="popover.remove();getMoments('monitorName');">{{'kMomentMenuByMonitor' |
+        translate}}
         <i ng-if="::isChecked('kMomentMenuByMonitor')" class="ion-checkmark"></i>
       </a>
 
 
-      <a class="item" ng-href="" ng-click="popover.remove();getMoments('MaxScore');">{{'kMomentMenuByScore' | translate}}
+      <a class="item" ng-href="" ng-click="popover.remove();getMoments('MaxScore');">{{'kMomentMenuByScore' |
+        translate}}
         <i ng-if="::isChecked('kMomentMenuByScore')" class="ion-checkmark"></i>
       </a>
 
diff --git a/www/templates/moment.html b/www/templates/moment.html
index 2e60dce6..45cdbd13 100644
--- a/www/templates/moment.html
+++ b/www/templates/moment.html
@@ -29,10 +29,11 @@
 
     <div ng-if="areImagesLoading" class="screen-note">&nbsp;{{ 'kArrangingImages' | translate }}...&nbsp;</div>
 
-    <div ng-if="!areImagesLoading &&  !isMaxScoreFramePresent" class="screen-note">&nbsp;{{ 'kApiUpgrade' | translate }}&nbsp;</div>
+    <div ng-if="!areImagesLoading &&  !isMaxScoreFramePresent" class="screen-note">&nbsp;{{ 'kApiUpgrade' | translate
+      }}&nbsp;</div>
 
     <div ng-if="isSubMenu">
-      <br/>
+      <br />
       <div id="flyoutmenu" style="float:left">
         <ul>
           <li>
@@ -88,7 +89,7 @@
       </div>
 
       <div style="clear: both;"></div>
-      <br/>
+      <br />
     </div>
 
 
@@ -105,8 +106,7 @@
             <button class="button button-small button-icon icon  {{moment.Event.icon}}" ng-click="toggleCollapse(moment.Event.MonitorId, moment.Event.Id)"></button>{{moment.Event.collapseCount}}&nbsp;</span>
         </figcaption>
         <img image-spinner-src="{{constructFrame(moment)}}" img-spinner-w="{{moment.Event.width}}" img-spinner-h="{{moment.Event.height}}"
-          image-spinner-loader="lines" on-tap="playEvent(moment)"
-        />
+          image-spinner-loader="lines" on-tap="playEvent(moment)" />
 
         <div ng-if="showIcons" class="normal-subfigcaption">
           <button ng-class="moment.Event.pinned?  'button button-small button-icon icon ion-ios-flag assertive': 'button button-small button-icon icon ion-pin'"
diff --git a/www/templates/monitors-modal.html b/www/templates/monitors-modal.html
index 0b6ec69c..f039780a 100644
--- a/www/templates/monitors-modal.html
+++ b/www/templates/monitors-modal.html
@@ -3,8 +3,8 @@
     <ion-content ng-cloak on-double-tap="closeModal();" scroll="false">
 
       <div id="imagecontainer">
-        <ion-scroll ng-if="!isZoneEdit" on-scroll="checkZoom()" delegate-handle="imgscroll" has-bouncing=false min-zoom=1 zooming="true"
-          direction="xy" style="width: 100%;" overflow-scroll="false">
+        <ion-scroll ng-if="!isZoneEdit" on-scroll="checkZoom()" delegate-handle="imgscroll" has-bouncing=false min-zoom=1
+          zooming="true" direction="xy" style="width: 100%;" overflow-scroll="false">
           <!-- android needs this 100vh - otherwise max- does not work -->
           <!--  -->
           <div id="monitorimage" style="height: 100vh;" class="main">
@@ -13,17 +13,18 @@
 
                 <!--<span style="color:white">{{currentStreamMode}}</span>-->
 
-                <img id="singlemonitor" style="width:100vw; height:100vh;" image-spinner-loader="lines" image-spinner-src="{{constructSingleStream()}}"
-                  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();" imageonload="imageLoaded()" />
+                <img id="singlemonitor" style="width:100vw; height:100vh;" image-spinner-loader="lines"
+                  image-spinner-src="{{constructSingleStream()}}" 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();"
+                  imageonload="imageLoaded()" />
               </div>
               <div ng-if="animationInProgress">
                 <img style="width:100vw; height:100vh" ng-src="img/pausevideo.png" class="object-fit_contain" />
               </div>
             </div>
             <div ng-if="$root.authSession=='undefined'">
-              <img id="singlemonitor" ng-src="img/pausevideo.png" style="width:100vw; height:100vh; display:block;" class="object-fit_contain"
-                width="{{((devWidth)/(7-monitorSize[$index]))}}px;" />
+              <img id="singlemonitor" ng-src="img/pausevideo.png" style="width:100vw; height:100vh; display:block;"
+                class="object-fit_contain" width="{{((devWidth)/(7-monitorSize[$index]))}}px;" />
             </div>
           </div>
         </ion-scroll>
@@ -32,8 +33,8 @@
 
 
         <!-- egads, ion-scroll is a bind-on-start directive, so I have to repeat this thanks to zooming = false. Must be a better way -->
-        <ion-scroll ng-if="isZoneEdit" delegate-handle="imgscroll" has-bouncing=false min-zoom=1 zooming="false" direction="xy" style="width: 100%;"
-          overflow-scroll="false">
+        <ion-scroll ng-if="isZoneEdit" delegate-handle="imgscroll" has-bouncing=false min-zoom=1 zooming="false"
+          direction="xy" style="width: 100%;" overflow-scroll="false">
           <!-- android needs this 100vh - otherwise max- does not work -->
           <!--  -->
           <div id="monitorimage" style="height: 100vh;" class="main">
@@ -41,31 +42,35 @@
               <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="{{constructSingleStream()}}"
-                  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();" imageonload="imageLoaded()" />
+                <img id="singlemonitor" style="width:100vw; height:100vh;" image-spinner-loader="lines"
+                  image-spinner-src="{{constructSingleStream()}}" 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();"
+                  imageonload="imageLoaded()" />
               </div>
               <div ng-if="animationInProgress || isBackground()">
                 <img style="width:100vw; height:100vh" ng-src="img/pausevideo.png" class="object-fit_contain" />
               </div>
             </div>
             <div ng-if="$root.authSession=='undefined'">
-              <img id="singlemonitor" ng-src="img/pausevideo.png" style="width:100vw; height:100vh; display:block;" class="object-fit_contain"
-                width="{{((devWidth)/(7-monitorSize[$index]))}}px;" />
+              <img id="singlemonitor" ng-src="img/pausevideo.png" style="width:100vw; height:100vh; display:block;"
+                class="object-fit_contain" width="{{((devWidth)/(7-monitorSize[$index]))}}px;" />
             </div>
           </div>
         </ion-scroll>
 
         <!-- zone overlays if enabled -->
         <div ng-show="showZones">
-          <svg id="zsvg" width="100vw" height="100vh" class="zonelayer" ng-attr-view_box="0 0 {{cw}} {{ch}}" ng-attr-preserve_aspect_ratio="{{aspectFit}}"
-            on-swipe-left="onSwipe(monitorId,1)" on-swipe-right="onSwipe(monitorId,-1)" on-double-tap="closeModal();">
+          <svg id="zsvg" width="100vw" height="100vh" class="zonelayer" ng-attr-view_box="0 0 {{cw}} {{ch}}"
+            ng-attr-preserve_aspect_ratio="{{aspectFit}}" on-swipe-left="onSwipe(monitorId,1)" on-swipe-right="onSwipe(monitorId,-1)"
+            on-double-tap="closeModal();">
 
             <polygon ng-repeat="item in zoneArray track by $index" ng-class="{'object-fit_cover {{item.type}}':imageFit==false, 'object-fit_contain {{item.type}}':imageFit==true}"
-              ng-attr-points="{{item.coords}}" /> </polygon>
+              ng-attr-points="{{item.coords}}" />
+            </polygon>
 
 
-            <circle id="circle-{{$index}}" ng-show="isZoneEdit" ng-repeat="item in circlePoints track by $index" class="zonepoint" ng-class="{'object-fit_cover {{item.type}}':imageFit==false, 'object-fit_contain {{item.type}}':imageFit==true}"
+            <circle id="circle-{{$index}}" ng-show="isZoneEdit" ng-repeat="item in circlePoints track by $index" class="zonepoint"
+              ng-class="{'object-fit_cover {{item.type}}':imageFit==false, 'object-fit_contain {{item.type}}':imageFit==true}"
               ng-attr-cx="{{item.x}}" ng-attr-cy="{{item.y}}" ng-attr-r="{{csize}}" />
 
 
@@ -89,8 +94,8 @@
           </div>
         </ion-scroll>
 
-        <button ng-if="!ptzButtonsShown" class="button {{ptzPresets[0].icon}} button-small {{ptzPresets[0].style}}" style="float:left;margin-right:10px;margin-bottom:10px;"
-          ng-click="controlPTZ(monitorId, ptzPresets[0].cmd);">{{ptzPresets[0].name}}</button>
+        <button ng-if="!ptzButtonsShown" class="button {{ptzPresets[0].icon}} button-small {{ptzPresets[0].style}}"
+          style="float:left;margin-right:10px;margin-bottom:10px;" ng-click="controlPTZ(monitorId, ptzPresets[0].cmd);">{{ptzPresets[0].name}}</button>
 
 
       </div>
@@ -100,23 +105,24 @@
           <a class="button button-small icon ion-search button-positive" href="" ng-click="controlPTZ(monitorId, zoomOutCommand);">-</a>
           <a class="button button-small icon ion-search button-positive" href="" ng-click="controlPTZ(monitorId, zoomStopCommand);">x</a>
         </div>
-        <br/>
+        <br />
         <a class="button button-small icon ion-stop  button-assertive" href="" ng-click="controlPTZ(monitorId, ptzStopCommand);"></a>
         <a class="button button-small button-royal" href="" ng-click="togglePresets();">{{controlToggle}}</a>
       </div>
     </div>
   </ion-modal-view>
-  <nav mfb-menu position="tr" effect="zoomin" label="{{'kCollapse' | translate}}" active-icon="ion-chevron-up" resting-icon="ion-chevron-down"
-    toggling-method="click">
-    <button mfb-button icon="ion-arrow-resize" label="{{imageFit? ('kFillScreen' | translate):('kFitScreen' | translate)}}" ng-click="scaleImage();">
+  <nav mfb-menu position="tr" effect="zoomin" label="{{'kCollapse' | translate}}" active-icon="ion-chevron-up"
+    resting-icon="ion-chevron-down" toggling-method="click">
+    <button mfb-button icon="ion-arrow-resize" label="{{imageFit? ('kFillScreen' | translate):('kFitScreen' | translate)}}"
+      ng-click="scaleImage();">
     </button>
     <button mfb-button icon="ion-refresh" label="{{'kRefresh' | translate}}" ng-click="reloadView();">
     </button>
     <button mfb-button icon="ion-arrow-expand" label="{{'kControl'| translate}}" ng-click="togglePTZ();">
     </button>
   </nav>
-  <nav mfb-menu position="br" effect="zoomin" label="{{'kCollapse' | translate}}" active-icon="ion-chevron-down" resting-icon="ion-chevron-up"
-    toggling-method="click">
+  <nav mfb-menu position="br" effect="zoomin" label="{{'kCollapse' | translate}}" active-icon="ion-chevron-down"
+    resting-icon="ion-chevron-up" toggling-method="click">
     <button mfb-button icon="ion-android-arrow-back" label="{{'kPrevMonitor' | translate}} " ng-click="onTap(monitorId,-1);">
     </button>
     <button mfb-button icon="ion-android-arrow-forward" label="{{'kNextMonitor' | translate}}" ng-click="onTap(monitorId,1);">
diff --git a/www/templates/monitors.html b/www/templates/monitors.html
index 6f37a6d3..fbd1ce26 100644
--- a/www/templates/monitors.html
+++ b/www/templates/monitors.html
@@ -1,6 +1,6 @@
 <ion-view view-title="{{'kMonitors' | translate}}" cache-view="false">
   <ion-nav-buttons side="left">
-    <button  id="monitors-move-2" class="button button-icon button-clear ion-navicon" ng-click="openMenu()">
+    <button id="monitors-move-2" 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>
@@ -9,9 +9,10 @@
     <ion-refresher pulling-text="Pull to reload Monitors..." spinner="bubbles" on-refresh="doRefresh()">
     </ion-refresher>
     <div style="float:right;margin-top:3px;margin-right:8px;">
-      <a id="monitors-move-2" class="button button-small icon icon-left icon ion-ios-world-outline" href="" ng-click="changeConfig('All', '','1','Monitor');">{{'kGlobalConfiguration' | translate}}</a>
+      <a id="monitors-move-2" class="button button-small icon icon-left icon ion-ios-world-outline" href="" ng-click="changeConfig('All', '','1','Monitor');">{{'kGlobalConfiguration'
+        | translate}}</a>
     </div>
-    <br/>
+    <br />
     <div class="list card" ng-repeat="monitor in monitors">
       <div class="item" ng-style="{'background-color': monitor.Monitor.Enabled=='1'?'white':'white'}">
         <div ng-if="monitor.Monitor.Enabled == '1'">
@@ -40,20 +41,22 @@
           </span>
         </div>
         <p>{{'kMode' | translate}} :{{monitor.Monitor.Function}}
-          <br/> {{'kResolution' | translate}}: {{monitor.Monitor.Width}}*{{monitor.Monitor.Height}}
-          <br/> {{'kMaxFPS' | translate}}: {{monitor.Monitor.MaxFPS}}
-          <br/> {{'kAlarmMaxFPS' | translate}}:{{monitor.Monitor.AlarmMaxFPS}}
-          <br/> {{'kAlarmFrameCount' |translate}}: {{monitor.Monitor.AlarmFrameCount}}
-          <br/> {{'kStatus' | translate}}: {{monitor.Monitor.isRunningText}}
-          <br/> {{'kId' | translate}}: {{monitor.Monitor.Id}}
-          <br/> {{'kEventRecording' | translate}}: {{(monitor.Monitor.VideoWriter>0?'kVideo':'kImages') | translate}}
-          <br/>
-          <br/>
+          <br /> {{'kResolution' | translate}}: {{monitor.Monitor.Width}}*{{monitor.Monitor.Height}}
+          <br /> {{'kMaxFPS' | translate}}: {{monitor.Monitor.MaxFPS}}
+          <br /> {{'kAlarmMaxFPS' | translate}}:{{monitor.Monitor.AlarmMaxFPS}}
+          <br /> {{'kAlarmFrameCount' |translate}}: {{monitor.Monitor.AlarmFrameCount}}
+          <br /> {{'kStatus' | translate}}: {{monitor.Monitor.isRunningText}}
+          <br /> {{'kId' | translate}}: {{monitor.Monitor.Id}}
+          <br /> {{'kEventRecording' | translate}}: {{(monitor.Monitor.VideoWriter>0?'kVideo':'kImages') | translate}}
+          <br />
+          <br />
         </p>
         <div style="float:right;">
-          <a class="button button-small icon icon-left icon ion-gear-a" href="" ng-click="changeConfig(monitor.Monitor.Name, monitor.Monitor.Id,monitor.Monitor.Enabled,monitor.Monitor.Function);">{{'kConfiguration' | translate}}</a>
+          <a class="button button-small icon icon-left icon ion-gear-a" href="" ng-click="changeConfig(monitor.Monitor.Name, monitor.Monitor.Id,monitor.Monitor.Enabled,monitor.Monitor.Function);">{{'kConfiguration'
+            | translate}}</a>
           <a class="button button-small icon icon-left ion-calendar" href="#/app/events/{{monitor.Monitor.Id}}/false">{{'kEventsCap'|translate}}</a>
-          <a  class="button button-small icon icon-left ion-ios-eye" ng-click="openModal(monitor.Monitor.Id, monitor.Monitor.Controllable, monitor.Monitor.ControlId, monitor.Monitor.connKey,  monitor)">{{'kLiveView' | translate}} </a>
+          <a class="button button-small icon icon-left ion-ios-eye" ng-click="openModal(monitor.Monitor.Id, monitor.Monitor.Controllable, monitor.Monitor.ControlId, monitor.Monitor.connKey,  monitor)">{{'kLiveView'
+            | translate}} </a>
         </div>
       </div>
     </div>
diff --git a/www/templates/montage-history.html b/www/templates/montage-history.html
index 742aeccc..6f67ad7f 100644
--- a/www/templates/montage-history.html
+++ b/www/templates/montage-history.html
@@ -12,8 +12,10 @@
     <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-content has-bouncing="false" style="background-color:#444444" delegate-handle="none" overflow-scroll="false" mouse-wheel-scroll>
-    <div class="timeline_text"> {{'kFrom' | translate}}:{{prettifyDateTimeFirst(datetimeValueFrom.value)}} ({{humanizeTime(datetimeValueFrom.value)}})
+  <ion-content has-bouncing="false" style="background-color:#444444" delegate-handle="none" overflow-scroll="false"
+    mouse-wheel-scroll>
+    <div class="timeline_text"> {{'kFrom' | translate}}:{{prettifyDateTimeFirst(datetimeValueFrom.value)}}
+      ({{humanizeTime(datetimeValueFrom.value)}})
       <div ng-if="!isMultiPort">({{'kChromeMax' | translate}})</div>
     </div>
     <div ng-if="isScreenReady" class="grid" id="mygrid">
@@ -23,13 +25,13 @@
 
 
         <div ng-if="monitor.Monitor.eventUrl != 'img/noevent.png' && monitor.Monitor.connKey !=''">
-          <div class="grid-item grid-item-{{monitor.Monitor.gridScale}} " data-item-id="{{monitor.Monitor.Id}}" data-item-size="{{monitor.Monitor.gridScale}}"
-            data-item-listdisplay="{{monitor.Monitor.listDisplay}}">
+          <div class="grid-item grid-item-{{monitor.Monitor.gridScale}} " data-item-id="{{monitor.Monitor.Id}}"
+            data-item-size="{{monitor.Monitor.gridScale}}" data-item-listdisplay="{{monitor.Monitor.listDisplay}}">
             <figure height="{{Monitor.monitor.height}}" width="{{Monitor.monitor.width}}" class="{{dragBorder}}" ng-if=" monitor.Monitor.listDisplay!='noshow'">
-              <img class="{{monitor.Monitor.selectStyle}}" image-spinner-src="{{constructStream(monitor)}}" image-spinner-loader="lines"
-                on-tap="!isDragabillyOn?togglePause(monitor.Monitor.Id):toggleSelectItem($index)" on-swipe-left="toggleControls()"
-                on-swipe-right="toggleControls()" img-spinner-w="{{monitor.Monitor.Width}}" img-spinner-h="{{monitor.Monitor.Height}}"
-              />
+              <img class="{{monitor.Monitor.selectStyle}}" image-spinner-src="{{constructStream(monitor)}}"
+                image-spinner-loader="lines" on-tap="!isDragabillyOn?togglePause(monitor.Monitor.Id):toggleSelectItem($index)"
+                on-swipe-left="toggleControls()" on-swipe-right="toggleControls()" img-spinner-w="{{monitor.Monitor.Width}}"
+                img-spinner-h="{{monitor.Monitor.Height}}" />
               <figcaption class="normal-figcaption">
 
                 &nbsp;
@@ -42,23 +44,26 @@
                 </span> {{monitor.Monitor.Name}}&nbsp;
                 <div ng-if="sliderVal.showTimeline && $root.runMode!='lowbw'" style="white-space:nowrap;text-overflow:ellipsis;overflow:hidden;font-size:9px"
                   class="header-event-id" id="{{monitor.Monitor.Id}}-timeline">[{{monitor.Monitor.eid}}]
-                  <i class="ion-clock"></i> {{prettifyDateTimeFirst(monitor.Monitor.eventUrlTime)}} ({{humanizeTime(monitor.Monitor.eventUrlTime)}})&nbsp;
+                  <i class="ion-clock"></i> {{prettifyDateTimeFirst(monitor.Monitor.eventUrlTime)}}
+                  ({{humanizeTime(monitor.Monitor.eventUrlTime)}})&nbsp;
                 </div>
               </figcaption>
             </figure>
             <!-- wait for packery otherwise we get large ranges -->
             <div ng-show="packeryDone">
               <div class="range" style="position:absolute;top:5%;width:95%;z-index:999">
-                <input on-release="seek(monitor.Monitor.Id,monitor.Monitor.sliderProgress.progress )" type="range" min="0" max="{{monitor.Monitor.eventDuration}}"
-                  ng-model="monitor.Monitor.sliderProgress.progress">
+                <input on-release="seek(monitor.Monitor.Id,monitor.Monitor.sliderProgress.progress )" type="range" min="0"
+                  max="{{monitor.Monitor.eventDuration}}" ng-model="monitor.Monitor.sliderProgress.progress">
               </div>
               <div id="history_canvas_video">
                 <canvas style="padding-left:23px;
-                        padding-right:23px;z-index:998" id="eventchart-{{monitor.Monitor.Id}}" width="auto" height="20"></canvas>
+                        padding-right:23px;z-index:998" id="eventchart-{{monitor.Monitor.Id}}"
+                  width="auto" height="20"></canvas>
               </div>
             </div>
             <div ng-if="monitor.Monitor.seek" style="position:absolute;top:0px; left: 0px; width:100%;height:100%; background-color:rgba(0,0,0,0.3); z-index:99999">
-              <div style="position:relative;top:50%;text-align:center;color:white;background-color:rgba(0,0,0,0.5);">{{'kPleaseWait' | translate}}</div>
+              <div style="position:relative;top:50%;text-align:center;color:white;background-color:rgba(0,0,0,0.5);">{{'kPleaseWait'
+                | translate}}</div>
             </div>
           </div>
         </div>
@@ -109,7 +114,8 @@
           </div>
         </div>
         <ion-item>
-          <div ion-datetime-picker title="From" am-pm={{!loginData.use24hr}} ng-model="datetimeValueFrom.value" ng-change="dateChanged()">
+          <div ion-datetime-picker title="From" am-pm={{!loginData.use24hr}} ng-model="datetimeValueFrom.value"
+            ng-change="dateChanged()">
             <b>{{'kFrom' | translate }}: </b>{{datetimeValueFrom.value | date: timeFormat}}
           </div> ({{humanizeTime(datetimeValueFrom.value)}})
         </ion-item>
@@ -117,11 +123,11 @@
 
         <div class="row">
           <div class="col col-75">
-            <br/>
+            <br />
             <div style="width:90%;color:black;">
               <input ng-model="sliderVal.rate" type="text" id="mySlider6" slider options="slider_modal_options_rate" />
             </div>
-            <br/>
+            <br />
           </div>
           <div class="col col-25" style="background-color:#AEA8D3;text-align:center"> {{'kSpeed' | translate }} </div>
         </div>
diff --git a/www/templates/montage.html b/www/templates/montage.html
index b37e16b6..9555d0d8 100644
--- a/www/templates/montage.html
+++ b/www/templates/montage.html
@@ -1,72 +1,73 @@
 <ion-view cache-view="false" hide-nav-bar="{{minimal}}">
   <ion-nav-title>{{currentProfileName}}</ion-nav-title>
   <ion-nav-buttons side="left">
-    <button  id="montage-move-1"  class="button button-icon button-clear ion-navicon" ng-click="openMenu()"></button>
+    <button id="montage-move-1" class="button button-icon button-clear ion-navicon" ng-click="openMenu()"></button>
     &nbsp;
-    <button  class="button button-icon button-clear ion-eye" ng-click="hideUnhide();">&nbsp;
+    <button class="button button-icon button-clear ion-eye" ng-click="hideUnhide();">&nbsp;
     </button>
-    <button  id="montage-move-2" class="button button-icon button-clear ion-chevron-down" ng-click="toggleSubMenuFunction();">&nbsp;
+    <button id="montage-move-2" class="button button-icon button-clear ion-chevron-down" ng-click="toggleSubMenuFunction();">&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>
   <ion-nav-buttons side="right">
-    <span  ng-click="toggleTimeType()" class="icon montage-time">
+    <span ng-click="toggleTimeType()" class="icon montage-time">
       <i ng-class="(iconTimeNow=='server')?'icon-server':'ion-ios-location'"></i>
       {{timeNow}}&nbsp;</span>
-    <button  class="button button-icon button-clear ion-arrow-move" ng-click="dragToggle();">&nbsp;
+    <button class="button button-icon button-clear ion-arrow-move" ng-click="dragToggle();">&nbsp;
     </button>
     <!--
         <button class="button button-icon button-clear ion-monitor" ng-click="cast();">&nbsp;
         </button>
         -->
-    <button  id="montage-move-3" class="button button-icon button-clear ion-loop" ng-click="resetSizes();">&nbsp;
+    <button id="montage-move-3" class="button button-icon button-clear ion-loop" ng-click="resetSizes();">&nbsp;
     </button>
-    <button   class="button button-icon button-clear ion-android-contract" ng-click="switchMinimal()">
+    <button class="button button-icon button-clear ion-android-contract" ng-click="switchMinimal()">
     </button>
   </ion-nav-buttons>
-  <ion-content ng-cloak has-bouncing="false" style="background-color:#444444" delegate-handle="montage-delegate" overflow-scroll="false">
+  <ion-content ng-cloak has-bouncing="false" style="background-color:#444444" delegate-handle="montage-delegate"
+    overflow-scroll="false">
 
     <div ng-if="areImagesLoading" class="screen-note">&nbsp;{{ 'kArrangingImages' | translate }}...&nbsp;</div>
 
 
     <div ng-if="!minimal && toggleSubMenu">
       <!-- this is header -->
-      <br/>
+      <br />
       <div id="flyoutmenu" style="float:left">
         <ul>
           <!-- <li>
                                 <a href="" ng-click="killAllImages()"> <i class="ion-ionic"></i></a>
                             </li>-->
 
-          <li >
-            <a  id="montage-move-4" ng-click="sliderChanged(1)"  >
+          <li>
+            <a id="montage-move-4" ng-click="sliderChanged(1)">
               <i class="ion-plus-circled"></i>
             </a>
           </li>
-          <li >
-            <a   id="montage-move-5" ng-click="sliderChanged(-1)" >
+          <li>
+            <a id="montage-move-5" ng-click="sliderChanged(-1)">
               <i class="ion-minus-circled"></i>
             </a>
           </li>
-          <li  >
-            <a id="montage-move-6"   ng-click="squeezeMonitors()" >
+          <li>
+            <a id="montage-move-6" ng-click="squeezeMonitors()">
               <i class="ion-android-apps"></i>
             </a>
           </li>
 
           <li ng-style="{'background-color': isCycleOn()?'rgba(69, 170, 242,0.7)':'rgba(108, 122, 137, 0.7)'}" ng-if="!isDragabillyOn">
-            <a  ng-click="toggleCycle()">
+            <a ng-click="toggleCycle()">
               <i class="ion-android-bicycle"></i>:{{getCycleStatus()}}</a>
           </li>
 
           <li ng-if="isDragabillyOn">
-            <a  ng-click="hideMonitor(monitor.Monitor.Id)">
+            <a ng-click="hideMonitor(monitor.Monitor.Id)">
               <i class="ion-close-circled"></i>
             </a>
           </li>
           <li ng-if="isDragabillyOn">
-            <a   ng-click="toggleStamp()">
+            <a ng-click="toggleStamp()">
               <i class="ion-pin"></i>
             </a>
           </li>
@@ -99,7 +100,7 @@
       </div>
       <div style="clear: both;"></div>
 
-      <br/>
+      <br />
     </div>
     <!-- now lets draw the montage windows -->
     <div class="grid" id="mygrid">
@@ -110,8 +111,8 @@
 
 
       <span ng-repeat="monitor in MontageMonitors | onlyEnabled |limitTo: monLimit">
-        <div class="grid-item grid-item-{{monitor.Monitor.gridScale}} " data-item-id="{{monitor.Monitor.Id}}" data-item-size="{{monitor.Monitor.gridScale}}"
-          data-item-listdisplay="{{monitor.Monitor.listDisplay}} ">
+        <div class="grid-item grid-item-{{monitor.Monitor.gridScale}} " data-item-id="{{monitor.Monitor.Id}}"
+          data-item-size="{{monitor.Monitor.gridScale}}" data-item-listdisplay="{{monitor.Monitor.listDisplay}} ">
 
           <!--  <figure>
                     <iframe  width="200" height="100" src="https://news.google.com" frameborder="2" ></iframe>
@@ -123,17 +124,16 @@
             <!--<div ng-if="$root.authSession!='undefined' && !isBackground() && !areImagesLoading">-->
 
             <div ng-if="!minimal">
-              <img class="{{monitor.Monitor.selectStyle}}" id="img-{{$index}}" image-spinner-src="{{constructStream(monitor)}}" ng-click="!isDragabillyOn?openModal(monitor.Monitor.Id, monitor.Monitor.Controllable, monitor.Monitor.ControlId, monitor.Monitor.connKey,monitor):toggleSelectItem(monitor.Monitor.Id);"
-                image-spinner-loader="lines" img-spinner-w="{{monitor.Monitor.Width}}" img-spinner-h="{{monitor.Monitor.Height}}"
-              />
+              <img class="{{monitor.Monitor.selectStyle}}" id="img-{{$index}}" image-spinner-src="{{constructStream(monitor)}}"
+                ng-click="!isDragabillyOn?openModal(monitor.Monitor.Id, monitor.Monitor.Controllable, monitor.Monitor.ControlId, monitor.Monitor.connKey,monitor):toggleSelectItem(monitor.Monitor.Id);"
+                image-spinner-loader="lines" img-spinner-w="{{monitor.Monitor.Width}}" img-spinner-h="{{monitor.Monitor.Height}}" />
 
 
             </div>
 
             <div ng-if="minimal">
               <img id="img-{{$index}}" image-spinner-src="{{constructStream(monitor)}}" ng-click="!isDragabillyOn?openModal(monitor.Monitor.Id, monitor.Monitor.Controllable, monitor.Monitor.ControlId, monitor.Monitor.connKey,monitor):toggleSelectItem(monitor.Monitor.Id);"
-                image-spinner-loader="lines" img-spinner-w="{{monitor.Monitor.Width}}" img-spinner-h="{{monitor.Monitor.Height}}"
-              />
+                image-spinner-loader="lines" img-spinner-w="{{monitor.Monitor.Width}}" img-spinner-h="{{monitor.Monitor.Height}}" />
             </div>
 
 
@@ -162,8 +162,8 @@
     {{ 'kLowBWDisplay' | translate }}
   </div>
   <div ng-show="minimal">
-    <nav mfb-menu position="br" effect="zoomin" label="{{'kCollapse' | translate}}" active-icon="ion-chevron-down" resting-icon="ion-chevron-up"
-      toggling-method="click">
+    <nav mfb-menu position="br" effect="zoomin" label="{{'kCollapse' | translate}}" active-icon="ion-chevron-down"
+      resting-icon="ion-chevron-up" toggling-method="click">
       <button mfb-button icon="ion-arrow-expand" label="{{'kIncreaseSize' | translate}}" ng-click="sliderChanged(1)">
       </button>
       <button mfb-button icon="ion-arrow-shrink" label="{{'kDecreaseSize' | translate}}" ng-click="sliderChanged(-1)">
@@ -178,5 +178,5 @@
         ng-click="handleAlarmsWhileMinimized();" ng-if="$root.isAlarm"></a>
     </span>
   </div>
-  <br/>
+  <br />
 </ion-view>
diff --git a/www/templates/refresh.html b/www/templates/refresh.html
index d9081ffa..42f0fc19 100644
--- a/www/templates/refresh.html
+++ b/www/templates/refresh.html
@@ -2,15 +2,15 @@
   <ion-content class="pin-background">
     <div style="margin-left:20px; margin-right:20px">
       <center>
-        <br/>
-        <br/>
-        <br/>
+        <br />
+        <br />
+        <br />
         <span style="color:white">
           <h4 style="color:rgb(156, 156, 156)">{{'kLoading' | translate}}</h2>
 
 
         </span>
-        <br/>
+        <br />
       </center>
     </div>
   </ion-content>
diff --git a/www/templates/state.html b/www/templates/state.html
index dd672e7a..f5bff536 100644
--- a/www/templates/state.html
+++ b/www/templates/state.html
@@ -35,16 +35,19 @@
           </div>
         </div>
       </ion-item>
-      
+
       <ion-item>
 
         <div>
           <div class="row">
             <div class="col text-center">
               <a class="button button-small button-outline button-dark " ng-click="selectCustomState();" href="">{{'kChangeState'|translate}}</a>
-              <a class="button  button-small button-outline button-dark " ng-click="controlZM('restart');" href="">{{'kRestart' | translate}}</a>
-              <a class="button  button-small button-outline  button-dark" href="" ng-click="controlZM('stop');">{{'kStop' | translate}}</a>
-              <a class="button  button-small button-outline button-dark" ng-click="controlZM('start');" href="">{{'kStart' | translate}}</a>
+              <a class="button  button-small button-outline button-dark " ng-click="controlZM('restart');" href="">{{'kRestart'
+                | translate}}</a>
+              <a class="button  button-small button-outline  button-dark" href="" ng-click="controlZM('stop');">{{'kStop'
+                | translate}}</a>
+              <a class="button  button-small button-outline button-dark" ng-click="controlZM('start');" href="">{{'kStart'
+                | translate}}</a>
             </div>
           </div>
         </div>
diff --git a/www/templates/timeline-modal.html b/www/templates/timeline-modal.html
index 64b854ff..3ae0aba7 100644
--- a/www/templates/timeline-modal.html
+++ b/www/templates/timeline-modal.html
@@ -2,7 +2,7 @@
 <ion-modal-view cache-view="false">
   <ion-content ng-cloak on-double-tap="closeModal()" delegate-handle="timeline-modal-delegate">
     <div ng-controller="TimelineModalCtrl">
-      <br/>
+      <br />
       <div class="item item-divider">{{mName}}&nbsp;
         <i class="ion-arrow-right-b"></i>&nbsp;{{'kEvent' | translate}}:{{eid}} ({{humanizeTime}})
         <button class="button icon-left button-small  button-positive" style="float:right; opacity:0.7" ng-click="switchType()">
@@ -41,8 +41,8 @@
 
   </ion-content>
 
-  <nav mfb-menu position="br" effect="zoomin" label="{{'kCollapse'|translate}}" active-icon="ion-chevron-down" resting-icon="ion-chevron-up"
-    toggling-method="click">
+  <nav mfb-menu position="br" effect="zoomin" label="{{'kCollapse'|translate}}" active-icon="ion-chevron-down"
+    resting-icon="ion-chevron-up" toggling-method="click">
     <a mfb-button icon="ion-close" label="{{'kExit' | translate}}" ng-click="closeModal()"> </a>
 
   </nav>
diff --git a/www/templates/timeline-popover.html b/www/templates/timeline-popover.html
index b1bd802e..a16abe93 100644
--- a/www/templates/timeline-popover.html
+++ b/www/templates/timeline-popover.html
@@ -4,8 +4,10 @@
     <div class="list" ng-click="popover.hide()">
 
 
-      <a class="item" ng-href="" ng-click="popover.hide();toggleMinAlarmFrameCount();" ng-if="loginData.enableAlarmCount">{{'kShowAllEvents' | translate}}</a>
-      <a class="item" ng-href="" ng-click="popover.hide();toggleMinAlarmFrameCount();" ng-if="!loginData.enableAlarmCount"> {{'kShowAlarmedEvents' | translate}}</a>
+      <a class="item" ng-href="" ng-click="popover.hide();toggleMinAlarmFrameCount();" ng-if="loginData.enableAlarmCount">{{'kShowAllEvents'
+        | translate}}</a>
+      <a class="item" ng-href="" ng-click="popover.hide();toggleMinAlarmFrameCount();" ng-if="!loginData.enableAlarmCount">
+        {{'kShowAlarmedEvents' | translate}}</a>
       <a class="item" ng-href="" ng-click="popover.hide();buttonClicked(0);">{{'kMonth' | translate}}</a>
       <a class="item" ng-href="" ng-click=" popover.hide();buttonClicked(1);">
         {{'kWeek' | translate}}
diff --git a/www/templates/timeline.html b/www/templates/timeline.html
index 34847eea..b7a4d4b0 100644
--- a/www/templates/timeline.html
+++ b/www/templates/timeline.html
@@ -19,14 +19,15 @@
     <!--<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)}} &nbsp;{{tzAbbr}}&nbsp; ({{'kTimelineOnlyDisplaying1' | translate:translationData}})
+        {{prettify(fromDate)}} - {{prettify(toDate)}} &nbsp;{{tzAbbr}}&nbsp; ({{'kTimelineOnlyDisplaying1' |
+        translate:translationData}})
         <strong>
-          <br/>{{timelineControls}}</strong>
+          <br />{{timelineControls}}</strong>
       </div>
       <ion-spinner icon="spiral" style="position:absolute; top:50%;left:50%" ng-if="!graphLoaded"></ion-spinner>
       <div ng-if="!graphLoaded">
-        <br/>
-        <br/>
+        <br />
+        <br />
         <center>
           <p>{{'kWorkingOnGraph' | translate}}...</p>
         </center>
@@ -35,7 +36,7 @@
         <div id="visualization" data-tap-disabled="true">
         </div>
       </div>
-      <br/>
+      <br />
       <div style="padding-left:15px; font-size:10px; color:grey">
 
         <button ng-click="toggleTap()" class="button button-small button-dark">
diff --git a/www/templates/wizard.html b/www/templates/wizard.html
index c7b3694b..84b7dba7 100644
--- a/www/templates/wizard.html
+++ b/www/templates/wizard.html
@@ -7,7 +7,8 @@
       <!-- portal url -->
       <wz-step wz-title="1" canexit="exitPortal">
         <h4>
-          <i id="transition-delay" class="animated swing ion-wand" style="font-size:2em"></i> {{'kWelcomeWizard' | translate}}</h4>
+          <i id="transition-delay" class="animated swing ion-wand" style="font-size:2em"></i> {{'kWelcomeWizard' |
+          translate}}</h4>
         <img src="img/wizard.svg" width="100px" style="float:left" />
         <p>{{'kWizConfigPain' | translate}}</p>
         <h4>{{'kWizPortalUrl' | translate}}</h4>
@@ -19,10 +20,10 @@
         <a class="button icon-left ion-information-circled button-clear button-dark" ng-click="toggleTip()">{{wizard.tiptext}}</a>
         <div class="wizardtip" ng-show="wizard.tipshow">
           <b>{{'kWizTip' | translate}}: </b>{{'kWizPortalTip' | translate}}
-          <br/>
+          <br />
           <img src="img/portalurl.png" width="30%">
         </div>
-        <br/>
+        <br />
         <button class="button button-small icon icon-right ion-chevron-right" wz-next>{{'kNext' | translate}}</button>
       </wz-step>
       <!-- auth mode -->
@@ -30,12 +31,15 @@
         <h4>{{'kWizPortalAuth' | translate}}</h4>
         <!--<img src="img/wizard.svg" width="100px" style="float:left"/>-->
         <p>{{'kWizPortalText' | translate}}</p>
-        <ion-toggle ng-change="toggleAuth()" ng-model="wizard.useauth" toggle-class="toggle-calm">{{'kWizUseAuth' | translate}}</ion-toggle>
-        <ion-toggle ng-show="wizard.useauth" ng-model="wizard.usezmauth" toggle-class="toggle-calm">{{'kWizZMAuth' | translate}}</ion-toggle>
+        <ion-toggle ng-change="toggleAuth()" ng-model="wizard.useauth" toggle-class="toggle-calm">{{'kWizUseAuth' |
+          translate}}</ion-toggle>
+        <ion-toggle ng-show="wizard.useauth" ng-model="wizard.usezmauth" toggle-class="toggle-calm">{{'kWizZMAuth' |
+          translate}}</ion-toggle>
         <div ng-if="wizard.usezmauth">
           <label class="item item-input item-floating-label">
             <span class="input-label">{{'kUserName' | translate}}</span>
-            <input autocorrect="off" autocapitalize="none" autocomplete="off" type="text" ng-model="wizard.zmuser" placeholder="{{'kPlaceHolderZMAuthUser'|translate}}">
+            <input autocorrect="off" autocapitalize="none" autocomplete="off" type="text" ng-model="wizard.zmuser"
+              placeholder="{{'kPlaceHolderZMAuthUser'|translate}}">
           </label>
           <label class="item item-text-wrap item-input item-floating-label">
             <span class="input-label">{{'kPassword' | translate}}</span>
@@ -43,13 +47,15 @@
             <!--<p >{{'kWizPasswdNote' | translate}}</p>-->
           </label>
         </div>
-        <ion-toggle ng-show="wizard.useauth" ng-model="wizard.usebasicauth" toggle-class="toggle-calm">{{'kWizBasicAuth' | translate}}
+        <ion-toggle ng-show="wizard.useauth" ng-model="wizard.usebasicauth" toggle-class="toggle-calm">{{'kWizBasicAuth'
+          | translate}}
           <p ng-show="wizard.usebasicauth">{{'kWarningBasicAuth'|translate}}</p>
         </ion-toggle>
 
         <label class="item item-input item-floating-label" ng-show="wizard.usebasicauth">
           <span class="input-label">{{'kUserName' | translate}}</span>
-          <input autocorrect="off" autocapitalize="none" autocomplete="off" type="text" ng-model="wizard.basicuser" placeholder="{{'kPlaceHolderBasicAuthUser'|translate}}">
+          <input autocorrect="off" autocapitalize="none" autocomplete="off" type="text" ng-model="wizard.basicuser"
+            placeholder="{{'kPlaceHolderBasicAuthUser'|translate}}">
         </label>
         <label class="item item-input item-text-wrap item-floating-label" ng-show="wizard.usebasicauth">
           <span class="input-label">{{'kPassword' | translate}}</span>
@@ -60,29 +66,30 @@
         <a class="button icon-left ion-information-circled button-clear button-dark" ng-click="toggleTip()">{{wizard.tiptext}}</a>
         <div class="wizardtip" ng-show="wizard.tipshow">
           <b>{{'kWizTip'| translate}} </b> {{'kWizAuthText1' | translate}}
-          <br/> {{'kWizAuthText2' | translate}}
+          <br /> {{'kWizAuthText2' | translate}}
         </div>
-        <br/>
+        <br />
         <button class="button button-small icon icon-left ion-chevron-left" wz-previous>{{'kPrev' | translate}}</button>
-        <button class="button button-small icon icon-right ion-chevron-right" ng-click="exitAuth()">{{'kNext' | translate}}</button>
+        <button class="button button-small icon icon-right ion-chevron-right" ng-click="exitAuth()">{{'kNext' |
+          translate}}</button>
       </wz-step>
       <wz-step wz-title="3">
-        <br/>
-        <br/>
+        <br />
+        <br />
         <h4>{{'kWizResults' | translate}}</h4>
         <span ng-if="wizard.portalValidText" ng-style="{'color':wizard.portalColor}">
           <i ng-class="wizard.portalColor=='#16a085' ? 'ion-checkmark-circled':'ion-close-circled'"></i>&nbsp;{{wizard.portalValidText}}
-          <br/>
+          <br />
         </span>
         <span ng-if="wizard.apiValidText" ng-style="{'color':wizard.apiColor}">
           <i ng-class=" wizard.apiColor=='#16a085' ? 'ion-checkmark-circled':'ion-close-circled'"></i>&nbsp;{{wizard.apiValidText}}
-          <br/>
+          <br />
         </span>
         <span ng-if="wizard.streamingValidText" ng-style="{'color':wizard.streamingColor}">
           <i ng-class="wizard.streamingColor=='#16a085' ? 'ion-checkmark-circled':'ion-close-circled'"></i>&nbsp;{{wizard.streamingValidText}}
-          <br/>
+          <br />
         </span>
-        <br/>
+        <br />
         <div class="wizardtip">
           {{'kWizNextStep1' | translate}}:
           <ul class="wiz-list">
@@ -90,10 +97,11 @@
             <li>{{'kWizNextStep3' | translate}}</li>
           </ul>
         </div>
-        <br/>
-        <br/>
+        <br />
+        <br />
         <button class="button button-small icon icon-left ion-chevron-left" wz-previous>{{'kPrev' | translate}}</button>
-        <button class="button button-small icon icon-right ion-chevron-right" ng-click="gotoLoginState()">{{'kWizGotoLogin' | translate}}</button>
+        <button class="button button-small icon icon-right ion-chevron-right" ng-click="gotoLoginState()">{{'kWizGotoLogin'
+          | translate}}</button>
       </wz-step>
     </wizard>
   </ion-content>
diff --git a/www/templates/zm-portal-login.html b/www/templates/zm-portal-login.html
index 903ae7c6..c3431cd4 100644
--- a/www/templates/zm-portal-login.html
+++ b/www/templates/zm-portal-login.html
@@ -2,8 +2,8 @@
   <ion-content class="pin-background" scroll="false">
     <div style="margin-left:20px; margin-right:20px">
       <center>
-        <br/>
-        <br/>
+        <br />
+        <br />
         <div id="responsive-image">
           <img src="img/authlogo.png">
         </div>
@@ -12,15 +12,15 @@
           <div class="pinCode">
             <input id="pin-box" type="number" pattern="[0-9]*" ng-model="pindata.pin" ng-keyup="pinChange()" />
           </div>
-          <br/>
+          <br />
           <span style="color:white">{{pindata.status}}</span>
-          <br/>
+          <br />
           <button class="button  button-dark icon ion-unlocked" ng-click="unlock()"> Unlock
           </button>
         </div>
         <div id="really-your-fault" class="animated fadeIn" style="color:white">{{'kPortalNotice' | translate}}
-          <br/>
-          <br/>{{'kPortalNoticeSub' | translate}}</div>
+          <br />
+          <br />{{'kPortalNoticeSub' | translate}}</div>
       </center>
     </div>
   </ion-content>
-- 
cgit v1.2.3