From 77319eb44f2b9815b4f14952fb9dc6a8d7c162c2 Mon Sep 17 00:00:00 2001
From: rlx <0x0073@0x2620.org>
Date: Mon, 29 Jul 2013 09:46:52 +0000
Subject: [PATCH] loading icon: stop animation before beginning new animation,
 add callback functions to start and stop, rotate back to 0 deg when stopped

---
 source/Ox.UI/js/Core/LoadingIcon.js | 20 ++++++++++++++++----
 1 file changed, 16 insertions(+), 4 deletions(-)

diff --git a/source/Ox.UI/js/Core/LoadingIcon.js b/source/Ox.UI/js/Core/LoadingIcon.js
index dab5c716..bd530437 100644
--- a/source/Ox.UI/js/Core/LoadingIcon.js
+++ b/source/Ox.UI/js/Core/LoadingIcon.js
@@ -29,11 +29,13 @@ Ox.LoadingIcon = function(options, self) {
         ? that.css({width: self.options.size, height: self.options.size})
         : that.addClass('Ox' + Ox.toTitleCase(self.options.size));
 
+    that.stopAnimation = that.stop;
+
     /*@
     start <f> Start loading animation
         ()  -> <f> Loading Icon Element
     @*/
-    that.start = function() {
+    that.start = function(callback) {
         var css, deg = 0, previousTime = +new Date();
         if (!self.loadingInterval) {
             self.loadingInterval = setInterval(function() {
@@ -49,7 +51,9 @@ Ox.LoadingIcon = function(options, self) {
                     WebkitTransform: css
                 });
             }, 83);
-            that.animate({opacity: 1}, 250);
+            that.stopAnimation().animate({opacity: 1}, 250, function() {
+                callback && callback();
+            });
         }
         return that;
     };
@@ -58,12 +62,20 @@ Ox.LoadingIcon = function(options, self) {
     stop <f> Stop loading animation
         ()  -> <f> Loading Icon Element
     @*/
-    that.stop = function() {
+    that.stop = function(callback) {
         var loadingInterval = self.loadingInterval;
         if (self.loadingInterval) {
             self.loadingInterval = void 0;
-            that.animate({opacity: 0}, 250, function() {
+            that.stopAnimation().animate({opacity: 0}, 250, function() {
+                var css = 'rotate(0deg)';
                 clearInterval(loadingInterval);
+                that.css({
+                    MozTransform: css,
+                    MsTransform: css,
+                    OTransform: css,
+                    WebkitTransform: css
+                });
+                callback && callback();
             });
         }
         return that;