MediaWiki:Common.js

Version vom 31. Mai 2012, 19:18 Uhr

/* Das folgende JavaScript wird für alle Benutzer geladen. */

/** Collapsible tables *********************************************************
 *
 *  Description: Allows tables to be collapsed, showing only the header. See
 *                         http://www.mediawiki.org/wiki/Manual:Collapsible_tables.
 *  Maintainers: [[en:User:R. Koot]]
 */
 
var autoCollapse = 2;
var collapseCaption = 'Verstecken';
var expandCaption = 'Anzeigen';
 
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.className = 'collapseButton'; // Styles are declared in [[MediaWiki:Common.css]]
 
                        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 );
                } else if ( hasClass( NavigationBoxes[i], 'innercollapse' ) ) {
                        var element = NavigationBoxes[i];
                        while ( element = element.parentNode ) {
                                if ( hasClass( element, 'outercollapse' ) ) {
                                        collapseTable( i );
                                        break;
                                }
                        }
                }
        }
}
 
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 );
        };
})();

/* Das folgende JavaScript wird für alle Benutzer geladen. */

// Copyright (c) 2012 All Right Reserved, http://scharesoft.de
//
// All other rights reserved.
//
// THIS CODE AND INFORMATION ARE PROVIDED "AS IS" WITHOUT WARRANTY OF ANY 
// KIND, EITHER EXPRESSED OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE
// IMPLIED WARRANTIES OF MERCHANTABILITY AND/OR FITNESS FOR A
// PARTICULAR PURPOSE.
//
// Author: Johannes Schmidt (Death-Lord)
// Email: johannes.schmidt95@gmx.de
// Date: 2012-05-29
// Summary: Displays the first bar of a table. To let it work, a table have to have the class helpbar. Optimized for mediaWiki
// License: CC-BY, http://creativecommons.org/licenses/by/3.0/de/
// Version: 1.0.b-0001
try {
function getOffsetTop (Element){
	var top = 0;
 
	if(!Element) 
		return false;     
	if(typeof Element != 'object' ) 
		return false;

	if(typeof Element.offsetTop != 'undefined')    {         
		 while (Element && Element.tagName != 'BODY')         {
			top  += parseInt( Element.offsetTop );
			Element = Element.offsetParent;
		 } 
	}
	return top;
}
function getOffsetLeft (Element){
	var top = 0;
 
	if(!Element) 
		return false;
	if(typeof Element != 'object' ) 
		return false;

	if(typeof Element.offsetTop != 'undefined')    {         
		 while (Element && Element.tagName != 'BODY')         {
			top  += parseInt( Element.offsetLeft );
			Element = Element.offsetParent;
		 } 
	}
	return top;
}
function HelpBar() 
{
	// Display Errors, will set if user Errors will be triggered and displayed or not.
	this.DisplayErrors = true;	
	
	this.VirtualFirstRow = new Array();
	
	
	// bool HelpBar::checker(void)
	// Checks if help bar needed and display it.
	this.checker = function()
	{
		try {
			
			this.CountHelpBars = document.getElementsByClassName('HelpBar').length;
			// Check for all if have to display.
			for(i = 0; i < this.CountHelpBars; ++i) {
				document.getElementsByClassName('HelpBar')[i].setAttribute('style', 'margin-top: '+document.getElementsByClassName('HelpBar')[i].rows[0].offsetHeight+'px;');
				var TableOffsetTop = getOffsetTop(document.getElementsByClassName('HelpBar')[i]) - document.getElementsByClassName('HelpBar')[i].rows[0].offsetHeight;				
				
				// Check if above view
				if(TableOffsetTop < window.pageYOffset) {				
					// Now check if overscrolled.
					var TablePosition = TableOffsetTop + document.getElementsByClassName('HelpBar')[i].offsetHeight;					
					
					// if not proceed.
					if(TablePosition > window.pageYOffset) {										
						document.getElementsByClassName('HelpBar')[i].rows[0].setAttribute('style', 'margin-left: '+document.getElementsByClassName('HelpBar')[i].rows[0].getAttribute('margin-left')+'px;z-index: 2100;position: fixed; top: 0px;');
						var difference1 = TablePosition - window.pageYOffset;
						var difference2 = TableOffsetTop - window.pageYOffset;
						if(difference1 < 400 || difference2 > - 400) {							
							setTimeout('Bar.checker()', 10);		
						} else 
							setTimeout('Bar.checker()', 100);		
						return true;
					}
				} 
				
				var Top = document.getElementsByClassName('HelpBar')[i].offsetTop - document.getElementsByClassName('HelpBar')[i].rows[0].offsetHeight + 8;
				document.getElementsByClassName('HelpBar')[i].rows[0].setAttribute('style', 'margin-left: '+document.getElementsByClassName('HelpBar')[i].rows[0].getAttribute('margin-left')+'px;z-index: 2100;position: absolute; top: '+Top+'px;');
			}
			setTimeout('Bar.checker()', 10);		
			return false;
		} catch (Error) {			
			setTimeout('Bar.checker()', 1000);
			return false;
		}
	}
	
	/////////////////
	// Constructor //
	/////////////////
	
	this.browserSize = 0;
	this.construct = function() 
	{
		if (this.browserSize != window.innerWidth) {
			this.tables = new Array();
			// Check if the element is a table
			this.CountHelpBars = document.getElementsByClassName('HelpBar').length;
			for(i = 0; i < this.CountHelpBars; ++i) {
				// Check if table.
				if(document.getElementsByClassName('HelpBar')[i].tagName != 'TABLE') {
					if (this.DisplayErrors)
						alert('Die Klasse HelpBar wurde einem Element zugeordnet, welches keine Tabelle ist');
					break;			
					return false;
				}
				
				//////////////////////////////////
				// Set the widths of the fields.//
				//////////////////////////////////
				
				// First count cells of the first row.
				var CountRows = document.getElementsByClassName('HelpBar')[i].rows.length;		
				this.VirtualFirstRow[i] = new Object();				
				var firstRowCountCells = document.getElementsByClassName('HelpBar')[0].rows[0].cells.length;		
				var Top = document.getElementsByClassName('HelpBar')[i].offsetTop - document.getElementsByClassName('HelpBar')[i].rows[0].offsetHeight + 2;
				document.getElementsByClassName('HelpBar')[i].rows[0].setAttribute('style', 'z-index: 2100;position: absolute; top: ' + Top + 'px;');
				
				var NewHeight = document.getElementsByClassName('HelpBar')[i].rows[0].cells[0].offsetHeight - 2;
				var OK = 0;
				var l = 0;
			
				// For every Cell of the first row.
				for(j = 1; OK != 1; ++j) {
					
					// Count rows.			
					var CountCells = document.getElementsByClassName('HelpBar')[i].rows[j].cells.length;				
					if(CountCells === firstRowCountCells) {						
						++OK;
							
						// For every Cell of the first row.
						for(k = 0; k < CountCells; ++k) {
							// Get the current Width plus margin
							var Tolerance = 5;
							var NewWidth = document.getElementsByClassName('HelpBar')[i].rows[j].cells[k].offsetWidth - 10;
							while((Tolerance >= 1)) {
								NewWidth += 0.5;
								document.getElementsByClassName('HelpBar')[i].rows[0].cells[k].setAttribute('style', 'min-height: '+NewHeight+'px;height: '+NewHeight+'px;max-width: '+NewWidth+'px;width: '+NewWidth+'px;min-width: '+NewWidth+'px;');									
								var Tolerance = document.getElementsByClassName('HelpBar')[i].rows[j].cells[k].offsetWidth - document.getElementsByClassName('HelpBar')[i].rows[0].cells[k].offsetWidth;								
							}
						}
					}
					if(j >= 10) {
						if (this.DisplayErrors)
							alert('Die ersten zehn Zeilen der Tabelle haben weniger bzw. mehr Spalten als die erste Zeile');
						return false;
						break;				
					}
					
				}
				
				var margin = getOffsetLeft(document.getElementsByClassName('HelpBar')[i]) - getOffsetLeft(document.getElementsByClassName('HelpBar')[i].rows[0]);				
				document.getElementsByClassName('HelpBar')[i].rows[0].setAttribute('style', 'z-index: 2100;position: absolute; margin-left: ' + margin + 'px;top: ' + Top + 'px;');								
				
				var Margin = getOffsetLeft(document.getElementsByClassName('HelpBar')[i]) - getOffsetLeft(document.getElementsByClassName('HelpBar')[i].rows[0])  + parseInt(margin);				
				
				document.getElementsByClassName('HelpBar')[i].rows[0].setAttribute('style', 'z-index: 2100;position: absolute; margin-left: ' + Margin + 'px;top: ' + Top + 'px;');
				document.getElementsByClassName('HelpBar')[i].rows[0].setAttribute('margin-left', Margin);
			}			
		}
		this.browserSize = window.innerWidth;
		setTimeout('Bar.construct()', 1000);
		
	}
	this.construct();
	
	
	// Start the Checker Method
	this.checker();
}

function initHelpBar(event) 
{
	var tables = document.getElementsByTagName('table');
	for(var i = 0; i < tables.length; ++i) {
		if(hasClass(tables[i], 'HelpBar'))
			Bar = new HelpBar;					
	}
	
}
initHelpBar();

} catch (Error) {
	// alert(Error);
}