From 89b3cd56482e2548dd14400c84b177e2d8a61c42 Mon Sep 17 00:00:00 2001
From: Pliable Pixels <pliablepixels@gmail.com>
Date: Sat, 25 Nov 2017 11:32:47 -0500
Subject: updated to match new ionic sass/styling crap

---
 www/templates/events.html | 12 ++++++------
 1 file changed, 6 insertions(+), 6 deletions(-)

(limited to 'www/templates')

diff --git a/www/templates/events.html b/www/templates/events.html
index 5666ea61..92610eaf 100644
--- a/www/templates/events.html
+++ b/www/templates/events.html
@@ -98,15 +98,15 @@
                     </div>
                     <span style="float:right">
                         <div ng-if="event.Event.EndTime || 1">
-                             <button class="button button-small button-outline icon icon-left ion-stats-bars"
+                             <button class="button button-stable button-small button-outline icon icon-left ion-stats-bars"
                                             ng-click="closeIfOpen(event);analyzeEvent(event)" > 
                                              <span translate="kAnalyze"></span>
                             </button>
-                            <button class="button button-outline button-small icon icon-left ion-ios-eye" ng-click="toggleGroupScrub(event,$index,event.Event.Frames)"> <span translate="kScrub"></span>
+                            <button class="button button-stable button-outline button-small icon icon-left ion-ios-eye" ng-click="toggleGroupScrub(event,$index,event.Event.Frames)"> <span translate="kScrub"></span>
                             </button>
-                            <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)"> <span translate="kAlarms"></span>
+                            <button ng-if="event.Event.AlarmFrames > 0" class="button button-stable button-outline button-small icon icon-left ion-ios-bell" ng-click="toggleGroupAlarms(event,$index,event.Event.Frames)"> <span translate="kAlarms"></span>
                             </button>
-                            <button class="button button-outline button-small icon icon-left ion-ios-eye" ng-click="closeIfOpen(event);openModal(event)"> <span translate="kFootage"></span>
+                            <button class="button button-stable button-outline button-small icon icon-left ion-ios-eye" ng-click="closeIfOpen(event);openModal(event)"> <span translate="kFootage"></span>
                             </button>
 
                             
@@ -123,11 +123,11 @@
                     <p>
                         <!--scroll <i class="icon ion-arrow-left-c"></i> 
                                 <i class="icon ion-arrow-right-c"></i>-->
-                        <button ng-click="toggleTypeOfAlarms()" class="button button-small button-assertive button-outline">
+                        <button ng-click="toggleTypeOfAlarms()" class="button button-small button-assertive button-stable button-outline">
                             <span translate="kType"></span>:{{typeOfFrames}}
                         </button>
                         <button 
-                         ng-click="toggleMotionOutline()" class="button button-small button-assertive button-outline">
+                         ng-click="toggleMotionOutline()" class="button button-small button-assertive button-stable button-outline">
                             <span translate="kOutlineMotion"></span>:{{outlineMotion}}
                         </button>
                     </p>
-- 
cgit v1.2.3


From 5bb274adac923461f361e683b65c7acbe42df0f9 Mon Sep 17 00:00:00 2001
From: Pliable Pixels <pliablepixels@gmail.com>
Date: Thu, 7 Dec 2017 16:18:29 -0500
Subject: #91 - initial support - needs formatting

---
 www/templates/devoptions.html  | 7 +++++++
 www/templates/events.html      | 4 ++++
 www/templates/image-modal.html | 5 +++++
 3 files changed, 16 insertions(+)
 create mode 100644 www/templates/image-modal.html

(limited to 'www/templates')

diff --git a/www/templates/devoptions.html b/www/templates/devoptions.html
index db1f8887..03b7d7b8 100644
--- a/www/templates/devoptions.html
+++ b/www/templates/devoptions.html
@@ -128,6 +128,13 @@
                 </ion-toggle>
             </label>
 
+
+            <label>
+                <ion-toggle ng-model="loginData.enableThumbs" ng-checked="loginData.enableThumbs" toggle-class="toggle-calm"><span class="item-text-wrap">{{'kEnableThumbs' | translate}}
+                   </span>
+                </ion-toggle>
+            </label>
+
             <label>
                 <ion-toggle ng-model="loginData.enableSlowLoading" ng-checked="loginData.enableSlowLoading" toggle-class="toggle-calm"><span class="item-text-wrap">{{'kEnableSlowLoading' | translate}}
                    </span>
