fixed modals to make sure images load only when user taps on view button. No sense in wasting memory. Image override directives are being called correctly. Now I need to expriment with how to overwrite image frames when ZMS is still sending data to the client to avoid the blank screen issue

3 files changed, 29 insertions, 22 deletions

diff --git a/www/js/EventCtrl.js b/www/js/EventCtrl.js
index 604458a2..283ffa39 100644
--- a/www/js/EventCtrl.js
+++ b/www/js/EventCtrl.js
@@ -44,14 +44,7 @@ angular.module('zmApp.controllers').controller('zmApp.EventCtrl', function ($ion
 
 
     // This is a modal to show the event footage
-    $ionicModal.fromTemplateUrl('templates/events-modal.html', {
-            scope: $scope,
-            animation: 'slide-in-up'
-        })
-        .then(function (modal) {
-            $scope.modal = modal;
 
-        });
 
     var eventCommands = {
         next: "13",
@@ -168,11 +161,20 @@ angular.module('zmApp.controllers').controller('zmApp.EventCtrl', function ($ion
         $scope.eventDur = Math.round(edur);
         $scope.loginData = ZMDataModel.getLogin();
         $scope.rand = Math.floor(Math.random() * (999999 - 111111 + 1)) + 111111;
-        $scope.modal.show();
+
+        $ionicModal.fromTemplateUrl('templates/events-modal.html', {
+            scope: $scope,
+            animation: 'slide-in-up'
+        })
+        .then(function (modal) {
+            $scope.modal = modal;
+             $scope.modal.show();
+        });
+
     };
     $scope.closeModal = function () {
-        console.log("Close Modal");
-        $scope.modal.hide();
+        console.log("Close & Destroy Modal");
+        $scope.modal.remove();
 
     };
     //Cleanup the modal when we're done with it!
diff --git a/www/js/MonitorCtrl.js b/www/js/MonitorCtrl.js
index 8be9bdbe..69d190d0 100644
--- a/www/js/MonitorCtrl.js
+++ b/www/js/MonitorCtrl.js
@@ -42,11 +42,21 @@ $scope.reloadView = function ()
         $scope.monitorId = mid;
         $scope.LoginData = ZMDataModel.getLogin();
         $scope.rand = Math.floor(Math.random() * (999999 - 111111 + 1)) + 111111;
-        $scope.modal.show();
+
+     // This is a modal to show the monitor footage
+    $ionicModal.fromTemplateUrl('templates/monitors-modal.html', {
+            scope: $scope,
+            animation: 'slide-in-up'
+        })
+        .then(function (modal) {
+            $scope.modal = modal;
+            $scope.modal.show();
+        });
+
     };
     $scope.closeModal = function () {
-        console.log("Close Monitor Modal");
-        $scope.modal.hide();
+        console.log("Close & Destroy Monitor Modal");
+        $scope.modal.remove();
 
     };
     //Cleanup the modal when we're done with it!
@@ -55,15 +65,7 @@ $scope.reloadView = function ()
         $scope.modal.remove();
     });
 
-// This is a modal to show the monitor footage
-    $ionicModal.fromTemplateUrl('templates/monitors-modal.html', {
-            scope: $scope,
-            animation: 'slide-in-up'
-        })
-        .then(function (modal) {
-            $scope.modal = modal;
 
-        });
 
     console.log("***EVENTS: Waiting for Monitors to load before I proceed");
 
diff --git a/www/js/app.js b/www/js/app.js
index a65d46ba..908f09bf 100644
--- a/www/js/app.js
+++ b/www/js/app.js
@@ -7,9 +7,12 @@ angular.module('zmApp', [
 
 .directive('img', function () {
     return {
-        restrict: 'E',
+        restrict: 'AE',
         link: function (scope, element, attrs) {
             console.log ("********** IMG DIRECTIVE ");
+
+           // if (!attr.ngSrc)
+               // element[0].src = 'img/demo.gif';
             // show an image-missing image
            // element.error(function () {