From b5f70373dc826a88cace41d3c604357fb23910c2 Mon Sep 17 00:00:00 2001
From: Sergi Mansilla <sergi.mansilla@gmail.com>
Date: Mon, 31 Mar 2014 12:28:57 +0200
Subject: [PATCH 1/2] Eliminate DOM modification + lots of reflow to show the
 'loading' indicator. Fix #208.

---
 app/css/app.css      | 89 +++++++++++++++++++++++++++++++++++++++++++-
 app/js/directives.js | 25 +------------
 2 files changed, 90 insertions(+), 24 deletions(-)

diff --git a/app/css/app.css b/app/css/app.css
index f183c6f2..dfa1026c 100644
--- a/app/css/app.css
+++ b/app/css/app.css
@@ -2706,4 +2706,91 @@ ce671b orange
 .modal-content-animated {
   -webkit-transition: margin-top linear 0.2s;
   transition: margin-top linear 0.2s;
-}
\ No newline at end of file
+}
+
+.loading_dots
+{
+  display: inline-block;
+  font-size: 1em; /* set size here */
+  line-height: 1;
+  padding: 0.125em 0 0.175em 0.55em;
+  width: 2.75em;
+}
+
+.loading_dots span
+{
+  border-radius: 50%;
+  display: inline-block;
+  height: 0.2rem;
+  width:  0.2rem;
+  margin-left: 0.2rem;
+
+  -webkit-animation:  loading_dots 0.8s linear infinite;
+  -moz-animation:     loading_dots 0.8s linear infinite;
+  -ms-animation:      loading_dots 0.8s linear infinite;
+  animation:          loading_dots 0.8s linear infinite;
+}
+.loading_dots span:nth-child(2)
+{
+  -webkit-animation-delay:  0.2s;
+  -moz-animation-delay:     0.2s;
+  -ms-animation-delay:      0.2s;
+  animation-delay:          0.2s;
+}
+.loading_dots span:nth-child(1)
+{
+  -webkit-animation-delay:  0.4s;
+  -moz-animation-delay:     0.4s;
+  -ms-animation-delay:      0.4s;
+  animation-delay:          0.4s;
+}
+
+@-webkit-keyframes loading_dots
+{
+  0% {
+    background: transparent;
+  }
+  50% {
+    background: #000;
+  }
+  100% {
+    background: transparent;
+  }
+}
+
+@-moz-keyframes loading_dots
+{
+  0% {
+    background: transparent;
+  }
+  50% {
+    background: #000;
+  }
+  100% {
+    background: transparent;
+  }
+}
+@-ms-keyframes loading_dots
+{
+  0% {
+    background: transparent;
+  }
+  50% {
+    background: #000;
+  }
+  100% {
+    background: transparent;
+  }
+}
+@keyframes loading_dots
+{
+  0% {
+    background: transparent;
+  }
+  50% {
+    background: #000;
+  }
+  100% {
+    background: transparent;
+  }
+}
diff --git a/app/js/directives.js b/app/js/directives.js
index a83999f4..92a0b7ff 100644
--- a/app/js/directives.js
+++ b/app/js/directives.js
@@ -875,30 +875,9 @@ angular.module('myApp.directives', ['myApp.filters'])
       link: link,
     };
 
-    var interval;
-
     function link ($scope, element, attrs) {
-      var promise = $interval(function () {
-        var time = tsNow(),
-            cnt = 3;
-
-        if (time % 1000 <= 200) {
-          cnt = 0;
-        } else if (time % 1000 <= 400) {
-          cnt = 1;
-        } else if (time % 1000 <= 600) {
-          cnt = 2;
-        }
-
-        var text = '...',
-            html = text.substr(0, cnt + 1) + (cnt < 2 ? ('<span class="text-invisible">' + text.substr(cnt + 1) + '</span>') : '');
-
-        element.html(html);
-      }, 200);
-
-      $scope.$on('$destroy', function cleanup() {
-        $interval.cancel(promise);
-      });
+      element.html('<div class="loading_dots"><span></span>' +
+                   '<span></span><span></span></div>');
     }
   })
 

From 27934bf41d92c536e418cfc05068ca1beb0e0f95 Mon Sep 17 00:00:00 2001
From: Igor Zhukov <igor.beatle@gmail.com>
Date: Tue, 1 Apr 2014 15:33:25 +0400
Subject: [PATCH 2/2] Fixed dots styles for non-black texts

---
 app/css/app.css       | 30 +++++++++++++++---------------
 app/js/lib/mtproto.js |  2 +-
 2 files changed, 16 insertions(+), 16 deletions(-)

diff --git a/app/css/app.css b/app/css/app.css
index 426af40f..9b31e2b2 100644
--- a/app/css/app.css
+++ b/app/css/app.css
@@ -2713,12 +2713,12 @@ ce671b orange
   display: inline-block;
   font-size: 1em; /* set size here */
   line-height: 1;
-  padding: 0.125em 0 0.175em 0.55em;
-  width: 2.75em;
+  padding: 0.125em 0 0.175em 0.15em;
 }
 
 .loading_dots span
 {
+  border: 0.15rem solid;
   border-radius: 50%;
   display: inline-block;
   height: 0.2rem;
@@ -2737,7 +2737,7 @@ ce671b orange
   -ms-animation-delay:      0.2s;
   animation-delay:          0.2s;
 }
-.loading_dots span:nth-child(1)
+.loading_dots span:nth-child(3)
 {
   -webkit-animation-delay:  0.4s;
   -moz-animation-delay:     0.4s;
@@ -2748,49 +2748,49 @@ ce671b orange
 @-webkit-keyframes loading_dots
 {
   0% {
-    background: transparent;
+    opacity: 0;
   }
   50% {
-    background: #000;
+    opacity: 1;
   }
   100% {
-    background: transparent;
+    opacity: 0;
   }
 }
 
 @-moz-keyframes loading_dots
 {
   0% {
-    background: transparent;
+    opacity: 0;
   }
   50% {
-    background: #000;
+    opacity: 1;
   }
   100% {
-    background: transparent;
+    opacity: 0;
   }
 }
 @-ms-keyframes loading_dots
 {
   0% {
-    background: transparent;
+    opacity: 0;
   }
   50% {
-    background: #000;
+    opacity: 1;
   }
   100% {
-    background: transparent;
+    opacity: 0;
   }
 }
 @keyframes loading_dots
 {
   0% {
-    background: transparent;
+    opacity: 0;
   }
   50% {
-    background: #000;
+    opacity: 1;
   }
   100% {
-    background: transparent;
+    opacity: 0;
   }
 }
diff --git a/app/js/lib/mtproto.js b/app/js/lib/mtproto.js
index bc7f3a72..00cc115d 100644
--- a/app/js/lib/mtproto.js
+++ b/app/js/lib/mtproto.js
@@ -2712,7 +2712,7 @@ factory('MtpApiFileManager', function (MtpApiManager, $q, $window) {
 
     $window.requestFileSystem = $window.requestFileSystem || $window.webkitRequestFileSystem;
 
-    if (!$window.requestFileSystem || true) {
+    if (!$window.requestFileSystem) {
       return cachedFsPromise = $q.reject({type: 'FS_BROWSER_UNSUPPORTED', description: 'requestFileSystem not present'});
     }