diff --git a/www/templates/events.html b/www/templates/events.html
index 92610eaf..31af018d 100644
--- a/www/templates/events.html
+++ b/www/templates/events.html
@@ -75,6 +75,10 @@
                              <button ng-if="event.Event.DefaultVideo!='' && event.Event.DefaultVideo!=undefined && $root.platformOS!='desktop' && loginData.enableGIFMP4 " class="button button-small button-clear icon mp4-icon" ng-click="downloadFileToDevice(event.Event.videoPath, event.Event.Id)"> 
                             </button>
 
+                            <!-- thumbnail -->
+                            
+                            <img ng-if="loginData.enableThumbs" style="float:right;max-width:150px; max-height:200px;" ng-src="{{event.Event.baseURL}}/index.php?view=image&fid={{event.Event.MaxScoreFrameId}}" on-tap="showThumbnail(event.Event.baseURL,event.Event.MaxScoreFrameId)" />
+
 
                             </div>
 
diff --git a/www/templates/image-modal.html b/www/templates/image-modal.html
new file mode 100644
index 00000000..2ed126c6
--- /dev/null
+++ b/www/templates/image-modal.html
@@ -0,0 +1,5 @@
+<ion-modal-view cache-view="false" style="background-color:#444444">
+<ion-content>
+  <img on-double-tap="closeModal();"  src="{{thumbnailLarge}}" style="display:block; width:100%"/>
+</ion-content>
+</ion-modal-view>
-- 
cgit v1.2.3


From bba28ae5040046886bcb35b38da4c1ac2af2002b Mon Sep 17 00:00:00 2001
From: Pliable Pixels <pliablepixels@gmail.com>
Date: Thu, 7 Dec 2017 16:25:10 -0500
Subject: formatting #91

---
 www/templates/events.html | 15 +++++++++------
 1 file changed, 9 insertions(+), 6 deletions(-)

(limited to 'www/templates')

diff --git a/www/templates/events.html b/www/templates/events.html
index 31af018d..8157d0f6 100644
--- a/www/templates/events.html
+++ b/www/templates/events.html
@@ -61,7 +61,7 @@
                             </span>
                         </div>
                         <!-- col col left-->
-                        <div class="col col-80">
+                        <div class="col">
                             <div class="item-text-wrap">
                                 
                                 <b><i ng-if="event.Event.Archived=='1'" class="ion-ios-flag" style="color:red">&nbsp;</i>{{event.Event.MonitorName}}</b> ({{event.Event.Id}}) &nbsp;
@@ -75,19 +75,22 @@
                              <button ng-if="event.Event.DefaultVideo!='' && event.Event.DefaultVideo!=undefined && $root.platformOS!='desktop' && loginData.enableGIFMP4 " class="button button-small button-clear icon mp4-icon" ng-click="downloadFileToDevice(event.Event.videoPath, event.Event.Id)"> 
                             </button>
 
-                            <!-- thumbnail -->
-                            
-                            <img ng-if="loginData.enableThumbs" style="float:right;max-width:150px; max-height:200px;" ng-src="{{event.Event.baseURL}}/index.php?view=image&fid={{event.Event.MaxScoreFrameId}}" on-tap="showThumbnail(event.Event.baseURL,event.Event.MaxScoreFrameId)" />
-
-
                             </div>
 
+
                             <i class="ion-images"></i> {{event.Event.Frames}} &nbsp;
                             <i class="ion-ios-bell-outline"></i> {{event.Event.AlarmFrames}} &nbsp;
                             <i class="ion-arrow-graph-up-right"></i> {{event.Event.TotScore}}
 
                             
                         </div>
+
+                        <div ng-if="loginData.enableThumbs" class = "col col-left">
+                            <!-- thumbnail -->
+                       
+                           <img style="max-width:150px; max-height:200px;" ng-src="{{event.Event.baseURL}}/index.php?view=image&fid={{event.Event.MaxScoreFrameId}}" on-tap="showThumbnail(event.Event.baseURL,event.Event.MaxScoreFrameId)" />
+                       
+                       </div>
                     </div>
                     <!--row-->
                     <div class="row" style="font-size:80%; color:rgb(110,110,110)">
-- 
cgit v1.2.3


From 21856d3106726668616fdf4b96e9a7b02ce69d42 Mon Sep 17 00:00:00 2001
From: Pliable Pixels <pliablepixels@gmail.com>
Date: Fri, 8 Dec 2017 20:16:51 -0500
Subject: image fade in, placeholders, doubled image size during fetch for
 resolution, w/h tweaks #91

---
 www/templates/events.html      | 15 +++++++++------
 www/templates/image-modal.html | 10 +++++++---
 2 files changed, 16 insertions(+), 9 deletions(-)

(limited to 'www/templates')

