מדיה ויקי:Gadget-MenuTabsToggle.js: הבדלים בין גרסאות בדף
קפיצה לניווט
קפיצה לחיפוש
(יצירת דף עם התוכן "/* _____________________________________________________________________________ * |...") |
אין תקציר עריכה |
||
שורה 26: | שורה 26: | ||
/* MenuToTabs */ | /* MenuToTabs */ | ||
function MenuToTabs( portlet, id ) { | function MenuToTabs( portlet, id ) { | ||
portlet.removeClass( ' | 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' ); | portlet.find( 'li.icon-collapsed' ).removeClass( 'icon-collapsed' ).addClass( 'icon' ); | ||
mw.cookie.set( id, 'tabs', { prefix: 'vector-tabs-' } ); | mw.cookie.set( id, 'tabs', { prefix: 'vector-tabs-' } ); | ||
שורה 33: | שורה 35: | ||
/* TabsToMenu */ | /* TabsToMenu */ | ||
function TabsToMenu( portlet, id ) { | function TabsToMenu( portlet, id ) { | ||
portlet.removeClass( ' | 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' ); | portlet.find( 'li.icon' ).removeClass( 'icon' ).addClass( 'icon-collapsed' ); | ||
mw.cookie.set( id, 'menu', { prefix: 'vector-tabs-' } ); | mw.cookie.set( id, 'menu', { prefix: 'vector-tabs-' } ); | ||
שורה 39: | שורה 43: | ||
/* Initialize */ | /* Initialize */ | ||
if ( mw.config.get( 'skin' ) | if ( !mw.config.get( 'skin' ) == 'vector' ) { | ||
return; | return; | ||
} | } | ||
// Unbind events from vector.js | // Unbind events from vector.js | ||
$( ' | $( 'div.vectorMenu' ).find( 'h3' ).off(); | ||
// Enumerate all portlets | // Enumerate all portlets | ||
$( '. | $( 'div.vectorMenu, div.vectorTabs' ).each( function(i) { | ||
portlet[i] = $( this ); | portlet[i] = $( this ); | ||
portletId[i] = portlet[i].attr( 'id' ); | portletId[i] = portlet[i].attr( 'id' ); | ||
שורה 70: | שורה 74: | ||
// Menu or Tabs? | // Menu or Tabs? | ||
if ( portlet[i].hasClass( ' | if ( portlet[i].hasClass( 'vectorMenu' ) ) { | ||
if ( mw.cookie.get( portletId[i], 'vector-tabs-' ) == 'tabs' ) { | if ( mw.cookie.get( portletId[i], 'vector-tabs-' ) == 'tabs' ) { | ||
MenuToTabs( portlet[i], portletId[i] ); | MenuToTabs( portlet[i], portletId[i] ); | ||
} | } | ||
} | } | ||
else if ( portlet[i].hasClass( ' | else if ( portlet[i].hasClass( 'vectorTabs' ) ) { | ||
portlet[i].find( 'h3' ) | portlet[i].find( 'h3' ) | ||
.wrapInner( '<span></span>' ) | .wrapInner( '<span></span>' ) |
גרסה אחרונה מ־17:09, 7 באוגוסט 2022
/* _____________________________________________________________________________ * | | * | === 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( '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' ); mw.cookie.set( id, 'tabs', { prefix: 'vector-tabs-' } ); } /* 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' ); mw.cookie.set( id, 'menu', { prefix: 'vector-tabs-' } ); } /* Initialize */ if ( !mw.config.get( 'skin' ) == 'vector' ) { return; } // Unbind events from vector.js $( 'div.vectorMenu' ).find( 'h3' ).off(); // Enumerate all portlets $( 'div.vectorMenu, div.vectorTabs' ).each( function(i) { portlet[i] = $( this ); portletId[i] = portlet[i].attr( 'id' ); // Skip excluded portlets if ( $.inArray( portletId[i], excludePortlets ) == -1 ) { // Disable collapsible tabs portlet[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( 'vectorMenu' ) ) { if ( mw.cookie.get( portletId[i], 'vector-tabs-' ) == 'tabs' ) { MenuToTabs( portlet[i], portletId[i] ); } } else if ( portlet[i].hasClass( 'vectorTabs' ) ) { 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 events portlet[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 ); } ); } } ); } } ); } );