Difference between revisions of "MediaWiki:Common.js"
Jump to navigation
Jump to search
Line 1: | Line 1: | ||
/** Collapsible tables ********************************************************* |
/** Collapsible tables ********************************************************* |
||
* |
* |
||
+ | * From English Wikipedia, 2008-09-15 |
||
− | * Description: Allows tables to be collapsed, showing only the header. See |
||
+ | * @deprecated: Do not use this in new constructions, use class="mw-collapsible" instead |
||
− | * http://www.mediawiki.org/wiki/Manual:Collapsible_tables. |
||
+ | * |
||
− | * Maintainers: [[en:User:R. Koot]] |
||
+ | * Description: Allows tables to be collapsed, showing only the header. |
||
+ | * See [[Wikipedia:NavFrame]]. |
||
+ | * Maintainers: [[User:R. Koot]] |
||
*/ |
*/ |
||
− | |||
var autoCollapse = 2; |
var autoCollapse = 2; |
||
var collapseCaption = 'hide'; |
var collapseCaption = 'hide'; |
||
Line 11: | Line 13: | ||
function collapseTable( tableIndex ) { |
function collapseTable( tableIndex ) { |
||
− | + | var Button = document.getElementById( 'collapseButton' + tableIndex ); |
|
− | + | var Table = document.getElementById( 'collapsibleTable' + tableIndex ); |
|
− | + | if ( !Table || !Button ) { |
|
− | + | return false; |
|
+ | } |
||
− | } |
||
− | + | var Rows = Table.rows; |
|
− | + | if ( Button.firstChild.data == collapseCaption ) { |
|
− | + | for ( var i = 1; i < Rows.length; i++ ) { |
|
− | + | Rows[i].style.display = 'none'; |
|
+ | } |
||
− | } |
||
− | + | Button.firstChild.data = expandCaption; |
|
− | + | } else { |
|
− | + | for ( var i = 1; i < Rows.length; i++ ) { |
|
− | + | Rows[i].style.display = Rows[0].style.display; |
|
+ | } |
||
− | } |
||
− | + | Button.firstChild.data = collapseCaption; |
|
+ | } |
||
− | } |
||
} |
} |
||
− | function createCollapseButtons() |
+ | function createCollapseButtons(){ |
− | + | var tableIndex = 0; |
|
− | + | var NavigationBoxes = new Object(); |
|
− | + | var Tables = document.getElementsByTagName( 'table' ); |
|
− | + | for ( var i = 0; i < Tables.length; i++ ) { |
|
− | + | if ( hasClass( Tables[i], 'collapsible' ) ) { |
|
+ | /* only add button and increment count if there is a header row to work with */ |
||
+ | var HeaderRow = Tables[i].getElementsByTagName( 'tr' )[0]; |
||
+ | if( !HeaderRow ) { |
||
+ | continue; |
||
+ | } |
||
+ | var Header = HeaderRow.getElementsByTagName( 'th' )[0]; |
||
+ | if( !Header ) { |
||
+ | continue; |
||
+ | } |
||
+ | NavigationBoxes[tableIndex] = Tables[i]; |
||
− | /* only add button and increment count if there is a header row to work with */ |
||
+ | Tables[i].setAttribute( 'id', 'collapsibleTable' + tableIndex ); |
||
− | var HeaderRow = Tables[i].getElementsByTagName( 'tr' )[0]; |
||
− | if ( !HeaderRow ) { |
||
− | continue; |
||
− | } |
||
− | var Header = HeaderRow.getElementsByTagName( 'th' )[0]; |
||
− | if ( !Header ) { |
||
− | continue; |
||
− | } |
||
+ | var Button = document.createElement( 'span' ); |
||
− | NavigationBoxes[tableIndex] = Tables[i]; |
||
+ | var ButtonLink = document.createElement( 'a' ); |
||
− | Tables[i].setAttribute( 'id', 'collapsibleTable' + tableIndex ); |
||
+ | var ButtonText = document.createTextNode( collapseCaption ); |
||
+ | Button.style.styleFloat = 'right'; |
||
− | var Button = document.createElement( 'span' ); |
||
+ | Button.style.cssFloat = 'right'; |
||
− | var ButtonLink = document.createElement( 'a' ); |
||
+ | Button.style.fontWeight = 'normal'; |
||
− | var ButtonText = document.createTextNode( collapseCaption ); |
||
+ | Button.style.textAlign = 'right'; |
||
+ | Button.style.width = '6em'; |
||
+ | ButtonLink.style.color = Header.style.color; |
||
− | Button.className = 'collapseButton'; // Styles are declared in [[MediaWiki:Common.css]] |
||
+ | ButtonLink.setAttribute( 'id', 'collapseButton' + tableIndex ); |
||
+ | ButtonLink.setAttribute( 'href', "javascript:collapseTable(" + tableIndex + ");" ); |
||
+ | ButtonLink.appendChild( ButtonText ); |
||
+ | Button.appendChild( document.createTextNode( '[' ) ); |
||
− | ButtonLink.style.color = Header.style.color; |
||
+ | Button.appendChild( ButtonLink ); |
||
− | ButtonLink.setAttribute( 'id', 'collapseButton' + tableIndex ); |
||
+ | Button.appendChild( document.createTextNode( ']' ) ); |
||
− | ButtonLink.setAttribute( 'href', "javascript:collapseTable(" + tableIndex + ");" ); |
||
− | ButtonLink.appendChild( ButtonText ); |
||
+ | Header.insertBefore( Button, Header.childNodes[0] ); |
||
− | Button.appendChild( document.createTextNode( '[' ) ); |
||
+ | tableIndex++; |
||
− | Button.appendChild( ButtonLink ); |
||
+ | } |
||
− | Button.appendChild( document.createTextNode( ']' ) ); |
||
+ | } |
||
+ | for ( var i = 0; i < tableIndex; i++ ) { |
||
− | Header.insertBefore( Button, Header.childNodes[0] ); |
||
+ | if ( hasClass( NavigationBoxes[i], 'collapsed' ) || ( tableIndex >= autoCollapse && hasClass( NavigationBoxes[i], 'autocollapse' ) ) ) { |
||
− | tableIndex++; |
||
+ | collapseTable( i ); |
||
− | } |
||
+ | } |
||
− | } |
||
− | + | } |
|
− | for ( var i = 0; i < tableIndex; i++ ) { |
||
− | if ( hasClass( NavigationBoxes[i], 'collapsed' ) || ( tableIndex >= autoCollapse && hasClass( NavigationBoxes[i], 'autocollapse' ) ) ) { |
||
− | collapseTable( i ); |
||
− | } else if ( hasClass( NavigationBoxes[i], 'innercollapse' ) ) { |
||
− | var element = NavigationBoxes[i]; |
||
− | while ( element = element.parentNode ) { |
||
− | if ( hasClass( element, 'outercollapse' ) ) { |
||
− | collapseTable( i ); |
||
− | break; |
||
− | } |
||
− | } |
||
− | } |
||
− | } |
||
} |
} |
||
addOnloadHook( createCollapseButtons ); |
addOnloadHook( createCollapseButtons ); |
||
− | |||
− | /** Test if an element has a certain class ************************************** |
||
− | * |
||
− | * Description: Uses regular expressions and caching for better performance. |
||
− | * Maintainers: [[User:Mike Dillon]], [[User:R. Koot]], [[User:SG]] |
||
− | */ |
||
− | |||
− | var hasClass = ( function() { |
||
− | var reCache = {}; |
||
− | return function( element, className ) { |
||
− | return ( reCache[className] ? reCache[className] : ( reCache[className] = new RegExp( "(?:\\s|^)" + className + "(?:\\s|$)" ) ) ).test( element.className ); |
||
− | }; |
||
− | })(); |
Revision as of 15:06, 28 June 2012
/** Collapsible tables ********************************************************* * * From English Wikipedia, 2008-09-15 * @deprecated: Do not use this in new constructions, use class="mw-collapsible" instead * * Description: Allows tables to be collapsed, showing only the header. * See [[Wikipedia:NavFrame]]. * Maintainers: [[User:R. Koot]] */ var autoCollapse = 2; var collapseCaption = 'hide'; var expandCaption = 'show'; function collapseTable( tableIndex ) { var Button = document.getElementById( 'collapseButton' + tableIndex ); var Table = document.getElementById( 'collapsibleTable' + tableIndex ); if ( !Table || !Button ) { return false; } var Rows = Table.rows; if ( Button.firstChild.data == collapseCaption ) { for ( var i = 1; i < Rows.length; i++ ) { Rows[i].style.display = 'none'; } Button.firstChild.data = expandCaption; } else { for ( var i = 1; i < Rows.length; i++ ) { Rows[i].style.display = Rows[0].style.display; } Button.firstChild.data = collapseCaption; } } function createCollapseButtons(){ var tableIndex = 0; var NavigationBoxes = new Object(); var Tables = document.getElementsByTagName( 'table' ); for ( var i = 0; i < Tables.length; i++ ) { if ( hasClass( Tables[i], 'collapsible' ) ) { /* only add button and increment count if there is a header row to work with */ var HeaderRow = Tables[i].getElementsByTagName( 'tr' )[0]; if( !HeaderRow ) { continue; } var Header = HeaderRow.getElementsByTagName( 'th' )[0]; if( !Header ) { continue; } NavigationBoxes[tableIndex] = Tables[i]; Tables[i].setAttribute( 'id', 'collapsibleTable' + tableIndex ); var Button = document.createElement( 'span' ); var ButtonLink = document.createElement( 'a' ); var ButtonText = document.createTextNode( collapseCaption ); Button.style.styleFloat = 'right'; Button.style.cssFloat = 'right'; Button.style.fontWeight = 'normal'; Button.style.textAlign = 'right'; Button.style.width = '6em'; ButtonLink.style.color = Header.style.color; ButtonLink.setAttribute( 'id', 'collapseButton' + tableIndex ); ButtonLink.setAttribute( 'href', "javascript:collapseTable(" + tableIndex + ");" ); ButtonLink.appendChild( ButtonText ); Button.appendChild( document.createTextNode( '[' ) ); Button.appendChild( ButtonLink ); Button.appendChild( document.createTextNode( ']' ) ); Header.insertBefore( Button, Header.childNodes[0] ); tableIndex++; } } for ( var i = 0; i < tableIndex; i++ ) { if ( hasClass( NavigationBoxes[i], 'collapsed' ) || ( tableIndex >= autoCollapse && hasClass( NavigationBoxes[i], 'autocollapse' ) ) ) { collapseTable( i ); } } } addOnloadHook( createCollapseButtons );