MediaWiki:Gadget-MenuTabsToggle.js

/*  _____________________________________________________________________________ * |                                                                             | * |                    === WARNING: GLOBAL GADGET FILE ===                      | * |                  Changes to this page affect many users.                    | * | Please discuss changes on the talk page or on [[WT:Gadget]] before editing. | * |_____________________________________________________________________________| * * Toggle between dropdown menus and tabs. * * @dependencies mediawiki.cookie * @source en.wikipedia.org/wiki/MediaWiki:Gadget-MenuTabsToggle.js * @source imported as of 2011-10-04 from [[User:Edokter/MenuTabsToggle.js]] / [[User:Edokter/MenuTabsToggle.css]] * @revision 3.4 * @author: Edokter ([[User:Edokter]]) */$( document ).ready( function() {var portlet = [];var portletId = [];var portletToggle = [];var toggleDiv = '<div class="vectorToggle" id="$1"><span><a href="#"></a></span></div>';/* Portlets to exclude */var excludePortlets = [ 'p-namespaces', 'p-twinkle' ];/* MenuToTabs */function MenuToTabs( portlet, id ) {portlet.removeClass( 'vector-menu-dropdown' ).addClass( 'vector-menu-tabs' ).css( 'margin-left', '-1px' );portlet.find( 'li.icon-collapsed' ).removeClass( 'icon-collapsed' ).addClass( 'icon' );mw.cookie.set( id, 'tabs', { prefix: 'vector-tabs-' } );}/* TabsToMenu */function TabsToMenu( portlet, id ) {portlet.removeClass( 'vector-menu-tabs' ).addClass( 'vector-menu-dropdown' ).css( 'margin-left', '' );portlet.find( 'li.icon' ).removeClass( 'icon' ).addClass( 'icon-collapsed' );mw.cookie.set( id, 'menu', { prefix: 'vector-tabs-' } );}/* Initialize */if ( mw.config.get( 'skin' ) !== 'vector' ) {return;}// Unbind events from vector.js$( 'nav.vector-menu' ).find( 'h3' ).off();// Enumerate all portlets$( '.vector-menu-dropdown, .vector-menu-tabs' ).each( function(i) {portlet[i] = $( this );portletId[i] = portlet[i].attr( 'id' );// Skip excluded portletsif ( $.inArray( portletId[i], excludePortlets ) == -1 ) {// Disable collapsible tabsportlet[i].find( 'li.collapsible' ).removeClass( 'collapsible' );portletToggle[i] = $( toggleDiv.replace( '$1', portletId[i] + '-toggle' ) );// Left or right?if ( portlet[i].parent().attr( 'id' ) == 'left-navigation' ) {portletToggle[i].addClass( 'toggle-left' ).insertBefore( portlet[i].find( 'ul' ) );} else {portletToggle[i].addClass( 'toggle-right' ).insertAfter( portlet[i].find( 'ul' ) );}// Menu or Tabs?if ( portlet[i].hasClass( 'vector-menu-dropdown' ) ) {if ( mw.cookie.get( portletId[i], 'vector-tabs-' ) == 'tabs' ) {MenuToTabs( portlet[i], portletId[i] );}}else if ( portlet[i].hasClass( 'vector-menu-tabs' ) ) {portlet[i].find( 'h3' ).wrapInner( '<span></span>' ).append( '<a href="#"></a>' );if ( mw.cookie.get( portletId[i], 'vector-tabs-' ) == 'menu' ) {TabsToMenu( portlet[i], portletId[i] );}}// Assign key and mouse eventsportlet[i].on( 'click', 'h3 a', function( event ) {event.preventDefault();} );portlet[i].on( 'mousedown', 'h3 a', function( event ) {if ( event.which != 3 ) {var ul = portlet[i].find( 'ul' );ul.animate( { height: 'hide' }, 125, function() {MenuToTabs( portlet[i], portletId[i] );ul.animate( { width: 'show' }, 125 );} );}} );portletToggle[i].on( 'click', 'a', function( event ) {event.preventDefault();} );portletToggle[i].on( 'mousedown', 'a', function( event ) {if ( event.which != 3 ) {var ul = portlet[i].find( 'ul' );ul.animate( { width: 'hide' }, 125, function() {TabsToMenu( portlet[i], portletId[i] );ul.animate( { height: 'show' }, 125 );} );}} );}} );} );