Difference between revisions of "Template:Infobox/doc"

From Ultronomicon
Jump to navigation Jump to search
(Created page with "=== Use === For creating standardised infoboxes, easy and whatever. === Usage === <pre>{{infobox |above = Outside table (optional) |top = Top of infobox (but with...")
 
(+JavaScript)
Line 15: Line 15:
 
|headerN  = A section header
 
|headerN  = A section header
 
}}</pre>
 
}}</pre>
 +
 +
=== JavaScript ===
 +
 +
For the alternating rows, the following JavaScript is needed for [[MediaWiki:Common.js]]:
 +
 +
<pre>function alternate_init() {
 +
    var tables = getElementsByClassName(document, "table", "alternateable");
 +
    for(var ti = 0; ti < tables.length; ti++) {
 +
        ts_alternate(tables[ti]);
 +
    }
 +
}
 +
addOnloadHook(alternate_init);
 +
 +
function ts_alternate(table) {
 +
    // Take object table and get all it's tbodies.
 +
    var tableBodies = table.getElementsByTagName("tbody");
 +
    // Loop through these tbodies
 +
    for (var i = 0; i < tableBodies.length; i++) {
 +
        // Take the tbody, and get all it's rows
 +
        var tableRows = tableBodies[i].getElementsByTagName("tr");
 +
        // Loop through these rows
 +
        // Start at 1 because we want to leave the heading row untouched
 +
        var curRow = 0
 +
        var sections = new Array();
 +
        var s = 0;
 +
        sections[s] = new Array();
 +
        for (var j = 0; j < tableRows.length; j++) {
 +
            if(tableRows[j].parentNode != tableBodies[i])
 +
                continue;
 +
            if(tableRows[j].tagName != 'TR')
 +
                continue;
 +
            var ignore = false;
 +
            var oldClasses = tableRows[j].className.split(" ");
 +
 +
            var newClassName = "";
 +
            for (var k = 0; k < oldClasses.length; k++) {
 +
                if (oldClasses[k] == "alternate-ignore")
 +
                    ignore = true;
 +
                if (oldClasses[k] == "alternate-reset") {
 +
                    curRow = 0;
 +
                    ignore = true;
 +
                }                   
 +
                if (oldClasses[k] != "" && oldClasses[k] != "even" && oldClasses[k] != "odd")
 +
                    newClassName += oldClasses[k] + " ";
 +
            }
 +
            if(curRow==0 && j>0) {
 +
                s++;
 +
                sections[s] = new Array();
 +
            }
 +
            if(ignore) {
 +
                continue;
 +
            }
 +
            sections[s].push(tableRows[j]);
 +
            curRow++;
 +
        }
 +
        for(var s = 0; s < sections.length; s++) {
 +
            var l = sections[s].length;
 +
            if (l<=1)
 +
                continue;
 +
            for(var r = 0; r < l; r++) {
 +
                var row = sections[s][r];
 +
                var oldClasses = row.className.split(" ");
 +
 +
                var newClassName = "";
 +
                for (var k = 0; k < oldClasses.length; k++) {       
 +
                    if (oldClasses[k] != "" && oldClasses[k] != "even" && oldClasses[k] != "odd")
 +
                        newClassName += oldClasses[k] + " ";
 +
                }
 +
                row.className = newClassName + ((l-r) % 2 == 0 ? "odd" : "even");
 +
            }
 +
        }
 +
    }
 +
}</pre>

Revision as of 14:54, 28 August 2012

Use

For creating standardised infoboxes, easy and whatever.

Usage

{{infobox
|above     = Outside table (optional)
|top       = Top of infobox (but within) (optional)
|title     = Name or title of infobox
|image     = The image (optional)
|caption   = Caption (optional)
|labelN    = Label for dataN (optional)
|dataN     = Data (can be used with or without a label)
|headerN   = A section header
}}

JavaScript

For the alternating rows, the following JavaScript is needed for MediaWiki:Common.js:

function alternate_init() {
    var tables = getElementsByClassName(document, "table", "alternateable");
    for(var ti = 0; ti < tables.length; ti++) {
        ts_alternate(tables[ti]);
    }
}
addOnloadHook(alternate_init);
 
function ts_alternate(table) {
    // Take object table and get all it's tbodies.
    var tableBodies = table.getElementsByTagName("tbody");
    // Loop through these tbodies
    for (var i = 0; i < tableBodies.length; i++) {
        // Take the tbody, and get all it's rows
        var tableRows = tableBodies[i].getElementsByTagName("tr");
        // Loop through these rows
        // Start at 1 because we want to leave the heading row untouched
        var curRow = 0
        var sections = new Array();
        var s = 0;
        sections[s] = new Array();
        for (var j = 0; j < tableRows.length; j++) {
            if(tableRows[j].parentNode != tableBodies[i])
                continue;
            if(tableRows[j].tagName != 'TR')
                continue;
            var ignore = false;
            var oldClasses = tableRows[j].className.split(" ");
 
            var newClassName = "";
            for (var k = 0; k < oldClasses.length; k++) {
                if (oldClasses[k] == "alternate-ignore")
                    ignore = true;
                if (oldClasses[k] == "alternate-reset") {
                    curRow = 0;
                    ignore = true;
                }                    
                if (oldClasses[k] != "" && oldClasses[k] != "even" && oldClasses[k] != "odd")
                    newClassName += oldClasses[k] + " ";
            }
            if(curRow==0 && j>0) {
                s++;
                sections[s] = new Array();
            }
            if(ignore) {
                continue;
            }
            sections[s].push(tableRows[j]);
            curRow++;
        }
        for(var s = 0; s < sections.length; s++) {
            var l = sections[s].length;
            if (l<=1)
                continue;
            for(var r = 0; r < l; r++) {
                var row = sections[s][r];
                var oldClasses = row.className.split(" ");
 
                var newClassName = "";
                for (var k = 0; k < oldClasses.length; k++) {         
                    if (oldClasses[k] != "" && oldClasses[k] != "even" && oldClasses[k] != "odd")
                        newClassName += oldClasses[k] + " ";
                }
                row.className = newClassName + ((l-r) % 2 == 0 ? "odd" : "even");
            }
        }
    }
}