1 /*! |
1 /*! |
2 * jQuery UI Accordion 1.13.1 |
2 * jQuery UI Accordion 1.13.3 |
3 * http://jqueryui.com |
3 * https://jqueryui.com |
4 * |
4 * |
5 * Copyright jQuery Foundation and other contributors |
5 * Copyright OpenJS Foundation and other contributors |
6 * Released under the MIT license. |
6 * Released under the MIT license. |
7 * http://jquery.org/license |
7 * https://jquery.org/license |
8 */ |
8 */ |
9 |
9 |
10 //>>label: Accordion |
10 //>>label: Accordion |
11 //>>group: Widgets |
11 //>>group: Widgets |
12 /* eslint-disable max-len */ |
12 /* eslint-disable max-len */ |
13 //>>description: Displays collapsible content panels for presenting information in a limited amount of space. |
13 //>>description: Displays collapsible content panels for presenting information in a limited amount of space. |
14 /* eslint-enable max-len */ |
14 /* eslint-enable max-len */ |
15 //>>docs: http://api.jqueryui.com/accordion/ |
15 //>>docs: https://api.jqueryui.com/accordion/ |
16 //>>demos: http://jqueryui.com/accordion/ |
16 //>>demos: https://jqueryui.com/accordion/ |
17 //>>css.structure: ../../themes/base/core.css |
17 //>>css.structure: ../../themes/base/core.css |
18 //>>css.structure: ../../themes/base/accordion.css |
18 //>>css.structure: ../../themes/base/accordion.css |
19 //>>css.theme: ../../themes/base/theme.css |
19 //>>css.theme: ../../themes/base/theme.css |
20 |
20 |
21 ( function( factory ) { |
21 ( function( factory ) { |
24 if ( typeof define === "function" && define.amd ) { |
24 if ( typeof define === "function" && define.amd ) { |
25 |
25 |
26 // AMD. Register as an anonymous module. |
26 // AMD. Register as an anonymous module. |
27 define( [ |
27 define( [ |
28 "jquery", |
28 "jquery", |
29 "./core" |
29 "../version", |
|
30 "../keycode", |
|
31 "../unique-id", |
|
32 "../widget" |
30 ], factory ); |
33 ], factory ); |
31 } else { |
34 } else { |
32 |
35 |
33 // Browser globals |
36 // Browser globals |
34 factory( jQuery ); |
37 factory( jQuery ); |
35 } |
38 } |
36 } )( function( $ ) { |
39 } )( function( $ ) { |
37 "use strict"; |
40 "use strict"; |
38 |
41 |
39 return $.widget( "ui.accordion", { |
42 return $.widget( "ui.accordion", { |
40 version: "1.13.1", |
43 version: "1.13.3", |
41 options: { |
44 options: { |
42 active: 0, |
45 active: 0, |
43 animate: {}, |
46 animate: {}, |
44 classes: { |
47 classes: { |
45 "ui-accordion-header": "ui-corner-top", |
48 "ui-accordion-header": "ui-corner-top", |
202 length = this.headers.length, |
205 length = this.headers.length, |
203 currentIndex = this.headers.index( event.target ), |
206 currentIndex = this.headers.index( event.target ), |
204 toFocus = false; |
207 toFocus = false; |
205 |
208 |
206 switch ( event.keyCode ) { |
209 switch ( event.keyCode ) { |
207 case keyCode.RIGHT: |
210 case keyCode.RIGHT: |
208 case keyCode.DOWN: |
211 case keyCode.DOWN: |
209 toFocus = this.headers[ ( currentIndex + 1 ) % length ]; |
212 toFocus = this.headers[ ( currentIndex + 1 ) % length ]; |
210 break; |
213 break; |
211 case keyCode.LEFT: |
214 case keyCode.LEFT: |
212 case keyCode.UP: |
215 case keyCode.UP: |
213 toFocus = this.headers[ ( currentIndex - 1 + length ) % length ]; |
216 toFocus = this.headers[ ( currentIndex - 1 + length ) % length ]; |
214 break; |
217 break; |
215 case keyCode.SPACE: |
218 case keyCode.SPACE: |
216 case keyCode.ENTER: |
219 case keyCode.ENTER: |
217 this._eventHandler( event ); |
220 this._eventHandler( event ); |
218 break; |
221 break; |
219 case keyCode.HOME: |
222 case keyCode.HOME: |
220 toFocus = this.headers[ 0 ]; |
223 toFocus = this.headers[ 0 ]; |
221 break; |
224 break; |
222 case keyCode.END: |
225 case keyCode.END: |
223 toFocus = this.headers[ length - 1 ]; |
226 toFocus = this.headers[ length - 1 ]; |
224 break; |
227 break; |
225 } |
228 } |
226 |
229 |
227 if ( toFocus ) { |
230 if ( toFocus ) { |
228 $( event.target ).attr( "tabIndex", -1 ); |
231 $( event.target ).attr( "tabIndex", -1 ); |
229 $( toFocus ).attr( "tabIndex", 0 ); |
232 $( toFocus ).attr( "tabIndex", 0 ); |
242 var options = this.options; |
245 var options = this.options; |
243 this._processPanels(); |
246 this._processPanels(); |
244 |
247 |
245 // Was collapsed or no panel |
248 // Was collapsed or no panel |
246 if ( ( options.active === false && options.collapsible === true ) || |
249 if ( ( options.active === false && options.collapsible === true ) || |
247 !this.headers.length ) { |
250 !this.headers.length ) { |
248 options.active = false; |
251 options.active = false; |
249 this.active = $(); |
252 this.active = $(); |
250 |
253 |
251 // active false only when collapsible is true |
254 // active false only when collapsible is true |
252 } else if ( options.active === false ) { |
255 } else if ( options.active === false ) { |
253 this._activate( 0 ); |
256 this._activate( 0 ); |
254 |
257 |
255 // was active, but active panel is gone |
258 // was active, but active panel is gone |
256 } else if ( this.active.length && !$.contains( this.element[ 0 ], this.active[ 0 ] ) ) { |
259 } else if ( this.active.length && !$.contains( this.element[ 0 ], this.active[ 0 ] ) ) { |
257 |
260 |
258 // all remaining panel are disabled |
261 // all remaining panel are disabled |
259 if ( this.headers.length === this.headers.find( ".ui-state-disabled" ).length ) { |
262 if ( this.headers.length === this.headers.find( ".ui-state-disabled" ).length ) { |
260 options.active = false; |
263 options.active = false; |
261 this.active = $(); |
264 this.active = $(); |
262 |
265 |
263 // activate previous panel |
266 // activate previous panel |
264 } else { |
267 } else { |
265 this._activate( Math.max( 0, options.active - 1 ) ); |
268 this._activate( Math.max( 0, options.active - 1 ) ); |
266 } |
269 } |
267 |
270 |
268 // was active, active panel still exists |
271 // was active, active panel still exists |
269 } else { |
272 } else { |
270 |
273 |
271 // make sure active index is correct |
274 // make sure active index is correct |
272 options.active = this.headers.index( this.active ); |
275 options.active = this.headers.index( this.active ); |
273 } |
276 } |
320 panelId = panel.uniqueId().attr( "id" ); |
323 panelId = panel.uniqueId().attr( "id" ); |
321 header.attr( "aria-controls", panelId ); |
324 header.attr( "aria-controls", panelId ); |
322 panel.attr( "aria-labelledby", headerId ); |
325 panel.attr( "aria-labelledby", headerId ); |
323 } ) |
326 } ) |
324 .next() |
327 .next() |
325 .attr( "role", "tabpanel" ); |
328 .attr( "role", "tabpanel" ); |
326 |
329 |
327 this.headers |
330 this.headers |
328 .not( this.active ) |
331 .not( this.active ) |
329 .attr( { |
332 .attr( { |
330 "aria-selected": "false", |
333 "aria-selected": "false", |
331 "aria-expanded": "false", |
334 "aria-expanded": "false", |
332 tabIndex: -1 |
335 tabIndex: -1 |
333 } ) |
336 } ) |
334 .next() |
337 .next() |
335 .attr( { |
338 .attr( { |
336 "aria-hidden": "true" |
339 "aria-hidden": "true" |
337 } ) |
340 } ) |
338 .hide(); |
341 .hide(); |
339 |
342 |
340 // Make sure at least one header is in the tab order |
343 // Make sure at least one header is in the tab order |
341 if ( !this.active.length ) { |
344 if ( !this.active.length ) { |
342 this.headers.eq( 0 ).attr( "tabIndex", 0 ); |
345 this.headers.eq( 0 ).attr( "tabIndex", 0 ); |
343 } else { |
346 } else { |
452 |
455 |
453 event.preventDefault(); |
456 event.preventDefault(); |
454 |
457 |
455 if ( |
458 if ( |
456 |
459 |
457 // click on active header, but not collapsible |
460 // click on active header, but not collapsible |
458 ( clickedIsActive && !options.collapsible ) || |
461 ( clickedIsActive && !options.collapsible ) || |
459 |
462 |
460 // allow canceling activation |
463 // allow canceling activation |
461 ( this._trigger( "beforeActivate", event, eventData ) === false ) ) { |
464 ( this._trigger( "beforeActivate", event, eventData ) === false ) ) { |
462 return; |
465 return; |
463 } |
466 } |
464 |
467 |
465 options.active = collapsing ? false : this.headers.index( clicked ); |
468 options.active = collapsing ? false : this.headers.index( clicked ); |
466 |
469 |
532 } |
535 } |
533 |
536 |
534 toShow |
537 toShow |
535 .attr( "aria-hidden", "false" ) |
538 .attr( "aria-hidden", "false" ) |
536 .prev() |
539 .prev() |
537 .attr( { |
540 .attr( { |
538 "aria-selected": "true", |
541 "aria-selected": "true", |
539 "aria-expanded": "true", |
542 "aria-expanded": "true", |
540 tabIndex: 0 |
543 tabIndex: 0 |
541 } ); |
544 } ); |
542 }, |
545 }, |
543 |
546 |
544 _animate: function( toShow, toHide, data ) { |
547 _animate: function( toShow, toHide, data ) { |
545 var total, easing, duration, |
548 var total, easing, duration, |
546 that = this, |
549 that = this, |