MediaWiki:Gadget-MenuToTabs.js
Jump to navigation
Jump to search
Want an adless experience? Log in or Create an account.
Note: After saving, you may have to bypass your browser's cache to see the changes.
- Firefox / Safari: hold Shift while clicking Reload, or press either Ctrl+F5 or Ctrl+R (Command+R on a Mac)
- Google Chrome: press Ctrl+Shift+R (Command+Shift+R on a Mac)
- Internet Explorer: hold Ctrl while clicking Refresh, or press Ctrl+F5
- Konqueror: click Reload or press F5
- Opera: clear the cache in Tools → Preferences
$( 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( 'vectorMenu' ).addClass( 'vectorTabs' ).css( 'margin-left', '-1px' ) .find( 'div.menu > ul' ).unwrap() .find( 'li > a' ).wrap( '<span></span>' ); portlet.find( 'li.icon-collapsed' ).removeClass( 'icon-collapsed' ).addClass( 'icon' ); $.cookie( 'vector-tabs-' + id, 'tabs', { expires: 30, path: '/' } ); } /* TabsToMenu */ function TabsToMenu( portlet, id ) { portlet.removeClass( 'vectorTabs' ).addClass( 'vectorMenu' ).css( 'margin-left', '' ) .find( 'ul' ).wrap( '<div class="menu"></div>' ) .find( 'span > a' ).unwrap(); portlet.find( 'li.icon' ).removeClass( 'icon' ).addClass( 'icon-collapsed' ); $.cookie( 'vector-tabs-' + id, 'menu', { expires: 30, path: '/' } ); } /* Initialize */ if ( !mw.config.get( 'skin' ) == 'vector' ) { return; } // Enumerate all instances of vectorMenu $( '.vectorMenu, .vectorTabs' ).each( function(i) { portlet[i] = $( this ); portletId[i] = portlet[i].attr( 'id' ); // Skip p-namespaces and other excluded portlets if ( $.inArray( portletId[i], excludePortlets ) == -1 ) { // Disable collapsible tabs portlet[i].find( 'li.collapsible' ) .removeClass( 'collapsible' ); // Left or right? if ( portlet[i].parent().attr( 'id' ) == 'left-navigation' ) { portletToggle[i] = $( toggleDiv .replace( '$1', portletId[i] + '-toggle' ) ) .addClass( 'toggle-left' ) .insertBefore( portlet[i].find( 'ul' ) ); } else { portletToggle[i] = $( toggleDiv .replace( '$1', portletId[i] + '-toggle' ) ) .addClass( 'toggle-right' ) .insertAfter( portlet[i].find( 'ul' ) ); } // Menu or Tabs? if ( portlet[i].hasClass( 'vectorMenu' ) ) { if ( $.cookie( 'vector-tabs-' + portletId[i] ) == 'tabs' ) { MenuToTabs( portlet[i], portletId[i] ); } } else if ( portlet[i].hasClass( 'vectorTabs' ) ) { portlet[i].find( 'h5' ) .wrapInner( '<span></span>' ) .append( '<a href="#"></a>' ); if ( $.cookie( 'vector-tabs-' + portletId[i] ) == 'menu' ) { TabsToMenu( portlet[i], portletId[i] ); } } // Assign click events portlet[i].find( 'h5 > a' ).click( function(e) { e.preventDefault(); var ul = portlet[i].find( 'ul' ); ul.animate( { height: 'hide' }, 125, function() { MenuToTabs( portlet[i], portletId[i] ); ul.animate( { width: 'show' }, 125 ); }); }); portletToggle[i].find( 'a' ).click( function(e) { e.preventDefault(); var ul = portlet[i].find( 'ul' ); ul.animate( { width: 'hide' }, 125, function() { TabsToMenu( portlet[i], portletId[i] ); ul.animate( { height: 'show' }, 125 ); }); }); } }); });