User:Bulbasaur2019/hydra.js

/** * Vector-specific scripts */ jQuery( function ( $ ) {

/**	 * Collapsible tabs */	var $cactions = $( '#p-cactions' ), $tabContainer = $( '#p-views ul' ), originalDropdownWidth = $cactions.width;

/**	 * Focus search input at the very end */	$( '#searchInput' ).attr( 'tabindex', $( document ).lastTabIndex + 1 );

/**	 * Dropdown menu accessibility */	$( 'div.vectorMenu' ).each( function {		var $el = $( this );		$el.find( '> h3 > a' ).parent			.attr( 'tabindex', '0' )			// For accessibility, show the menu when the h3 is clicked (bug 24298/46486)			.on( 'click keypress', function ( e ) { if ( e.type === 'click' || e.which === 13 ) { $el.toggleClass( 'menuForceShow' ); e.preventDefault; }			} )			// When the heading has focus, also set a class that will change the arrow icon			.focus( function { $el.find( '> a' ).addClass( 'vectorMenuFocus' ); } )			.blur( function { $el.find( '> a' ).removeClass( 'vectorMenuFocus' ); } )			.find( '> a:first' )			// As the h3 can already be focused there's no need for the link to be focusable			.attr( 'tabindex', '-1' );	} );

// Bind callback functions to animate our drop down menu in and out // and then call the collapsibleTabs function on the menu $tabContainer .bind( 'beforeTabCollapse', function {			// If the dropdown was hidden, show it			if ( $cactions.hasClass( 'emptyPortlet' ) ) {				$cactions					.removeClass( 'emptyPortlet' )					.find( 'h3' )						.css( 'width', '1px' ).animate( { width: originalDropdownWidth }, 'normal' );			}		} ) .bind( 'beforeTabExpand', function {			// If we're removing the last child node right now, hide the dropdown			if ( $cactions.find( 'li' ).length === 1 ) {				$cactions.find( 'h3' ).animate( { width: '1px' }, 'normal', function  { $( this ).attr( 'style', '' ) .parent.addClass( 'emptyPortlet' ); } );			}		} )		.collapsibleTabs( {			expandCondition: function ( eleWidth ) {				// (This looks a bit awkward because we're doing expensive queries as late as possible.)

var distance = $.collapsibleTabs.calculateTabDistance; // If there are at least eleWidth + 1 pixels of free space, expand. // We add 1 because .width will truncate fractional values but .offset will not. if ( distance >= eleWidth + 1 ) { return true; } else { // Maybe we can still expand? Account for the width of the "Actions" dropdown if the // expansion would hide it. if ( $cactions.find( 'li' ).length === 1 ) { return distance >= eleWidth + 1 - originalDropdownWidth; } else { return false; }				}			},			collapseCondition: function { // (This looks a bit awkward because we're doing expensive queries as late as possible.) // TODO The dropdown itself should probably "fold" to just the down-arrow (hiding the text) // if it can't fit on the line?

// If there's an overlap, collapse. if ( $.collapsibleTabs.calculateTabDistance < 0 ) { // But only if the width of the tab to collapse is smaller than the width of the dropdown // we would have to insert. An example language where this happens is Lithuanian (lt). if ( $cactions.hasClass( 'emptyPortlet' ) ) { return $tabContainer.children( 'li.collapsible:last' ).width > originalDropdownWidth; } else { return true; }				} else { return false; }			}		} ); } );