Skip to content

Instantly share code, notes, and snippets.

@Olical
Created August 22, 2011 16:06
Show Gist options
  • Select an option

  • Save Olical/1162768 to your computer and use it in GitHub Desktop.

Select an option

Save Olical/1162768 to your computer and use it in GitHub Desktop.
Progress bar class for MooTools
// Live example - http://jsfiddle.net/Wolfy87/KJtdB/
var bar = new Progress({
element: $('bar'),
progress: 20
});
setTimeout(function() {
bar.setProgress(45);
setTimeout(function() {
bar.setProgress(78);
setTimeout(function() {
bar.setProgress(100);
}, 1400);
}, 500);
}, 800);
var Progress = new Class({
Implements: [Options, Events],
options: {
element: null,
progress: 0,
property: 'width',
unit: '%',
duration: 500
},
initialize: function(options) {
this.setOptions(options);
// Set up the tween
this.tween = new Fx.Tween(options.element, {
property: this.options.property,
unit: this.options.unit,
link: 'cancel',
duration: this.options.duration
});
// Set the initial progress
this.setProgress(this.options.progress, true);
},
setProgress: function(progress, instant) {
// Set the progress either instantly or with an animation
if(instant) {
this.options.element.setStyle(this.options.property, progress + this.options.unit);
}
else {
this.tween.start(this.options.progress, progress);
}
// Update the current progress
this.options.progress = progress;
this.fireEvent('progress', progress);
},
getProgress: function() {
return this.options.progress;
}
});
var Progress=new Class({Implements:[Options,Events],options:{element:null,progress:0,property:"width",unit:"%",duration:500},initialize:function(a){this.setOptions(a);this.tween=new Fx.Tween(a.element,{property:this.options.property,unit:this.options.unit,link:"cancel",duration:this.options.duration});this.setProgress(this.options.progress,!0)},setProgress:function(a,b){b?this.options.element.setStyle(this.options.property,a+this.options.unit):this.tween.start(this.options.progress,a);this.options.progress=
a;this.fireEvent("progress",a)},getProgress:function(){return this.options.progress}});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment