MediaWiki:Common.js

Note: After publishing, you may have to bypass your browser's cache to see the changes.

• Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
• Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
• Internet Explorer / Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5
• Opera: Press Ctrl-F5.

/* Any JavaScript here will be loaded for all users on every page load. */

// Wrap the code in a function to avoid polluting the global namespace
function initSnowfall() {
    var container = document.body;
    var numberOfSnowflakes = 50;
    var maxAccumulatedHeight = 200;
    var accumulatedHeight = 0;

    for (var i = 0; i < numberOfSnowflakes; i++) {
        createSnowflake();
    }

    function createSnowflake() {
        var snowflake = document.createElement("div");
        snowflake.className = "snowflake";
        container.appendChild(snowflake);

        var startX = Math.random() * window.innerWidth;
        var startY = Math.random() * window.innerHeight;

        snowflake.style.left = startX + "px";
        snowflake.style.top = startY + "px";

        var size = Math.random() * 5 + 3;
        snowflake.style.width = size + "px";
        snowflake.style.height = size + "px";

        animateSnowflake(snowflake);
    }

    function animateSnowflake(snowflake) {
        var speed = 1 + Math.random() * 2;

        function moveSnowflake() {
            var currentTop = parseFloat(snowflake.style.top);
            var newTop = currentTop + speed;

            snowflake.style.top = newTop + "px";

            if (newTop > window.innerHeight) {
                accumulatedHeight += window.innerHeight;
                snowflake.style.top = -accumulatedHeight + "px";
                snowflake.style.left = Math.random() * window.innerWidth + "px";

                if (accumulatedHeight >= maxAccumulatedHeight) {
                    accumulatedHeight = 0;
                }
            }

            requestAnimationFrame(moveSnowflake);
        }

        moveSnowflake();
    }
}

// Call the initialization function when the DOM is ready
$(document).ready(initSnowfall);