MediaWiki:Common.js

function countdownToChristmas() {
    var now = new Date();
    var targetDate = new Date(now.getFullYear(), 11, 25); // Dec 25 of current year

    if (now > targetDate) {
        targetDate.setFullYear(targetDate.getFullYear() + 1);
    }

    function updateCountdown() {
        var now = new Date();
        var diff = targetDate - now;

        if (diff <= 0) {
            document.getElementById('xmas-timer').innerText = "Merry Christmas!";
            return;
        }

        var days = Math.floor(diff / (1000 * 60 * 60 * 24));
        var hours = Math.floor((diff / (1000 * 60 * 60)) % 24);
        var minutes = Math.floor((diff / (1000 * 60)) % 60);
        var seconds = Math.floor((diff / 1000) % 60);

        document.getElementById('xmas-timer').innerText =
            "Countdown to Christmas: " + days + "d " + hours + "h " + minutes + "m " + seconds + "s";
    }

    updateCountdown();
    setInterval(updateCountdown, 1000);
}

$(document).ready(countdownToChristmas);


mw.loader.using(['jquery'], function () {
    $(function () {
        var canvas = document.getElementById("confetti-canvas");
        if (!canvas) return;

        canvas.width = window.innerWidth;
        canvas.height = window.innerHeight;
        var ctx = canvas.getContext("2d");

        var pieces = [], count = 150;
        for (var i = 0; i < count; i++) {
            pieces.push({
                x: Math.random() * canvas.width,
                y: Math.random() * canvas.height - canvas.height,
                r: Math.random() * 20 + 10,
                d: Math.random() * 10 + 10,
                color: "hsl(" + Math.random() * 360 + ", 100%, 50%)",
                tilt: Math.random() * 10 - 10,
                tiltAngle: 0
            });
        }

        function draw() {
            ctx.clearRect(0, 0, canvas.width, canvas.height);
            for (var i = 0; i < count; i++) {
                var p = pieces[i];
                ctx.beginPath();
                ctx.lineWidth = p.r / 2;
                ctx.strokeStyle = p.color;
                ctx.moveTo(p.x + p.tilt + p.r / 4, p.y);
                ctx.lineTo(p.x + p.tilt, p.y + p.tilt + p.r / 4);
                ctx.stroke();
            }

            update();
            requestAnimationFrame(draw);
        }

        function update() {
            for (var i = 0; i < count; i++) {
                var p = pieces[i];
                p.y += Math.cos(p.d / 2) + 1 + p.r / 5;
                p.tiltAngle += 0.1;
                p.tilt = Math.sin(p.tiltAngle - i / 3) * 15;
                if (p.y > canvas.height) {
                    p.y = -20;
                    p.x = Math.random() * canvas.width;
                }
            }
        }

        draw();
    });
});