Difference between revisions of "MediaWiki:Common.js"
From PinataIsland.info, the Viva Piñata wiki
FeralKitty (talk | contribs) (Collapsible tables code from meta.wikimedia.org) |
FeralKitty (talk | contribs) (Update collapsible table support) |
||
Line 1: | Line 1: | ||
/* Any JavaScript here will be loaded for all users on every page load. */ | /* Any JavaScript here will be loaded for all users on every page load. */ | ||
− | /** Collapsible tables ********************************************************* | + | |
− | + | /* 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); | |
− | + | }; | |
− | + | })(); | |
− | + | ||
− | if ( | + | |
− | + | /** Collapsible tables ********************************************************* | |
+ | * | ||
+ | * 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 ); | |
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− |
Revision as of 21:35, 28 May 2008
/* Any JavaScript here will be loaded for all users on every page load. */ /* 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); }; })(); /** Collapsible tables ********************************************************* * * 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 );