MediaWiki:Common.js: Unterschied zwischen den Versionen
(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 );

