jquery-ui/ui/widgets/progressbar.js

170 lines
4.0 KiB
JavaScript
Raw Normal View History

/*!
* jQuery UI Progressbar @VERSION
2012-07-04 13:08:08 +00:00
* http://jqueryui.com
*
* Copyright jQuery Foundation and other contributors
2012-08-09 14:13:24 +00:00
* Released under the MIT license.
* http://jquery.org/license
*/
//>>label: Progressbar
//>>group: Widgets
//>>description: Displays a status indicator for loading state, standard percentage, and other progress indicators.
//>>docs: http://api.jqueryui.com/progressbar/
//>>demos: http://jqueryui.com/progressbar/
//>>css.structure: ../themes/base/core.css
//>>css.structure: ../themes/base/progressbar.css
//>>css.theme: ../themes/base/theme.css
( function( factory ) {
if ( typeof define === "function" && define.amd ) {
// AMD. Register as an anonymous module.
define( [
"jquery",
"../version",
"../widget"
], factory );
} else {
// Browser globals
factory( jQuery );
}
}( function( $ ) {
return $.widget( "ui.progressbar", {
version: "@VERSION",
options: {
classes: {
"ui-progressbar": "ui-corner-all",
"ui-progressbar-value": "ui-corner-left",
"ui-progressbar-complete": "ui-corner-right"
},
max: 100,
value: 0,
change: null,
complete: null
},
2010-07-29 09:38:24 +00:00
min: 0,
_create: function() {
// Constrain initial value
2012-12-06 15:10:07 +00:00
this.oldValue = this.options.value = this._constrainedValue();
this.element.attr( {
// Only set static values; aria-valuenow and aria-valuemax are
// set inside _refreshValue()
role: "progressbar",
"aria-valuemin": this.min
} );
this._addClass( "ui-progressbar", "ui-widget ui-widget-content" );
2008-12-05 13:35:11 +00:00
this.valueDiv = $( "<div>" ).appendTo( this.element );
this._addClass( this.valueDiv, "ui-progressbar-value", "ui-widget-header" );
2008-12-05 13:35:11 +00:00
this._refreshValue();
},
2008-09-20 11:22:54 +00:00
_destroy: function() {
this.element.removeAttr( "role aria-valuemin aria-valuemax aria-valuenow" );
2008-12-05 13:35:11 +00:00
this.valueDiv.remove();
},
value: function( newValue ) {
if ( newValue === undefined ) {
return this.options.value;
}
2012-12-06 15:10:07 +00:00
this.options.value = this._constrainedValue( newValue );
this._refreshValue();
2008-12-05 13:35:11 +00:00
},
_constrainedValue: function( newValue ) {
if ( newValue === undefined ) {
2012-12-06 15:10:07 +00:00
newValue = this.options.value;
2008-09-20 11:22:54 +00:00
}
2008-12-05 13:35:11 +00:00
2012-12-06 15:10:07 +00:00
this.indeterminate = newValue === false;
// sanitize value
2012-12-06 15:10:07 +00:00
if ( typeof newValue !== "number" ) {
newValue = 0;
}
2012-12-06 15:10:07 +00:00
return this.indeterminate ? false :
Math.min( this.options.max, Math.max( this.min, newValue ) );
},
_setOptions: function( options ) {
// Ensure "value" option is set after other values (like max)
2012-12-06 15:10:07 +00:00
var value = options.value;
delete options.value;
2012-12-06 15:10:07 +00:00
this._super( options );
2012-12-06 15:10:07 +00:00
this.options.value = this._constrainedValue( value );
this._refreshValue();
},
_setOption: function( key, value ) {
if ( key === "max" ) {
// Don't allow a max less than min
2012-12-06 15:10:07 +00:00
value = Math.max( this.min, value );
}
if ( key === "disabled" ) {
this.element.attr( "aria-disabled", value );
this._toggleClass( null, "ui-state-disabled", !!value );
}
2012-12-06 15:10:07 +00:00
this._super( key, value );
},
_percentage: function() {
return this.indeterminate ? 100 : 100 * ( this.options.value - this.min ) / ( this.options.max - this.min );
},
2008-12-05 13:35:11 +00:00
_refreshValue: function() {
var value = this.options.value,
percentage = this._percentage();
this.valueDiv
.toggle( this.indeterminate || value > this.min )
.width( percentage.toFixed( 0 ) + "%" );
this
._toggleClass( this.valueDiv, "ui-progressbar-complete", null,
value === this.options.max )
._toggleClass( "ui-progressbar-indeterminate", null, this.indeterminate );
if ( this.indeterminate ) {
this.element.removeAttr( "aria-valuenow" );
if ( !this.overlayDiv ) {
this.overlayDiv = $( "<div>" ).appendTo( this.valueDiv );
this._addClass( this.overlayDiv, "ui-progressbar-overlay" );
}
} else {
this.element.attr( {
"aria-valuemax": this.options.max,
"aria-valuenow": value
} );
if ( this.overlayDiv ) {
this.overlayDiv.remove();
this.overlayDiv = null;
}
}
if ( this.oldValue !== value ) {
this.oldValue = value;
this._trigger( "change" );
}
if ( value === this.options.max ) {
this._trigger( "complete" );
}
}
} );
} ) );