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

fix bugs in progress bar

Browse source
This commit is contained in:
rolux 2012-04-14 13:49:22 +02:00
parent e790571f2c
commit f88c60ae15
1 changed files with 13 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

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

@ -8,7 +8,7 @@ Ox.Progressbar <f> Progress Bar
options <o|{}> Options object options <o|{}> Options object
cancelled <b|false> If true, progress bar is cancelled cancelled <b|false> If true, progress bar is cancelled
paused <b|false> If true, progress bar is paused paused <b|false> If true, progress bar is paused
progress <n|0> Progress, float between 0 and 1 progress <n|0> Progress, float between 0 and 1, or -1 for indeterminate
showCancelButton <b|false> If true, show cancel button showCancelButton <b|false> If true, show cancel button
showPauseButton <b|false> If true, show pause button showPauseButton <b|false> If true, show pause button
showPercent <b|false> If true, show progress in percent showPercent <b|false> If true, show progress in percent
@ -41,6 +41,8 @@ Ox.Progressbar = function(options, self) {
.addClass('OxProgressbar') .addClass('OxProgressbar')
.css({width: self.options.width - 2 + 'px'}); .css({width: self.options.width - 2 + 'px'});
self.indeterminate = self.options.progress == -1;
self.trackWidth = self.options.width self.trackWidth = self.options.width
- self.options.showPercent * 36 - self.options.showPercent * 36
- self.options.showTime * 60 - self.options.showTime * 60
@ -86,7 +88,6 @@ Ox.Progressbar = function(options, self) {
.appendTo(that); .appendTo(that);
} }
if (self.options.showCancelButton) { if (self.options.showCancelButton) {
self.$cancelButton = Ox.Button(Ox.extend({ self.$cancelButton = Ox.Button(Ox.extend({
style: 'symbol', style: 'symbol',
@ -105,6 +106,8 @@ Ox.Progressbar = function(options, self) {
.appendTo(that); .appendTo(that);
} }
setProgress();
!self.options.paused && resume(); !self.options.paused && resume();
function cancel() { function cancel() {
@ -135,7 +138,9 @@ Ox.Progressbar = function(options, self) {
function restart() { function restart() {
self.options.cancelled = false; self.options.cancelled = false;
if (!self.indeterminate) {
self.options.progress = 0; self.options.progress = 0;
}
delete self.startTime; delete self.startTime;
self.$pauseButton && self.$pauseButton.options({disabled: false}); self.$pauseButton && self.$pauseButton.options({disabled: false});
setProgress(); setProgress();
@ -167,7 +172,7 @@ Ox.Progressbar = function(options, self) {
self.options.progress ? Ox.formatDuration(that.status().remaining) : 'unknown' self.options.progress ? Ox.formatDuration(that.status().remaining) : 'unknown'
); );
self.$progress.stop().animate({ self.$progress.stop().animate({
width: Math.round(14 + self.options.progress * (self.trackWidth - 16)) + 'px' width: Math.round(14 + Math.abs(self.options.progress) * (self.trackWidth - 16)) + 'px'
}, animate ? 250 : 0, function() { }, animate ? 250 : 0, function() {
self.options.progress == 1 && complete(); self.options.progress == 1 && complete();
}); });
@ -189,6 +194,8 @@ Ox.Progressbar = function(options, self) {
function toggleCancelled(e) { function toggleCancelled(e) {
if (e) { if (e) {
self.options.cancelled = !self.options.cancelled; self.options.cancelled = !self.options.cancelled;
} else if (self.$cancelButton) {
self.$cancelButton.toggle();
} }
self.options.cancelled ? cancel() : restart(); self.options.cancelled ? cancel() : restart();
that.triggerEvent(self.options.cancelled ? 'cancel' : 'restart'); that.triggerEvent(self.options.cancelled ? 'cancel' : 'restart');
@ -197,6 +204,8 @@ Ox.Progressbar = function(options, self) {
function togglePaused(e) { function togglePaused(e) {
if (e) { if (e) {
self.options.paused = !self.options.paused; self.options.paused = !self.options.paused;
} else if (self.$pauseButton) {
self.$pauseButton.toggle();
} }
self.options.paused ? pause() : resume(); self.options.paused ? pause() : resume();
that.triggerEvent(self.options.paused ? 'pause' : 'resume'); that.triggerEvent(self.options.paused ? 'pause' : 'resume');