Vorlage:Countdown

Countdown to the Sixth World
-5096 Tage -4 Stunden -29 Minuten

Funktionsfähigkeit erreicht die Vorlage:Countdown erst durch Einfügen des folgenden Javascripts auf der monobook.js-Seite (Link: http://wiki.shadowhelix.de/Benutzer:Name_des_Benutzers/monobook.js), außerdem benötigt die Vorlage hasClass:

Variante 1 - Millisekunden

/* Countdown */

function updateCountdown () {

    var Countdown = document.getElementsByTagName( "div" );

    for ( var i = 0; i < Countdown.length; i++ ) {

        // div mit class="countdown" raussuchen
        if ( hasClass( Countdown[i], "countdown" ) ) {

            // div wird geleert
            while(Countdown[i].hasChildNodes()){
                Countdown[i].removeChild(Countdown[i].lastChild);
            }

            var targetTime = new Date("December 24, 2011 00:00:00");
            var currentTime = new Date ();

            var differenceTime = new Date(targetTime - currentTime);

            var days = (Math.floor(differenceTime/(86400*1000))).toString();

            var hours = (Math.floor(differenceTime/(3600*1000)) % 24).toString();
            if (hours < 10) {hours = "0"+hours}

            var minutes = (Math.floor(differenceTime/(60*1000)) % 60).toString();
            if (minutes < 10) {minutes = "0"+minutes}

            var seconds = (Math.floor(differenceTime/1000) % 60).toString();
            if (seconds < 10) {seconds = "0"+seconds}

            var milliseconds = (Math.floor(differenceTime) % 1000).toString();
            if (milliseconds < 10) {milliseconds = "00"+milliseconds} else if (milliseconds < 100) {milliseconds = "0"+milliseconds}

            var CountdownText1 = document.createTextNode( "Countdown to the Sixth World");
            var CountdownText2 = document.createTextNode( days+" Tage "+hours+":"+minutes+":"+seconds+":"+milliseconds );
            var Brk = document.createElement( "br" );

            // einfügen in div
            Countdown[i].insertBefore( CountdownText2, Countdown[i].childNodes[0] );
            Countdown[i].insertBefore( Brk, Countdown[i].childNodes[0] );
            Countdown[i].insertBefore( CountdownText1, Countdown[i].childNodes[0] );

            // reset der lineHeight notwendig
            Countdown[i].style.lineHeight = "1.5em";

            // nächster aufruf von updateCountdown() nach 1000ms
            setTimeout('updateCountdown();',1);
        }
    }
}

addOnloadHook( updateCountdown );

Variante 1 - Centisekunden

/* Countdown */

function pause(delay) {
	var start = new Date();
	while ((new Date()) - start <= delay) {}
}

function updateCountdown () {

    var Countdown = document.getElementsByTagName( "div" );

    for ( var i = 0; i < Countdown.length; i++ ) {

        // div mit class="countdown" raussuchen
        if ( hasClass( Countdown[i], "countdown" ) ) {

            // div wird geleert
            while(Countdown[i].hasChildNodes()){
                Countdown[i].removeChild(Countdown[i].lastChild);
            }

            var targetTime = new Date("December 24, 2011 00:00:00");
            var currentTime = new Date ();

            var differenceTime = new Date(targetTime - currentTime);

            var Brk = document.createElement( "br" );

            if (differenceTime > 0) {

                var days = (Math.floor(differenceTime/(86400*1000))).toString();

                var hours = (Math.floor(differenceTime/(3600*1000)) % 24).toString();
                if (hours < 10) {hours = "0"+hours}

                var minutes = (Math.floor(differenceTime/(60*1000)) % 60).toString();
                if (minutes < 10) {minutes = "0"+minutes}

                var seconds = (Math.floor(differenceTime/1000) % 60).toString();
                if (seconds < 10) {seconds = "0"+seconds}

                var centiseconds = (Math.floor(differenceTime/10) % 100).toString();
                if (centiseconds < 10) {centiseconds = "0"+centiseconds}

                var CountdownText1 = document.createTextNode( "Countdown to the Sixth World");
                var CountdownText2 = document.createTextNode( days+" Tage "+hours+":"+minutes+":"+seconds+":"+centiseconds );

                // einfügen in div
                Countdown[i].insertBefore( CountdownText2, Countdown[i].childNodes[0] );
                Countdown[i].insertBefore( Brk, Countdown[i].childNodes[0] );
                Countdown[i].insertBefore( CountdownText1, Countdown[i].childNodes[0] );

                // reset der lineHeight notwendig
                Countdown[i].style.lineHeight = "1.5em";

                // nächster aufruf von updateCountdown() nach 100ms
                setTimeout('updateCountdown();',10);

            } else {

            }
        }
    }
}

addOnloadHook( updateCountdown );