Vector: Add the collapsibleTabs script from the Vector extension
[lhc/web/wiklou.git] / skins / vector / vector.js
1 /**
2 * Vector-specific scripts
3 */
4 jQuery( function ( $ ) {
5 $( 'div.vectorMenu' ).each( function () {
6 var $el = $( this );
7 $el.find( 'h3:first a:first' )
8 // For accessibility, show the menu when the hidden link in the menu is clicked (bug 24298)
9 .click( function ( e ) {
10 $el.find( '.menu:first' ).toggleClass( 'menuForceShow' );
11 e.preventDefault();
12 } )
13 // When the hidden link has focus, also set a class that will change the arrow icon
14 .focus( function () {
15 $el.addClass( 'vectorMenuFocus' );
16 } )
17 .blur( function () {
18 $el.removeClass( 'vectorMenuFocus' );
19 } );
20 } );
21
22 /**
23 * Collapsible tabs for Vector
24 */
25 var $cactions = $( '#p-cactions' );
26
27 // Bind callback functions to animate our drop down menu in and out
28 // and then call the collapsibleTabs function on the menu
29 $( '#p-views ul' )
30 .bind( 'beforeTabCollapse', function () {
31 // If the dropdown was hidden, show it
32 if ( $cactions.hasClass( 'emptyPortlet' ) ) {
33 $cactions
34 .removeClass( 'emptyPortlet' )
35 .find( 'h3, h5' )
36 .css( 'width', '1px' ).animate( { 'width': '24px' }, 390 );
37 }
38 } )
39 .bind( 'beforeTabExpand', function () {
40 // If we're removing the last child node right now, hide the dropdown
41 if ( $cactions.find( 'li' ).length === 1 ) {
42 $cactions.find( 'h3, h5' ).animate( { 'width': '1px' }, 390, function () {
43 $( this ).attr( 'style', '' )
44 .parent().addClass( 'emptyPortlet' );
45 });
46 }
47 } )
48 .collapsibleTabs();
49 } );