slideshow changed to not proceed till image fully loads

4 files changed, 45 insertions, 5 deletions

diff --git a/www/js/EventCtrl.js b/www/js/EventCtrl.js
index 2371983d..9df6ac7b 100644
--- a/www/js/EventCtrl.js
+++ b/www/js/EventCtrl.js
@@ -320,7 +320,7 @@ angular.module('zmApp.controllers')
                         if (data.event.Frame[i].Type=="Alarm")
                         {
                             //⬤
-                            console.log ("**ALARM AT " + i);
+                            //console.log ("**ALARM AT " + i);
                            $scope.slider_options.scale.push({val:i+1,label:' '});
                         }
                         else
@@ -738,6 +738,7 @@ angular.module('zmApp.controllers')
                     });
                 }
 
+
                    // now get event details to show alarm frames
                 var loginData=ZMDataModel.getLogin();
                 var myurl = loginData.apiurl+'/events/'+eid+".json";
diff --git a/www/js/app.js b/www/js/app.js
index 67844045..042db8e3 100644
--- a/www/js/app.js
+++ b/www/js/app.js
@@ -9,7 +9,8 @@ angular.module('zmApp', [
                             'ionic',
                             'tc.chartjs',
                             'zmApp.controllers',
-                            'fileLogger'
+                            'fileLogger',
+    'angular-carousel', 'angularAwesomeSlider'
                             //'angularAwesomeSlider'
                         ])
 
@@ -48,6 +49,20 @@ angular.module('zmApp', [
 
 })
 
+.factory('imageLoadingDataShare', function () {
+    var imageLoading = 0; // 0 = not loading, 1 = loading, -1 = error;
+    return {
+        'set': function (val) {
+            imageLoading = val;
+            //console.log ("** IMAGE  LOADING **"+val);
+        },
+        'get': function() {
+
+            return imageLoading;
+        }
+    };
+})
+
 //------------------------------------------------------------------
 // this directive will be load any time an image completes loading 
 // via img tags where this directive is added (I am using this in
@@ -75,8 +90,8 @@ angular.module('zmApp', [
 // This directive is adapted from https://github.com/paveisistemas/ionic-image-lazy-load
 // I've removed lazyLoad and only made it show a spinner when an image is loading
 //--------------------------------------------------------------------------------------------
-.directive('imageSpinnerSrc', ['$document',  '$compile',
-    function ($document , $compile) {
+.directive('imageSpinnerSrc', ['$document',  '$compile','imageLoadingDataShare',
+    function ($document , $compile, imageLoadingDataShare) {
         return {
             restrict: 'A',
             scope: {
@@ -88,9 +103,11 @@ angular.module('zmApp', [
                     var loader = $compile('<div class="image-loader-container"><ion-spinner style="position:fixed;top:5%;left:5%" class="image-loader" icon="' + $attributes.imageSpinnerLoader + '"></ion-spinner></div>')($scope);
                     $element.after(loader);
                 }
+                            imageLoadingDataShare.set(1);
                             loadImage();
                 $attributes.$observe('imageSpinnerSrc', function(value){
                     //console.log ("SOURCE CHANGED");
+                    imageLoadingDataShare.set(1);
                      loadImage();
                  //deregistration();
 
@@ -100,8 +117,16 @@ angular.module('zmApp', [
                     $element.bind("load", function (e) {
                         if ($attributes.imageSpinnerLoader) {
                             loader.remove();
+                            imageLoadingDataShare.set(0);
                         }
                     });
+                    //PP
+                     $element.bind('error', function(){
+                                loader.remove();
+                         imageLoadingDataShare.set(0);
+                    });
+
+
 
                     if ($scope.imageSpinnerBackgroundImage == "true") {
                         var bgImg = new Image();
diff --git a/www/js/controllers.js b/www/js/controllers.js
index 1a111d03..416549ee 100644
--- a/www/js/controllers.js
+++ b/www/js/controllers.js
@@ -4,7 +4,7 @@
 
 
 
-angular.module('zmApp.controllers', ['ionic', 'ngCordova', 'ng-mfb','angularCircularNavigation','angular-carousel', 'angularAwesomeSlider' ])
+angular.module('zmApp.controllers', ['ionic', 'ngCordova', 'ng-mfb','angularCircularNavigation' ])
 
 .controller('zmApp.BaseController', function($scope, $ionicSideMenuDelegate, $ionicPlatform, $timeout, $rootScope) {
   $scope.openMenu = function () {
diff --git a/www/js/ng.js b/www/js/ng.js
new file mode 100644
index 00000000..d99945b1
--- /dev/null
+++ b/www/js/ng.js
@@ -0,0 +1,14 @@
+/*angular.module("ng")
+.factory('imageLoadingDataShare', function () {
+    var imageLoading = 1; // 1 = loading, -1 = error;
+    return {
+        'set': function (val) {
+            imageLoading = val;
+        },
+        'get': function() {
+            return imageLoading;
+        }
+    };
+
+
+});*/