sanj/oxjs
1
0
Fork 0
forked from 0x2620/oxjs
Code Pull requests Activity

add progress bar demo

Browse source
This commit is contained in:
rolux 2011-09-01 23:38:57 +02:00
commit 16ef28d260
8 changed files with 148 additions and 17 deletions
Download patch file Download diff file Expand all files Collapse all files

42
source/Ox.UI/js/Bar/Ox.Progressbar.js
View file

@ -8,23 +8,53 @@ Ox.Progressbar = function(options, self) {
})
.options(options || {})
.addClass('OxProgressbar')
.css({width: self.options.width});
.css({width: self.options.width - 2 + 'px'});
self.$progress = $('<div>').appendTo(that);
setProgress();
//setProgress();
function setProgress() {
self.$progress.css({
width: Math.round(16 + self.options.progress * (self.options.width - 16)) + 'px'
});
self.$progress.stop().animate({
width: Math.round(14 + self.options.progress * (self.options.width - 16)) + 'px'
}, 250);
if (self.options.progress == 1) {
self.$progress.removeClass('OxAnimate');
$.browser.mozilla && clearInterval(self.interval);
}
}
self.setOption = function(key, value) {
if (key == 'progress') {
self.options.progress = Ox.limit(self.options.progress, 0, 1);
setProgress();
}
}
};
that.start = function() {
self.startTime = +new Date();
self.$progress.addClass('OxAnimate');
if ($.browser.mozilla) {
self.offset = 0;
self.interval = setInterval(function() {
self.$progress.css({backgroundPosition: --self.offset + 'px 0, 0 0'})
}, 1000 / 32);
}
return that;
};
that.status = function() {
var elapsed = +new Date() - self.startTime;
return {
elapsed: Ox.formatDuration(Math.floor(
elapsed / 1000
), 'long'),
percent: Math.round(self.options.progress * 100) + '%',
remaining: progress ? Ox.formatDuration(Math.ceil(
elapsed / progress * (1 - progress) / 1000
), 'long') : 'unknown'
};
};
return that;