fix($ionicLoading): do not flicker when showing long loading messages

Closes #1252
ionic-team · May 14, 2014 · 90e7395 · 90e7395
1 parent efa6184
commit 90e7395
Show file tree

Hide file tree

Showing 3 changed files with 7 additions and 3 deletions.
diff --git a/js/angular/service/loading.js b/js/angular/service/loading.js
@@ -118,6 +118,7 @@ function($document, $ionicTemplateLoader, $ionicBackdrop, $timeout, $q, $log, $c
               ionic.DomUtil.centerElementByMarginTwice(self.element[0]);
               ionic.requestAnimationFrame(function() {
                 self.isShown && self.element.addClass('active');
+                ionic.DomUtil.centerElementByMarginTwice(self.element[0]);
               });
             }
           });

diff --git a/js/utils/dom.js b/js/utils/dom.js
@@ -204,8 +204,11 @@
     centerElementByMarginTwice: function(el) {
       ionic.requestAnimationFrame(function() {
         ionic.DomUtil.centerElementByMargin(el);
-        ionic.requestAnimationFrame(function() {
+        setTimeout(function() {
           ionic.DomUtil.centerElementByMargin(el);
+          setTimeout(function() {
+            ionic.DomUtil.centerElementByMargin(el);
+          });
         });
       });
     },

diff --git a/test/html/loading.html b/test/html/loading.html
@@ -18,9 +18,9 @@
       .controller('LoadingCtrl', function($scope, $ionicLoading) {
         $scope.startLoading = function() {
           $ionicLoading.show({
-            template: 'Getting current location...',
+            template: '<div>Connection problem.</div><br/><div>Please check your internet connection!</div>',
             delay: 100,
-            duration: 500
+            duration: 3000
           });
         };
       });