MediaWiki:Gadget-CollapsibleNav.js

/** * Collapsible navigation for Timeless, based on the Collapsible Navigation from Vector. * @source /core/skins/vector/collapsibleNav.js */ ( function {	'use strict';

// Use the same function for all navigation headings - don't repeat function toggle( $element, forceSetting ) { var isCollapsed = $element.parent.is( '.collapsed' );

if (forceSetting == 'expand' && !isCollapsed			|| forceSetting == 'close' && isCollapsed) { return; }

$.cookie(			'timeless-nav-' + $element.parent.attr( 'id' ),			isCollapsed,			{ 'expires': 30, 'path': '/' }		);

$element .parent .toggleClass( 'expanded' ) .toggleClass( 'collapsed' ) .find( '.mw-portlet-body' ) .slideToggle( 'fast' ); isCollapsed = !isCollapsed;

$element .find( '> a' ) .attr( {				'aria-pressed': isCollapsed ? 'false' : 'true',				'aria-expanded': isCollapsed ? 'false' : 'true'			} ); }

$( function ( $ ) {		var $headings, tabIndex;

/* General Portal Modification */

// Apply a class to the entire panel to activate styles $( '#site-navigation' ).addClass( 'collapsible-nav' ); $( '#site-navigation > .sidebar-inner > div > h3' ).addClass( 'collapsible-nav-header' ); // Use cookie data to restore preferences of what to show and hide $( '#site-navigation .mw-portlet' ) .each( function ( i ) {				var id = $(this).attr( 'id' ),					state = $.cookie( 'timeless-nav-' + id );				$(this).find( 'ul:first' ).attr( 'id', id + '-list' );				// Add anchor tag to heading for better accessibility				$( this ).find( 'h3' ).wrapInner( $( '' ) .attr( {							href: '#',							'aria-haspopup': 'true',							'aria-controls': id + '-list',							role: 'button'						} ) .click( false ) );				// In the case that we are not showing the new version, let's show the languages by default				if ( state === 'true' || state === null ) {					$(this)						.addClass( 'expanded' )						.removeClass( 'collapsed' )						.find( '.mw-portlet-body' )						.hide // bug 34450						.show;					$(this).find( 'h3 > a' )						.attr( { 'aria-pressed': 'true', 'aria-expanded': 'true' } );				} else {					$(this)						.addClass( 'collapsed' )						.removeClass( 'expanded' );					$(this).find( 'h3 > a' )						.attr( { 'aria-pressed': 'false', 'aria-expanded': 'false' } );				}				// Re-save cookie				if ( state !== null ) {					$.cookie( 'timeless-nav-' + $(this).attr( 'id' ), state, { 'expires': 30, 'path': '/' } );				}			} );

/* Tab Indexing */

$headings = $( '#site-navigation .mw-portlet > h3' );

// Make it keyboard accessible $headings.attr( 'tabindex', '0' );

// Toggle the selected menu's class and expand or collapse the menu $( '#site-navigation' ) .on( 'keydown', '.mw-portlet > h3', function ( e ) {				// Make the space and enter keys act as a click				if ( e.which === 13 /* Enter */ || e.which === 32 /* Space */ ) {					toggle( $(this) );				}			} ) .on( 'mousedown', '.mw-portlet > h3', function ( e ) {				if ( e.which !== 3 ) { // Right mouse click					toggle( $(this) );					$(this).blur;				}				return false;			} ); });		var navigationPortletExpandState = $.cookie( 'timeless-nav-p-navigation' );		var toggleText = 'Close All';		if (navigationPortletExpandState !== 'true' && navigationPortletExpandState !== null) {			toggleText = 'Expand All';		}		$( '#site-navigation > .sidebar-inner' ).prepend("" + toggleText + " ");		$("#sidebar-collapsible-toggle").click(function { if($("#sidebar-collapsible-toggle").text == "Expand All") { $("#sidebar-collapsible-toggle").text("Close All"); $( '#site-navigation .mw-portlet > h3' ).each( function ( i ) {					toggle( $(this), 'expand');				} ); $.cookie(					'timeless-nav-text-toggle',					true,					{ 'expires': 30, 'path': '/' }				); } else { $("#sidebar-collapsible-toggle").text("Expand All"); $( '#site-navigation .mw-portlet > h3' ).each( function ( i ) {					toggle( $(this), 'close');				} ); $.cookie(					'timeless-nav-text-toggle',					false,					{ 'expires': 30, 'path': '/' }				); }		}); } );