only animate loading interval if its actually used

This commit is contained in:
j 2016-09-19 21:40:52 +02:00
parent 0f10b4be47
commit fde3b905f9

View file

@ -91,7 +91,9 @@ Ox.load.UI = function(options, callback) {
MozUserSelect: 'none', MozUserSelect: 'none',
WebkitUserSelect: 'none' WebkitUserSelect: 'none'
}, },
loadingInterval; loadingInterval,
$icon,
deg = 0;
browserSupported ? showIcon() : showWarning(); browserSupported ? showIcon() : showWarning();
@ -116,34 +118,22 @@ Ox.load.UI = function(options, callback) {
.appendTo(div); .appendTo(div);
}); });
*/ */
var deg = 0, var src = Ox.PATH + 'UI/themes/' + options.theme + '/svg/symbolLoading.svg'
$element,
src = Ox.PATH + 'UI/themes/' + options.theme + '/svg/symbolLoading.svg'
Ox.getFile(src, function() { Ox.getFile(src, function() {
var $icon = Ox.$('<img>') $icon = Ox.$('<img>')
.attr({ .attr({
src: src src: src
}) })
.css(Ox.extend({ .css(Ox.extend({
width: '32px', width: '32px',
height: '32px' height: '32px'
}, css)) }, css))
.on({ .on({
mousedown: function(e) { mousedown: function(e) {
e.preventDefault() e.preventDefault()
} }
}) })
.appendTo($screen), .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);
}); });
} }
@ -201,7 +191,6 @@ Ox.load.UI = function(options, callback) {
.appendTo($box); .appendTo($box);
}); });
} }
} }
return { return {
@ -211,6 +200,7 @@ Ox.load.UI = function(options, callback) {
}, 1000, function() { }, 1000, function() {
if (browserSupported) { if (browserSupported) {
clearInterval(loadingInterval); clearInterval(loadingInterval);
loadingInterval = null;
$screen.remove(); $screen.remove();
} else { } else {
$screen.on({ $screen.on({
@ -222,6 +212,19 @@ Ox.load.UI = function(options, callback) {
}); });
}, },
show: function() { 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); $screen.appendTo($body);
} }
}; };