0x2620/oxjs
2
0
Fork 1
Code Issues 172 Pull requests Releases Wiki Activity

only animate loading interval if its actually used

Browse source
This commit is contained in:
j 2016-09-19 21:40:52 +02:00
parent 0f10b4be47
commit fde3b905f9
1 changed files with 33 additions and 30 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

63
source/UI/UI.js
View file

@ -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);
}
};