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 );