diff --git a/www/templates/events.html b/www/templates/events.html
index 8157d0f6..999c8c88 100644
--- a/www/templates/events.html
+++ b/www/templates/events.html
@@ -25,7 +25,7 @@
         <!-- lets make sure the events list is not empty as collection repeat needs height -->
         <div ng-if="!eventsBeingLoaded">
             <ion-list show-delete="eventList.showDelete">
-                <ion-item collection-repeat="event in events| filter:search.text |  eventListFilter
+                <ion-item force-refresh-images="true" collection-repeat="event in events| filter:search.text |  eventListFilter
                 " item-height="event.Event.height" id="item-{{$index}}" on-swipe-left="checkSwipe($index);">
                     <span style="float:left;margin-top:-18px;background-color:#96281B;color:#fff;font-size:11px;opacity:0.7;border-radius: 0px 0px 5px 5px;">&nbsp;&nbsp;&nbsp;<i class="ion-calendar"></i>&nbsp;&nbsp;{{prettifyTime(event.Event.StartTime)}}&nbsp;{{tzAbbr}}&nbsp;</span>&nbsp;&nbsp;
                     <span style="float:left;margin-top:-18px;background-color:#fff;color:#888;font-size:11px;opacity:1;">&nbsp;&nbsp;<i class="ion-arrow-right-b"></i>&nbsp;{{event.Event.humanizeTime}} <span ng-if="!event.Event.EndTime">(<span translate="kRecordingProgress"></span>)</span>
@@ -64,7 +64,7 @@
                         <div class="col">
                             <div class="item-text-wrap">
                                 
-                                <b><i ng-if="event.Event.Archived=='1'" class="ion-ios-flag" style="color:red">&nbsp;</i>{{event.Event.MonitorName}}</b> ({{event.Event.Id}}) &nbsp;
+                                <b><i ng-if="event.Event.Archived=='1'" class="ion-ios-flag" style="color:red">&nbsp;</i>{{event.Event.MonitorName}}</b> <span ng-if"!loginData.enableThumbs || !event.Event.MaxScore">({{event.Event.Id}})</span> &nbsp;
                                 <button ng-if="gifshotSupported && loginData.enableGIFMP4 " class="button button-small button-clear icon gif-icon" ng-click="permissionsDownload(event)"> 
                             </button>
 
@@ -72,7 +72,7 @@
 
                             <a ng-if="(event.Event.DefaultVideo!='' && event.Event.DefaultVideo!==undefined) && $root.platformOS=='desktop' && loginData.enableGIFMP4 " class="button button-clear button-small icon mp4-icon" href="{{event.Event.videoPath}}" download="{{event.Event.Id}}-video.mp4" ng-click="mp4warning()"></a>
 
-                             <button ng-if="event.Event.DefaultVideo!='' && event.Event.DefaultVideo!=undefined && $root.platformOS!='desktop' && loginData.enableGIFMP4 " class="button button-small button-clear icon mp4-icon" ng-click="downloadFileToDevice(event.Event.videoPath, event.Event.Id)"> 
+                             <button ng-if="event.Event.DefaultVideo!='' && event.Event.DefaultVideo!=undefined && $root.platformOS!='desktop' && lpoginData.enableGIFMP4 " class="button button-small button-clear icon mp4-icon" ng-click="downloadFileToDevice(event.Event.videoPath, event.Event.Id)"> 
                             </button>
 
                             </div>
@@ -80,15 +80,18 @@
 
                             <i class="ion-images"></i> {{event.Event.Frames}} &nbsp;
                             <i class="ion-ios-bell-outline"></i> {{event.Event.AlarmFrames}} &nbsp;
-                            <i class="ion-arrow-graph-up-right"></i> {{event.Event.TotScore}}
+                            <!--<i class="ion-arrow-graph-up-right"></i> {{event.Event.TotScore}}-->
 
                             
                         </div>
 
-                        <div ng-if="loginData.enableThumbs" class = "col col-left">
+                        <div ng-if="loginData.enableThumbs && event.Event.MaxScore" class = "col col-left">
                             <!-- thumbnail -->
                        
-                           <img style="max-width:150px; max-height:200px;" ng-src="{{event.Event.baseURL}}/index.php?view=image&fid={{event.Event.MaxScoreFrameId}}" on-tap="showThumbnail(event.Event.baseURL,event.Event.MaxScoreFrameId)" />
+                                    <!--  ng-image-appear transition-duration="0.5s" animation="fillIn" bg-color="#50a4e2"  -->
+                                    <img  ng-image-appear transition-duration="0.3s" animation="fillIn" bg-color="#50a4e2" width="{{event.Event.thumbWidth}}px" height="{{event.Event.thumbHeight}}px" ng-src="{{event.Event.baseURL}}/index.php?view=image&fid={{event.Event.MaxScoreFrameId}}&width={{event.Event.thumbWidth*2}}&height={{event.Event.thumbHeight*2}}" on-tap="showThumbnail(event.Event.baseURL,event.Event.MaxScoreFrameId)" />
+                                    <!--<p>{{event.Event.thumbWidth}}px*{{event.Event.thumbHeight}}px</p>-->
+                            
                        
                        </div>
                     </div>
