From fde3b905f9e64335be2219e740fe688ec882bc9e Mon Sep 17 00:00:00 2001
From: j <j@mailb.org>
Date: Mon, 19 Sep 2016 21:40:52 +0200
Subject: [PATCH] only animate loading interval if its actually used

---
 source/UI/UI.js | 63 ++++++++++++++++++++++++++-----------------------
 1 file changed, 33 insertions(+), 30 deletions(-)

diff --git a/source/UI/UI.js b/source/UI/UI.js
index e48b8028..52eb26e0 100644
--- a/source/UI/UI.js
+++ b/source/UI/UI.js
@@ -90,8 +90,10 @@ Ox.load.UI = function(options, callback) {
                 margin: 'auto',
                 MozUserSelect: 'none',
                 WebkitUserSelect: 'none'
-            },  
-            loadingInterval;
+            },
+            loadingInterval,
+            $icon,
+            deg = 0;
 
         browserSupported ? showIcon() : showWarning();
 
@@ -116,34 +118,22 @@ Ox.load.UI = function(options, callback) {
                     .appendTo(div);
             });
             */
-            var deg = 0,
-                $element,
-                src = Ox.PATH + 'UI/themes/' + options.theme + '/svg/symbolLoading.svg'
+            var src = Ox.PATH + 'UI/themes/' + options.theme + '/svg/symbolLoading.svg'
             Ox.getFile(src, function() {
-                var $icon = Ox.$('<img>')
-                        .attr({
-                            src: src
-                        })
-                        .css(Ox.extend({
-                            width: '32px',
-                            height: '32px'
-                        }, css))
-                        .on({
-                            mousedown: function(e) {
-                                e.preventDefault()
-                            }
-                        })
-                        .appendTo($screen),
-                    deg = 0;
-                loadingInterval = setInterval(function() {
-                    deg = (deg + 30) % 360;
-                    $icon.css({
-                        MozTransform: 'rotate(' + deg + 'deg)',
-                        OTransform: 'rotate(' + deg + 'deg)',
-                        WebkitTransform: 'rotate(' + deg + 'deg)',
-                        transform: 'rotate(' + deg + 'deg)'
-                    });
-                }, 83);
+                $icon = Ox.$('<img>')
+                    .attr({
+                        src: src
+                    })
+                    .css(Ox.extend({
+                        width: '32px',
+                        height: '32px'
+                    }, css))
+                    .on({
+                        mousedown: function(e) {
+                            e.preventDefault()
+                        }
+                    })
+                    .appendTo($screen);
             });
         }
 
@@ -201,7 +191,6 @@ Ox.load.UI = function(options, callback) {
                         .appendTo($box);
                 });
             }
-            
         }
 
         return {
@@ -211,6 +200,7 @@ Ox.load.UI = function(options, callback) {
                 }, 1000, function() {
                     if (browserSupported) {
                         clearInterval(loadingInterval);
+                        loadingInterval = null;
                         $screen.remove();
                     } else {
                         $screen.on({
@@ -222,6 +212,19 @@ Ox.load.UI = function(options, callback) {
                 });
             },
             show: function() {
+                if (!loadingInterval) {
+                    loadingInterval = setInterval(function() {
+                        if ($icon) {
+                            deg = (deg + 30) % 360;
+                            $icon.css({
+                                MozTransform: 'rotate(' + deg + 'deg)',
+                                OTransform: 'rotate(' + deg + 'deg)',
+                                WebkitTransform: 'rotate(' + deg + 'deg)',
+                                transform: 'rotate(' + deg + 'deg)'
+                            });
+                        }
+                    }, 83);
+                }
                 $screen.appendTo($body);
             }
         };