From 4b454790d579e60b4acd4628aa583659cbe7bb46 Mon Sep 17 00:00:00 2001
From: rolux <rolux@rolux.org>
Date: Thu, 24 May 2012 14:26:52 +0200
Subject: [PATCH] don't use animated loading icon svg (consumes 100% cpu in
 recent versions of chrome)

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

diff --git a/source/Ox.UI/js/Core/Ox.LoadingIcon.js b/source/Ox.UI/js/Core/Ox.LoadingIcon.js
index c4c2dca0..3cfaa732 100644
--- a/source/Ox.UI/js/Core/Ox.LoadingIcon.js
+++ b/source/Ox.UI/js/Core/Ox.LoadingIcon.js
@@ -25,21 +25,23 @@ Ox.LoadingIcon = function(options, self) {
             'OxLoadingIcon Ox' + Ox.toTitleCase(self.options.size)
         );
 
-    self.setOption = function(key, value) {
-        
-    };
-
     /*@
     start <f> Start loading animation
         ()  -> <f> Loading Icon Element
     @*/
     that.start = function() {
-        that.attr({
-            src: Ox.UI.getImageURL('symbolLoadingAnimated')
-        })
-        .animate({
-            opacity: 1
-        }, 250);
+        var deg = 0;
+        if (!self.loadingInterval) {
+            self.loadingInterval = setInterval(function() {
+                deg = (deg + 30) % 360;
+                that.css({
+                    OTransform: 'rotate(' + deg + 'deg)',
+                    MozTransform: 'rotate(' + deg + 'deg)',
+                    WebkitTransform: 'rotate(' + deg + 'deg)'
+                });
+            }, 83)
+            that.animate({opacity: 1}, 250);
+        }
         return that;
     };
 
@@ -48,13 +50,13 @@ Ox.LoadingIcon = function(options, self) {
         ()  -> <f> Loading Icon Element
     @*/
     that.stop = function() {
-        that.animate({
-            opacity: 0
-        }, 250, function() {
-            that.attr({
-                src: Ox.UI.getImageURL('symbolLoading')
+        var loadingInterval = self.loadingInterval;
+        if (self.loadingInterval) {
+            self.loadingInterval = void 0;
+            that.animate({opacity: 0}, 250, function() {
+                clearInterval(loadingInterval);
             });
-        });        
+        }
         return that;
     };