|
7
|
1 /*!
|
|
|
2 * jQuery UI Button 1.10.4
|
|
|
3 * http://jqueryui.com
|
|
|
4 *
|
|
|
5 * Copyright 2014 jQuery Foundation and other contributors
|
|
|
6 * Released under the MIT license.
|
|
|
7 * http://jquery.org/license
|
|
|
8 *
|
|
|
9 * http://api.jqueryui.com/button/
|
|
|
10 *
|
|
|
11 * Depends:
|
|
|
12 * jquery.ui.core.js
|
|
|
13 * jquery.ui.widget.js
|
|
|
14 */
|
|
|
15 (function( $, undefined ) {
|
|
|
16
|
|
|
17 var lastActive,
|
|
|
18 baseClasses = "ui-button ui-widget ui-state-default ui-corner-all",
|
|
|
19 typeClasses = "ui-button-icons-only ui-button-icon-only ui-button-text-icons ui-button-text-icon-primary ui-button-text-icon-secondary ui-button-text-only",
|
|
|
20 formResetHandler = function() {
|
|
|
21 var form = $( this );
|
|
|
22 setTimeout(function() {
|
|
|
23 form.find( ":ui-button" ).button( "refresh" );
|
|
|
24 }, 1 );
|
|
|
25 },
|
|
|
26 radioGroup = function( radio ) {
|
|
|
27 var name = radio.name,
|
|
|
28 form = radio.form,
|
|
|
29 radios = $( [] );
|
|
|
30 if ( name ) {
|
|
|
31 name = name.replace( /'/g, "\\'" );
|
|
|
32 if ( form ) {
|
|
|
33 radios = $( form ).find( "[name='" + name + "']" );
|
|
|
34 } else {
|
|
|
35 radios = $( "[name='" + name + "']", radio.ownerDocument )
|
|
|
36 .filter(function() {
|
|
|
37 return !this.form;
|
|
|
38 });
|
|
|
39 }
|
|
|
40 }
|
|
|
41 return radios;
|
|
|
42 };
|
|
|
43
|
|
|
44 $.widget( "ui.button", {
|
|
|
45 version: "1.10.4",
|
|
|
46 defaultElement: "<button>",
|
|
|
47 options: {
|
|
|
48 disabled: null,
|
|
|
49 text: true,
|
|
|
50 label: null,
|
|
|
51 icons: {
|
|
|
52 primary: null,
|
|
|
53 secondary: null
|
|
|
54 }
|
|
|
55 },
|
|
|
56 _create: function() {
|
|
|
57 this.element.closest( "form" )
|
|
|
58 .unbind( "reset" + this.eventNamespace )
|
|
|
59 .bind( "reset" + this.eventNamespace, formResetHandler );
|
|
|
60
|
|
|
61 if ( typeof this.options.disabled !== "boolean" ) {
|
|
|
62 this.options.disabled = !!this.element.prop( "disabled" );
|
|
|
63 } else {
|
|
|
64 this.element.prop( "disabled", this.options.disabled );
|
|
|
65 }
|
|
|
66
|
|
|
67 this._determineButtonType();
|
|
|
68 this.hasTitle = !!this.buttonElement.attr( "title" );
|
|
|
69
|
|
|
70 var that = this,
|
|
|
71 options = this.options,
|
|
|
72 toggleButton = this.type === "checkbox" || this.type === "radio",
|
|
|
73 activeClass = !toggleButton ? "ui-state-active" : "";
|
|
|
74
|
|
|
75 if ( options.label === null ) {
|
|
|
76 options.label = (this.type === "input" ? this.buttonElement.val() : this.buttonElement.html());
|
|
|
77 }
|
|
|
78
|
|
|
79 this._hoverable( this.buttonElement );
|
|
|
80
|
|
|
81 this.buttonElement
|
|
|
82 .addClass( baseClasses )
|
|
|
83 .attr( "role", "button" )
|
|
|
84 .bind( "mouseenter" + this.eventNamespace, function() {
|
|
|
85 if ( options.disabled ) {
|
|
|
86 return;
|
|
|
87 }
|
|
|
88 if ( this === lastActive ) {
|
|
|
89 $( this ).addClass( "ui-state-active" );
|
|
|
90 }
|
|
|
91 })
|
|
|
92 .bind( "mouseleave" + this.eventNamespace, function() {
|
|
|
93 if ( options.disabled ) {
|
|
|
94 return;
|
|
|
95 }
|
|
|
96 $( this ).removeClass( activeClass );
|
|
|
97 })
|
|
|
98 .bind( "click" + this.eventNamespace, function( event ) {
|
|
|
99 if ( options.disabled ) {
|
|
|
100 event.preventDefault();
|
|
|
101 event.stopImmediatePropagation();
|
|
|
102 }
|
|
|
103 });
|
|
|
104
|
|
|
105 // Can't use _focusable() because the element that receives focus
|
|
|
106 // and the element that gets the ui-state-focus class are different
|
|
|
107 this._on({
|
|
|
108 focus: function() {
|
|
|
109 this.buttonElement.addClass( "ui-state-focus" );
|
|
|
110 },
|
|
|
111 blur: function() {
|
|
|
112 this.buttonElement.removeClass( "ui-state-focus" );
|
|
|
113 }
|
|
|
114 });
|
|
|
115
|
|
|
116 if ( toggleButton ) {
|
|
|
117 this.element.bind( "change" + this.eventNamespace, function() {
|
|
|
118 that.refresh();
|
|
|
119 });
|
|
|
120 }
|
|
|
121
|
|
|
122 if ( this.type === "checkbox" ) {
|
|
|
123 this.buttonElement.bind( "click" + this.eventNamespace, function() {
|
|
|
124 if ( options.disabled ) {
|
|
|
125 return false;
|
|
|
126 }
|
|
|
127 });
|
|
|
128 } else if ( this.type === "radio" ) {
|
|
|
129 this.buttonElement.bind( "click" + this.eventNamespace, function() {
|
|
|
130 if ( options.disabled ) {
|
|
|
131 return false;
|
|
|
132 }
|
|
|
133 $( this ).addClass( "ui-state-active" );
|
|
|
134 that.buttonElement.attr( "aria-pressed", "true" );
|
|
|
135
|
|
|
136 var radio = that.element[ 0 ];
|
|
|
137 radioGroup( radio )
|
|
|
138 .not( radio )
|
|
|
139 .map(function() {
|
|
|
140 return $( this ).button( "widget" )[ 0 ];
|
|
|
141 })
|
|
|
142 .removeClass( "ui-state-active" )
|
|
|
143 .attr( "aria-pressed", "false" );
|
|
|
144 });
|
|
|
145 } else {
|
|
|
146 this.buttonElement
|
|
|
147 .bind( "mousedown" + this.eventNamespace, function() {
|
|
|
148 if ( options.disabled ) {
|
|
|
149 return false;
|
|
|
150 }
|
|
|
151 $( this ).addClass( "ui-state-active" );
|
|
|
152 lastActive = this;
|
|
|
153 that.document.one( "mouseup", function() {
|
|
|
154 lastActive = null;
|
|
|
155 });
|
|
|
156 })
|
|
|
157 .bind( "mouseup" + this.eventNamespace, function() {
|
|
|
158 if ( options.disabled ) {
|
|
|
159 return false;
|
|
|
160 }
|
|
|
161 $( this ).removeClass( "ui-state-active" );
|
|
|
162 })
|
|
|
163 .bind( "keydown" + this.eventNamespace, function(event) {
|
|
|
164 if ( options.disabled ) {
|
|
|
165 return false;
|
|
|
166 }
|
|
|
167 if ( event.keyCode === $.ui.keyCode.SPACE || event.keyCode === $.ui.keyCode.ENTER ) {
|
|
|
168 $( this ).addClass( "ui-state-active" );
|
|
|
169 }
|
|
|
170 })
|
|
|
171 // see #8559, we bind to blur here in case the button element loses
|
|
|
172 // focus between keydown and keyup, it would be left in an "active" state
|
|
|
173 .bind( "keyup" + this.eventNamespace + " blur" + this.eventNamespace, function() {
|
|
|
174 $( this ).removeClass( "ui-state-active" );
|
|
|
175 });
|
|
|
176
|
|
|
177 if ( this.buttonElement.is("a") ) {
|
|
|
178 this.buttonElement.keyup(function(event) {
|
|
|
179 if ( event.keyCode === $.ui.keyCode.SPACE ) {
|
|
|
180 // TODO pass through original event correctly (just as 2nd argument doesn't work)
|
|
|
181 $( this ).click();
|
|
|
182 }
|
|
|
183 });
|
|
|
184 }
|
|
|
185 }
|
|
|
186
|
|
|
187 // TODO: pull out $.Widget's handling for the disabled option into
|
|
|
188 // $.Widget.prototype._setOptionDisabled so it's easy to proxy and can
|
|
|
189 // be overridden by individual plugins
|
|
|
190 this._setOption( "disabled", options.disabled );
|
|
|
191 this._resetButton();
|
|
|
192 },
|
|
|
193
|
|
|
194 _determineButtonType: function() {
|
|
|
195 var ancestor, labelSelector, checked;
|
|
|
196
|
|
|
197 if ( this.element.is("[type=checkbox]") ) {
|
|
|
198 this.type = "checkbox";
|
|
|
199 } else if ( this.element.is("[type=radio]") ) {
|
|
|
200 this.type = "radio";
|
|
|
201 } else if ( this.element.is("input") ) {
|
|
|
202 this.type = "input";
|
|
|
203 } else {
|
|
|
204 this.type = "button";
|
|
|
205 }
|
|
|
206
|
|
|
207 if ( this.type === "checkbox" || this.type === "radio" ) {
|
|
|
208 // we don't search against the document in case the element
|
|
|
209 // is disconnected from the DOM
|
|
|
210 ancestor = this.element.parents().last();
|
|
|
211 labelSelector = "label[for='" + this.element.attr("id") + "']";
|
|
|
212 this.buttonElement = ancestor.find( labelSelector );
|
|
|
213 if ( !this.buttonElement.length ) {
|
|
|
214 ancestor = ancestor.length ? ancestor.siblings() : this.element.siblings();
|
|
|
215 this.buttonElement = ancestor.filter( labelSelector );
|
|
|
216 if ( !this.buttonElement.length ) {
|
|
|
217 this.buttonElement = ancestor.find( labelSelector );
|
|
|
218 }
|
|
|
219 }
|
|
|
220 this.element.addClass( "ui-helper-hidden-accessible" );
|
|
|
221
|
|
|
222 checked = this.element.is( ":checked" );
|
|
|
223 if ( checked ) {
|
|
|
224 this.buttonElement.addClass( "ui-state-active" );
|
|
|
225 }
|
|
|
226 this.buttonElement.prop( "aria-pressed", checked );
|
|
|
227 } else {
|
|
|
228 this.buttonElement = this.element;
|
|
|
229 }
|
|
|
230 },
|
|
|
231
|
|
|
232 widget: function() {
|
|
|
233 return this.buttonElement;
|
|
|
234 },
|
|
|
235
|
|
|
236 _destroy: function() {
|
|
|
237 this.element
|
|
|
238 .removeClass( "ui-helper-hidden-accessible" );
|
|
|
239 this.buttonElement
|
|
|
240 .removeClass( baseClasses + " ui-state-active " + typeClasses )
|
|
|
241 .removeAttr( "role" )
|
|
|
242 .removeAttr( "aria-pressed" )
|
|
|
243 .html( this.buttonElement.find(".ui-button-text").html() );
|
|
|
244
|
|
|
245 if ( !this.hasTitle ) {
|
|
|
246 this.buttonElement.removeAttr( "title" );
|
|
|
247 }
|
|
|
248 },
|
|
|
249
|
|
|
250 _setOption: function( key, value ) {
|
|
|
251 this._super( key, value );
|
|
|
252 if ( key === "disabled" ) {
|
|
|
253 this.element.prop( "disabled", !!value );
|
|
|
254 if ( value ) {
|
|
|
255 this.buttonElement.removeClass( "ui-state-focus" );
|
|
|
256 }
|
|
|
257 return;
|
|
|
258 }
|
|
|
259 this._resetButton();
|
|
|
260 },
|
|
|
261
|
|
|
262 refresh: function() {
|
|
|
263 //See #8237 & #8828
|
|
|
264 var isDisabled = this.element.is( "input, button" ) ? this.element.is( ":disabled" ) : this.element.hasClass( "ui-button-disabled" );
|
|
|
265
|
|
|
266 if ( isDisabled !== this.options.disabled ) {
|
|
|
267 this._setOption( "disabled", isDisabled );
|
|
|
268 }
|
|
|
269 if ( this.type === "radio" ) {
|
|
|
270 radioGroup( this.element[0] ).each(function() {
|
|
|
271 if ( $( this ).is( ":checked" ) ) {
|
|
|
272 $( this ).button( "widget" )
|
|
|
273 .addClass( "ui-state-active" )
|
|
|
274 .attr( "aria-pressed", "true" );
|
|
|
275 } else {
|
|
|
276 $( this ).button( "widget" )
|
|
|
277 .removeClass( "ui-state-active" )
|
|
|
278 .attr( "aria-pressed", "false" );
|
|
|
279 }
|
|
|
280 });
|
|
|
281 } else if ( this.type === "checkbox" ) {
|
|
|
282 if ( this.element.is( ":checked" ) ) {
|
|
|
283 this.buttonElement
|
|
|
284 .addClass( "ui-state-active" )
|
|
|
285 .attr( "aria-pressed", "true" );
|
|
|
286 } else {
|
|
|
287 this.buttonElement
|
|
|
288 .removeClass( "ui-state-active" )
|
|
|
289 .attr( "aria-pressed", "false" );
|
|
|
290 }
|
|
|
291 }
|
|
|
292 },
|
|
|
293
|
|
|
294 _resetButton: function() {
|
|
|
295 if ( this.type === "input" ) {
|
|
|
296 if ( this.options.label ) {
|
|
|
297 this.element.val( this.options.label );
|
|
|
298 }
|
|
|
299 return;
|
|
|
300 }
|
|
|
301 var buttonElement = this.buttonElement.removeClass( typeClasses ),
|
|
|
302 buttonText = $( "<span></span>", this.document[0] )
|
|
|
303 .addClass( "ui-button-text" )
|
|
|
304 .html( this.options.label )
|
|
|
305 .appendTo( buttonElement.empty() )
|
|
|
306 .text(),
|
|
|
307 icons = this.options.icons,
|
|
|
308 multipleIcons = icons.primary && icons.secondary,
|
|
|
309 buttonClasses = [];
|
|
|
310
|
|
|
311 if ( icons.primary || icons.secondary ) {
|
|
|
312 if ( this.options.text ) {
|
|
|
313 buttonClasses.push( "ui-button-text-icon" + ( multipleIcons ? "s" : ( icons.primary ? "-primary" : "-secondary" ) ) );
|
|
|
314 }
|
|
|
315
|
|
|
316 if ( icons.primary ) {
|
|
|
317 buttonElement.prepend( "<span class='ui-button-icon-primary ui-icon " + icons.primary + "'></span>" );
|
|
|
318 }
|
|
|
319
|
|
|
320 if ( icons.secondary ) {
|
|
|
321 buttonElement.append( "<span class='ui-button-icon-secondary ui-icon " + icons.secondary + "'></span>" );
|
|
|
322 }
|
|
|
323
|
|
|
324 if ( !this.options.text ) {
|
|
|
325 buttonClasses.push( multipleIcons ? "ui-button-icons-only" : "ui-button-icon-only" );
|
|
|
326
|
|
|
327 if ( !this.hasTitle ) {
|
|
|
328 buttonElement.attr( "title", $.trim( buttonText ) );
|
|
|
329 }
|
|
|
330 }
|
|
|
331 } else {
|
|
|
332 buttonClasses.push( "ui-button-text-only" );
|
|
|
333 }
|
|
|
334 buttonElement.addClass( buttonClasses.join( " " ) );
|
|
|
335 }
|
|
|
336 });
|
|
|
337
|
|
|
338 $.widget( "ui.buttonset", {
|
|
|
339 version: "1.10.4",
|
|
|
340 options: {
|
|
|
341 items: "button, input[type=button], input[type=submit], input[type=reset], input[type=checkbox], input[type=radio], a, :data(ui-button)"
|
|
|
342 },
|
|
|
343
|
|
|
344 _create: function() {
|
|
|
345 this.element.addClass( "ui-buttonset" );
|
|
|
346 },
|
|
|
347
|
|
|
348 _init: function() {
|
|
|
349 this.refresh();
|
|
|
350 },
|
|
|
351
|
|
|
352 _setOption: function( key, value ) {
|
|
|
353 if ( key === "disabled" ) {
|
|
|
354 this.buttons.button( "option", key, value );
|
|
|
355 }
|
|
|
356
|
|
|
357 this._super( key, value );
|
|
|
358 },
|
|
|
359
|
|
|
360 refresh: function() {
|
|
|
361 var rtl = this.element.css( "direction" ) === "rtl";
|
|
|
362
|
|
|
363 this.buttons = this.element.find( this.options.items )
|
|
|
364 .filter( ":ui-button" )
|
|
|
365 .button( "refresh" )
|
|
|
366 .end()
|
|
|
367 .not( ":ui-button" )
|
|
|
368 .button()
|
|
|
369 .end()
|
|
|
370 .map(function() {
|
|
|
371 return $( this ).button( "widget" )[ 0 ];
|
|
|
372 })
|
|
|
373 .removeClass( "ui-corner-all ui-corner-left ui-corner-right" )
|
|
|
374 .filter( ":first" )
|
|
|
375 .addClass( rtl ? "ui-corner-right" : "ui-corner-left" )
|
|
|
376 .end()
|
|
|
377 .filter( ":last" )
|
|
|
378 .addClass( rtl ? "ui-corner-left" : "ui-corner-right" )
|
|
|
379 .end()
|
|
|
380 .end();
|
|
|
381 },
|
|
|
382
|
|
|
383 _destroy: function() {
|
|
|
384 this.element.removeClass( "ui-buttonset" );
|
|
|
385 this.buttons
|
|
|
386 .map(function() {
|
|
|
387 return $( this ).button( "widget" )[ 0 ];
|
|
|
388 })
|
|
|
389 .removeClass( "ui-corner-left ui-corner-right" )
|
|
|
390 .end()
|
|
|
391 .button( "destroy" );
|
|
|
392 }
|
|
|
393 });
|
|
|
394
|
|
|
395 }( jQuery ) );
|