diff --git a/www/templates/image-modal.html b/www/templates/image-modal.html
index 2ed126c6..7195bae7 100644
--- a/www/templates/image-modal.html
+++ b/www/templates/image-modal.html
@@ -1,5 +1,9 @@
 <ion-modal-view cache-view="false" style="background-color:#444444">
-<ion-content>
-  <img on-double-tap="closeModal();"  src="{{thumbnailLarge}}" style="display:block; width:100%"/>
-</ion-content>
+  <ion-content>
+    <ion-scroll direction="xy" scrollbar-x="false" scrollbar-y="false" overflow-scroll="false" zooming="true">
+      <img on-double-tap="closeModal();" src="{{thumbnailLarge}}" style="display:block; width:100%" />
+
+    </ion-scroll>
+
+  </ion-content>
 </ion-modal-view>
-- 
cgit v1.2.3


From 02b539d381517228fec72235c3b8c5a5659bd711 Mon Sep 17 00:00:00 2001
From: Pliable Pixels <pliablepixels@gmail.com>
Date: Sat, 9 Dec 2017 12:41:42 -0500
Subject: #91 rotated image fix and other typos

---
 www/templates/events.html | 9 +++++----
 1 file changed, 5 insertions(+), 4 deletions(-)

(limited to 'www/templates')

diff --git a/www/templates/events.html b/www/templates/events.html
index 999c8c88..41e5b104 100644
--- a/www/templates/events.html
+++ b/www/templates/events.html
@@ -64,7 +64,7 @@
                         <div class="col">
                             <div class="item-text-wrap">
                                 
-                                <b><i ng-if="event.Event.Archived=='1'" class="ion-ios-flag" style="color:red">&nbsp;</i>{{event.Event.MonitorName}}</b> <span ng-if"!loginData.enableThumbs || !event.Event.MaxScore">({{event.Event.Id}})</span> &nbsp;
+                                <b><i ng-if="event.Event.Archived=='1'" class="ion-ios-flag" style="color:red">&nbsp;</i>{{event.Event.MonitorName}}</b> <span ng-if="!loginData.enableThumbs &&event.Event.MaxScoreFrameId">({{event.Event.Id}})</span> &nbsp;
                                 <button ng-if="gifshotSupported && loginData.enableGIFMP4 " class="button button-small button-clear icon gif-icon" ng-click="permissionsDownload(event)"> 
                             </button>
 
@@ -85,11 +85,12 @@
                             
                         </div>
 
-                        <div ng-if="loginData.enableThumbs && event.Event.MaxScore" class = "col col-left">
+                        <div ng-if="loginData.enableThumbs && event.Event.MaxScoreFrameId" class = "col col-left" style="max-height:150px" >
                             <!-- thumbnail -->
                        
-                                    <!--  ng-image-appear transition-duration="0.5s" animation="fillIn" bg-color="#50a4e2"  -->
-                                    <img  ng-image-appear transition-duration="0.3s" animation="fillIn" bg-color="#50a4e2" width="{{event.Event.thumbWidth}}px" height="{{event.Event.thumbHeight}}px" ng-src="{{event.Event.baseURL}}/index.php?view=image&fid={{event.Event.MaxScoreFrameId}}&width={{event.Event.thumbWidth*2}}&height={{event.Event.thumbHeight*2}}" on-tap="showThumbnail(event.Event.baseURL,event.Event.MaxScoreFrameId)" />
+                                    <!--  ng-image-appear transition-duration="0.5s" animation="fillIn" bg-color="#50a4e2"  {{event.Event.thumbWidth}}X{{event.Event.thumbHeight}}-->
+                                    
+                                    <img   ng-image-appear transition-duration="0.3s" animation="fillIn" bg-color="#50a4e2" width="{{event.Event.thumbWidth}}px" height="{{event.Event.thumbHeight}}px" ng-src="{{event.Event.baseURL}}/index.php?view=image&fid={{event.Event.MaxScoreFrameId}}&width={{event.Event.thumbWidth*2}}&height={{event.Event.thumbHeight*2}}" on-tap="showThumbnail(event.Event.baseURL,event.Event.MaxScoreFrameId)" />
                                     <!--<p>{{event.Event.thumbWidth}}px*{{event.Event.thumbHeight}}px</p>-->
                             
                        
-- 
cgit v1.2.3