מדיה ויקי:Gadget-foldPortalMenus.js

$( function() {
	"use strict";

	var storageKey = 'sidemenuFolded',
		skin = mw.config.get( 'skin' ),
		portalSelector,
		bodySelector,
		storage = $.jStorage.storageAvailable(),
		origFolded = [],
		heights = {},
		toggleElement = function( elem ) {
			var id = elem.closest( portalSelector ).attr( 'id' ),
				hide = ! elem.hasClass( 'foldmenu-folded' );
			elem.toggleClass( 'foldmenu-expanded', ! hide )
				.toggleClass('foldmenu-folded', hide )
				.siblings( bodySelector ).stop( true ).animate( { maxHeight: hide ? 0 : heights[id] } );
			updateState();
		},
		updateState = function() {
			if (! storage)
				return;
			var folded = [];
			$( portalSelector + ' h3.foldmenu-folded' ).each( function( id, item ) {
				folded.push( $( item ).closest( portalSelector ).attr( 'id' ) );
			});
			Storage[storageKey] = folded;
		},
		preparePortalBody = function( index, elem ) {
			var $elem = $( elem ),
				id = $elem.closest( portalSelector ).attr( 'id' ),
				height = $elem.height();
			$elem.css( 'max-height', $elem.height() );
			heights[id] = height;
		},
		prepareHeader = function( selector ) {
			$( selector )
				.addClass( 'foldmenu-expanded' )
				.prepend( $('<span>', { 'class': 'plus' } ).text( '+' ) )
				.prepend( $('<span>', { 'class': 'minus' } ).text( '-' ) )
				.click( function() { toggleElement( $(this) ) } );
		},
		recalcHeights = function() {
			$( portalSelector + ' ' + bodySelector ).each( function() {
				var $div = $( this ),
					id = $div.closest( 'div.portal' ).attr( 'id' ),
					clone = $div.clone()
						.css( { maxHeight: 50000, left: -5000, display: 'block' } )
						.appendTo( 'body' ),
					height = heights[id] = Math.max( (heights[id] || 0), clone.height() );
				$div.css( { maxHeight: height } );
				clone.remove();
			});
			restoreState();
		},
		restoreState = function() {
			if (storage) {
				origFolded = Storage[storageKey] || [];
				$( origFolded ).each(function( index, item ) {
					toggleElement( $( portalSelector + '#' + item ).find( 'h3:first' ) );
				});
			}
		};

	switch( skin ) {
		case 'vector':
			portalSelector = 'div.portal';
			bodySelector = 'div.body';
			break;
		case 'monobook':
			portalSelector = 'div.portlet';
			bodySelector = 'div.pBody';
			break;
		default:
			return;
	}
	
	$( portalSelector + ' h3#p-navigation-label' ).toggle( true );
	$( portalSelector + ' ' + bodySelector ).each( preparePortalBody );
	prepareHeader( portalSelector + ' h3' );
	restoreState();
	
	$( document ).on( 'new-portlet-link', function( event, portalId ) {
		recalcHeights();
		if ( ! portalId )
			return;
		var ps = '#' + portalId;
		preparePortalBody( 0, ps );
		prepareHeader( ps + ' h3' );
		if ( $.inArray( portalId, origFolded ) + 1 )
			toggleElement( $( ps ).find( 'h3:first' ) );
	});
});