2 * jQuery UI Button 1.8.2
4 * Copyright (c) 2010 AUTHORS.txt (http://jqueryui.com/about)
5 * Dual licensed under the MIT (MIT-LICENSE.txt)
6 * and GPL (GPL-LICENSE.txt) licenses.
8 * http://docs.jquery.com/UI/Button
17 baseClasses = "ui-button ui-widget ui-state-default ui-corner-all",
18 stateClasses = "ui-state-hover ui-state-active ",
19 typeClasses = "ui-button-icons-only ui-button-icon-only ui-button-text-icons ui-button-text-icon ui-button-text-only",
20 formResetHandler = function( event ) {
21 $( ":ui-button", event.target.form ).each(function() {
22 var inst = $( this ).data( "button" );
23 setTimeout(function() {
28 radioGroup = function( radio ) {
29 var name = radio.name,
34 radios = $( form ).find( "[name='" + name + "']" );
36 radios = $( "[name='" + name + "']", radio.ownerDocument )
45 $.widget( "ui.button", {
55 this.element.closest( "form" )
56 .unbind( "reset.button" )
57 .bind( "reset.button", formResetHandler );
59 this._determineButtonType();
60 this.hasTitle = !!this.buttonElement.attr( "title" );
63 options = this.options,
64 toggleButton = this.type === "checkbox" || this.type === "radio",
65 hoverClass = "ui-state-hover" + ( !toggleButton ? " ui-state-active" : "" ),
66 focusClass = "ui-state-focus";
68 if ( options.label === null ) {
69 options.label = this.buttonElement.html();
72 if ( this.element.is( ":disabled" ) ) {
73 options.disabled = true;
77 .addClass( baseClasses )
78 .attr( "role", "button" )
79 .bind( "mouseenter.button", function() {
80 if ( options.disabled ) {
83 $( this ).addClass( "ui-state-hover" );
84 if ( this === lastActive ) {
85 $( this ).addClass( "ui-state-active" );
88 .bind( "mouseleave.button", function() {
89 if ( options.disabled ) {
92 $( this ).removeClass( hoverClass );
94 .bind( "focus.button", function() {
95 // no need to check disabled, focus won't be triggered anyway
96 $( this ).addClass( focusClass );
98 .bind( "blur.button", function() {
99 $( this ).removeClass( focusClass );
102 if ( toggleButton ) {
103 this.element.bind( "change.button", function() {
108 if ( this.type === "checkbox" ) {
109 this.buttonElement.bind( "click.button", function() {
110 if ( options.disabled ) {
113 $( this ).toggleClass( "ui-state-active" );
114 self.buttonElement.attr( "aria-pressed", self.element[0].checked );
116 } else if ( this.type === "radio" ) {
117 this.buttonElement.bind( "click.button", function() {
118 if ( options.disabled ) {
121 $( this ).addClass( "ui-state-active" );
122 self.buttonElement.attr( "aria-pressed", true );
124 var radio = self.element[ 0 ];
128 return $( this ).button( "widget" )[ 0 ];
130 .removeClass( "ui-state-active" )
131 .attr( "aria-pressed", false );
135 .bind( "mousedown.button", function() {
136 if ( options.disabled ) {
139 $( this ).addClass( "ui-state-active" );
141 $( document ).one( "mouseup", function() {
145 .bind( "mouseup.button", function() {
146 if ( options.disabled ) {
149 $( this ).removeClass( "ui-state-active" );
151 .bind( "keydown.button", function(event) {
152 if ( options.disabled ) {
155 if ( event.keyCode == $.ui.keyCode.SPACE || event.keyCode == $.ui.keyCode.ENTER ) {
156 $( this ).addClass( "ui-state-active" );
159 .bind( "keyup.button", function() {
160 $( this ).removeClass( "ui-state-active" );
163 if ( this.buttonElement.is("a") ) {
164 this.buttonElement.keyup(function(event) {
165 if ( event.keyCode === $.ui.keyCode.SPACE ) {
166 // TODO pass through original event correctly (just as 2nd argument doesn't work)
173 // TODO: pull out $.Widget's handling for the disabled option into
174 // $.Widget.prototype._setOptionDisabled so it's easy to proxy and can
175 // be overridden by individual plugins
176 this._setOption( "disabled", options.disabled );
179 _determineButtonType: function() {
181 if ( this.element.is(":checkbox") ) {
182 this.type = "checkbox";
184 if ( this.element.is(":radio") ) {
187 if ( this.element.is("input") ) {
190 this.type = "button";
195 if ( this.type === "checkbox" || this.type === "radio" ) {
196 // we don't search against the document in case the element
197 // is disconnected from the DOM
198 this.buttonElement = this.element.parents().last()
199 .find( "[for=" + this.element.attr("id") + "]" );
200 this.element.addClass( "ui-helper-hidden-accessible" );
202 var checked = this.element.is( ":checked" );
204 this.buttonElement.addClass( "ui-state-active" );
206 this.buttonElement.attr( "aria-pressed", checked );
208 this.buttonElement = this.element;
213 return this.buttonElement;
216 destroy: function() {
218 .removeClass( "ui-helper-hidden-accessible" );
220 .removeClass( baseClasses + " " + stateClasses + " " + typeClasses )
221 .removeAttr( "role" )
222 .removeAttr( "aria-pressed" )
223 .html( this.buttonElement.find(".ui-button-text").html() );
225 if ( !this.hasTitle ) {
226 this.buttonElement.removeAttr( "title" );
229 $.Widget.prototype.destroy.call( this );
232 _setOption: function( key, value ) {
233 $.Widget.prototype._setOption.apply( this, arguments );
234 if ( key === "disabled" ) {
236 this.element.attr( "disabled", true );
238 this.element.removeAttr( "disabled" );
244 refresh: function() {
245 var isDisabled = this.element.is( ":disabled" );
246 if ( isDisabled !== this.options.disabled ) {
247 this._setOption( "disabled", isDisabled );
249 if ( this.type === "radio" ) {
250 radioGroup( this.element[0] ).each(function() {
251 if ( $( this ).is( ":checked" ) ) {
252 $( this ).button( "widget" )
253 .addClass( "ui-state-active" )
254 .attr( "aria-pressed", true );
256 $( this ).button( "widget" )
257 .removeClass( "ui-state-active" )
258 .attr( "aria-pressed", false );
261 } else if ( this.type === "checkbox" ) {
262 if ( this.element.is( ":checked" ) ) {
264 .addClass( "ui-state-active" )
265 .attr( "aria-pressed", true );
268 .removeClass( "ui-state-active" )
269 .attr( "aria-pressed", false );
274 _resetButton: function() {
275 if ( this.type === "input" ) {
276 if ( this.options.label ) {
277 this.element.val( this.options.label );
281 var buttonElement = this.buttonElement.removeClass( typeClasses ),
282 buttonText = $( "<span></span>" )
283 .addClass( "ui-button-text" )
284 .html( this.options.label )
285 .appendTo( buttonElement.empty() )
287 icons = this.options.icons,
288 multipleIcons = icons.primary && icons.secondary;
289 if ( icons.primary || icons.secondary ) {
290 buttonElement.addClass( "ui-button-text-icon" +
291 ( multipleIcons ? "s" : "" ) );
292 if ( icons.primary ) {
293 buttonElement.prepend( "<span class='ui-button-icon-primary ui-icon " + icons.primary + "'></span>" );
295 if ( icons.secondary ) {
296 buttonElement.append( "<span class='ui-button-icon-secondary ui-icon " + icons.secondary + "'></span>" );
298 if ( !this.options.text ) {
300 .addClass( multipleIcons ? "ui-button-icons-only" : "ui-button-icon-only" )
301 .removeClass( "ui-button-text-icons ui-button-text-icon" );
302 if ( !this.hasTitle ) {
303 buttonElement.attr( "title", buttonText );
307 buttonElement.addClass( "ui-button-text-only" );
312 $.widget( "ui.buttonset", {
313 _create: function() {
314 this.element.addClass( "ui-buttonset" );
322 _setOption: function( key, value ) {
323 if ( key === "disabled" ) {
324 this.buttons.button( "option", key, value );
327 $.Widget.prototype._setOption.apply( this, arguments );
330 refresh: function() {
331 this.buttons = this.element.find( ":button, :submit, :reset, :checkbox, :radio, a, :data(button)" )
332 .filter( ":ui-button" )
339 return $( this ).button( "widget" )[ 0 ];
341 .removeClass( "ui-corner-all ui-corner-left ui-corner-right" )
343 .addClass( "ui-corner-left" )
346 .addClass( "ui-corner-right" )
351 destroy: function() {
352 this.element.removeClass( "ui-buttonset" );
355 return $( this ).button( "widget" )[ 0 ];
357 .removeClass( "ui-corner-left ui-corner-right" )
359 .button( "destroy" );
361 $.Widget.prototype.destroy.call( this );