MediaWiki:Common.js: Unterschied zwischen den Versionen
Aus Stratum 0
(nee. Zu klobig.) |
(NavToggle, from Wikipedia) |
||
Zeile 1: | Zeile 1: | ||
− | /* | + | /** |
+ | * Dynamic Navigation Bars (experimental) | ||
+ | * Stolen from Wikipedia: https://en.wikipedia.org/wiki/MediaWiki:Common.js | ||
+ | * | ||
+ | * Description: See https://en.wikipedia.org/wiki/Wikipedia:NavFrame | ||
+ | * Maintainers: UNMAINTAINED | ||
+ | * Licence: CC-BY-SA-3.0 Unported | ||
+ | */ | ||
+ | |||
+ | /* set up the words in your language */ | ||
+ | var NavigationBarHide = '[ einklappen ]'; | ||
+ | var NavigationBarShow = '[ ausklappen ]'; | ||
+ | |||
+ | /** | ||
+ | * Shows and hides content and picture (if available) of navigation bars | ||
+ | * Parameters: | ||
+ | * indexNavigationBar: the index of navigation bar to be toggled | ||
+ | **/ | ||
+ | window.toggleNavigationBar = function ( indexNavigationBar, event ) { | ||
+ | var NavToggle = document.getElementById( 'NavToggle' + indexNavigationBar ); | ||
+ | var NavFrame = document.getElementById( 'NavFrame' + indexNavigationBar ); | ||
+ | var NavChild; | ||
+ | |||
+ | if ( !NavFrame || !NavToggle ) { | ||
+ | return false; | ||
+ | } | ||
+ | |||
+ | /* if shown now */ | ||
+ | if ( NavToggle.firstChild.data === NavigationBarHide ) { | ||
+ | for ( NavChild = NavFrame.firstChild; NavChild != null; NavChild = NavChild.nextSibling ) { | ||
+ | if ( $( NavChild ).hasClass( 'NavContent' ) || $( NavChild ).hasClass( 'NavPic' ) ) { | ||
+ | NavChild.style.display = 'none'; | ||
+ | } | ||
+ | } | ||
+ | NavToggle.firstChild.data = NavigationBarShow; | ||
+ | |||
+ | /* if hidden now */ | ||
+ | } else if ( NavToggle.firstChild.data === NavigationBarShow ) { | ||
+ | for ( NavChild = NavFrame.firstChild; NavChild != null; NavChild = NavChild.nextSibling ) { | ||
+ | if ( $( NavChild ).hasClass( 'NavContent' ) || $( NavChild ).hasClass( 'NavPic' ) ) { | ||
+ | NavChild.style.display = 'block'; | ||
+ | } | ||
+ | } | ||
+ | NavToggle.firstChild.data = NavigationBarHide; | ||
+ | } | ||
+ | |||
+ | event.preventDefault(); | ||
+ | }; | ||
+ | |||
+ | /* adds show/hide-button to navigation bars */ | ||
+ | function createNavigationBarToggleButton() { | ||
+ | var indexNavigationBar = 0; | ||
+ | var NavFrame; | ||
+ | var NavChild; | ||
+ | /* iterate over all < div >-elements */ | ||
+ | var divs = document.getElementsByTagName( 'div' ); | ||
+ | for ( var i = 0; (NavFrame = divs[i]); i++ ) { | ||
+ | /* if found a navigation bar */ | ||
+ | if ( $( NavFrame ).hasClass( 'NavFrame' ) ) { | ||
+ | |||
+ | indexNavigationBar++; | ||
+ | var NavToggle = document.createElement( 'a' ); | ||
+ | NavToggle.className = 'NavToggle'; | ||
+ | NavToggle.setAttribute( 'id', 'NavToggle' + indexNavigationBar ); | ||
+ | NavToggle.setAttribute( 'href', '#' ); | ||
+ | $( NavToggle ).on( 'click', $.proxy( window.toggleNavigationBar, window, indexNavigationBar ) ); | ||
+ | |||
+ | var isCollapsed = $( NavFrame ).hasClass( 'collapsed' ); | ||
+ | /** | ||
+ | * Check if any children are already hidden. This loop is here for backwards compatibility: | ||
+ | * the old way of making NavFrames start out collapsed was to manually add style="display:none" | ||
+ | * to all the NavPic/NavContent elements. Since this was bad for accessibility (no way to make | ||
+ | * the content visible without JavaScript support), the new recommended way is to add the class | ||
+ | * "collapsed" to the NavFrame itself, just like with collapsible tables. | ||
+ | */ | ||
+ | for ( NavChild = NavFrame.firstChild; NavChild != null && !isCollapsed; NavChild = NavChild.nextSibling ) { | ||
+ | if ( $( NavChild ).hasClass( 'NavPic' ) || $( NavChild ).hasClass( 'NavContent' ) ) { | ||
+ | if ( NavChild.style.display === 'none' ) { | ||
+ | isCollapsed = true; | ||
+ | } | ||
+ | } | ||
+ | } | ||
+ | if ( isCollapsed ) { | ||
+ | for ( NavChild = NavFrame.firstChild; NavChild != null; NavChild = NavChild.nextSibling ) { | ||
+ | if ( $( NavChild ).hasClass( 'NavPic' ) || $( NavChild ).hasClass( 'NavContent' ) ) { | ||
+ | NavChild.style.display = 'none'; | ||
+ | } | ||
+ | } | ||
+ | } | ||
+ | var NavToggleText = document.createTextNode( isCollapsed ? NavigationBarShow : NavigationBarHide ); | ||
+ | NavToggle.appendChild( NavToggleText ); | ||
+ | |||
+ | /* Find the NavHead and attach the toggle link (Must be this complicated because Moz's firstChild handling is borked) */ | ||
+ | for( var j = 0; j < NavFrame.childNodes.length; j++ ) { | ||
+ | if ( $( NavFrame.childNodes[j] ).hasClass( 'NavHead' ) ) { | ||
+ | NavToggle.style.color = NavFrame.childNodes[j].style.color; | ||
+ | NavFrame.childNodes[j].appendChild( NavToggle ); | ||
+ | } | ||
+ | } | ||
+ | NavFrame.setAttribute( 'id', 'NavFrame' + indexNavigationBar ); | ||
+ | } | ||
+ | } | ||
+ | } | ||
+ | |||
+ | $( createNavigationBarToggleButton ); |
Aktuelle Version vom 20. August 2013, 18:13 Uhr
/**
* Dynamic Navigation Bars (experimental)
* Stolen from Wikipedia: https://en.wikipedia.org/wiki/MediaWiki:Common.js
*
* Description: See https://en.wikipedia.org/wiki/Wikipedia:NavFrame
* Maintainers: UNMAINTAINED
* Licence: CC-BY-SA-3.0 Unported
*/
/* set up the words in your language */
var NavigationBarHide = '[ einklappen ]';
var NavigationBarShow = '[ ausklappen ]';
/**
* Shows and hides content and picture (if available) of navigation bars
* Parameters:
* indexNavigationBar: the index of navigation bar to be toggled
**/
window.toggleNavigationBar = function ( indexNavigationBar, event ) {
var NavToggle = document.getElementById( 'NavToggle' + indexNavigationBar );
var NavFrame = document.getElementById( 'NavFrame' + indexNavigationBar );
var NavChild;
if ( !NavFrame || !NavToggle ) {
return false;
}
/* if shown now */
if ( NavToggle.firstChild.data === NavigationBarHide ) {
for ( NavChild = NavFrame.firstChild; NavChild != null; NavChild = NavChild.nextSibling ) {
if ( $( NavChild ).hasClass( 'NavContent' ) || $( NavChild ).hasClass( 'NavPic' ) ) {
NavChild.style.display = 'none';
}
}
NavToggle.firstChild.data = NavigationBarShow;
/* if hidden now */
} else if ( NavToggle.firstChild.data === NavigationBarShow ) {
for ( NavChild = NavFrame.firstChild; NavChild != null; NavChild = NavChild.nextSibling ) {
if ( $( NavChild ).hasClass( 'NavContent' ) || $( NavChild ).hasClass( 'NavPic' ) ) {
NavChild.style.display = 'block';
}
}
NavToggle.firstChild.data = NavigationBarHide;
}
event.preventDefault();
};
/* adds show/hide-button to navigation bars */
function createNavigationBarToggleButton() {
var indexNavigationBar = 0;
var NavFrame;
var NavChild;
/* iterate over all < div >-elements */
var divs = document.getElementsByTagName( 'div' );
for ( var i = 0; (NavFrame = divs[i]); i++ ) {
/* if found a navigation bar */
if ( $( NavFrame ).hasClass( 'NavFrame' ) ) {
indexNavigationBar++;
var NavToggle = document.createElement( 'a' );
NavToggle.className = 'NavToggle';
NavToggle.setAttribute( 'id', 'NavToggle' + indexNavigationBar );
NavToggle.setAttribute( 'href', '#' );
$( NavToggle ).on( 'click', $.proxy( window.toggleNavigationBar, window, indexNavigationBar ) );
var isCollapsed = $( NavFrame ).hasClass( 'collapsed' );
/**
* Check if any children are already hidden. This loop is here for backwards compatibility:
* the old way of making NavFrames start out collapsed was to manually add style="display:none"
* to all the NavPic/NavContent elements. Since this was bad for accessibility (no way to make
* the content visible without JavaScript support), the new recommended way is to add the class
* "collapsed" to the NavFrame itself, just like with collapsible tables.
*/
for ( NavChild = NavFrame.firstChild; NavChild != null && !isCollapsed; NavChild = NavChild.nextSibling ) {
if ( $( NavChild ).hasClass( 'NavPic' ) || $( NavChild ).hasClass( 'NavContent' ) ) {
if ( NavChild.style.display === 'none' ) {
isCollapsed = true;
}
}
}
if ( isCollapsed ) {
for ( NavChild = NavFrame.firstChild; NavChild != null; NavChild = NavChild.nextSibling ) {
if ( $( NavChild ).hasClass( 'NavPic' ) || $( NavChild ).hasClass( 'NavContent' ) ) {
NavChild.style.display = 'none';
}
}
}
var NavToggleText = document.createTextNode( isCollapsed ? NavigationBarShow : NavigationBarHide );
NavToggle.appendChild( NavToggleText );
/* Find the NavHead and attach the toggle link (Must be this complicated because Moz's firstChild handling is borked) */
for( var j = 0; j < NavFrame.childNodes.length; j++ ) {
if ( $( NavFrame.childNodes[j] ).hasClass( 'NavHead' ) ) {
NavToggle.style.color = NavFrame.childNodes[j].style.color;
NavFrame.childNodes[j].appendChild( NavToggle );
}
}
NavFrame.setAttribute( 'id', 'NavFrame' + indexNavigationBar );
}
}
}
$( createNavigationBarToggleButton );