From 764e0641825812caaa07b2b98b862ff2dff95c75 Mon Sep 17 00:00:00 2001
From: Arjun Roychowdhury <pliablepixels@gmail.com>
Date: Wed, 4 Nov 2015 10:29:41 -0500
Subject: #49 - animated event number to show transition - animating the image
 doesn't look good as it takes time to load the image

---
 www/css/style.css               |  2 +-
 www/js/EventCtrl.js             | 17 ++++++++++++++++-
 www/templates/events-modal.html |  4 ++--
 3 files changed, 19 insertions(+), 4 deletions(-)

(limited to 'www')

diff --git a/www/css/style.css b/www/css/style.css
index 6a6d4e8c..91ce9830 100644
--- a/www/css/style.css
+++ b/www/css/style.css
@@ -539,7 +539,7 @@ input[type=range]::-webkit-slider-thumb {
 
 
 #full-screen-event {
-  -webkit-animation-duration: 500ms;
+  -webkit-animation-duration: 200ms;
   
 }
 
diff --git a/www/js/EventCtrl.js b/www/js/EventCtrl.js
index 3c150d79..df63ed16 100644
--- a/www/js/EventCtrl.js
+++ b/www/js/EventCtrl.js
@@ -1168,11 +1168,26 @@ angular.module('zmApp.controllers')
                 slidein = "animated slideInLeft";
             }
             var element = angular.element(document.getElementById("full-screen-event"));
-            element.addClass(slideout).one('webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend', function () {element.removeClass(slideout);prepareModalEvent(eid); element.addClass(slidein); });
+            element.addClass(slideout).one('webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend', outWithOld);
             
+            function outWithOld()
+            {
+                element.removeClass(slideout);
+                prepareModalEvent(eid);
+                element.addClass(slidein).one('webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend', inWithNew );
+            }
+            
+            function inWithNew()
+            {
+                element.removeClass(slidein);
+            }
 
 
         };
+        
+        
+        
+        
 
         
         //--------------------------------------------------------
diff --git a/www/templates/events-modal.html b/www/templates/events-modal.html
index 0ffd5540..46bffd06 100644
--- a/www/templates/events-modal.html
+++ b/www/templates/events-modal.html
@@ -4,7 +4,7 @@
         <ion-content style="background-color:#444444" ng-cloak>
 
             <ion-scroll has-bouncing=false min-zoom=1 zooming="true" direction="xy" style="width: 100%; ">
-                <div id="full-screen-event" style="height: 100vh;">
+                <div  style="height: 100vh;">
 
 
                     <div ng-if="defaultVideo=='' || loginData.enableh264==false">
@@ -61,7 +61,7 @@
     <a mfb-button icon="ion-close" label="exit event view" ng-click="closeModal()"> </a>
 
 </nav>
-<div class="events-range-modal-text">playing event: {{eventId}}, next:{{nextId}}, prev:{{prevId}}</div>
+<div class="events-range-modal-text" id="full-screen-event">playing event: {{eventId}}</div>
 <div class="events-range-modal" ng-if="defaultVideo==''">
 
     <div style="width:90%">
-- 
cgit v1.2.3