MediaWiki:Common.js

From Tony Chase
Revision as of 23:01, 4 December 2023 by Archtony (talk | contribs)
Jump to navigation Jump to search

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.
document.addEventListener("DOMContentLoaded", function () {
    const container = document.body;
    const numberOfSnowflakes = 50;
    const maxAccumulatedHeight = 200;
    let accumulatedHeight = 0;

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

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

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

        snowflake.style.left = `${startX}px`;
        snowflake.style.top = `${startY}px`;

        const size = Math.random() * 5 + 3;
        snowflake.style.width = `${size}px`;
        snowflake.style.height = `${size}px`;

        animateSnowflake(snowflake);
    }

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

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

            snowflake.style.top = `${newTop}px`;

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

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

            requestAnimationFrame(moveSnowflake);
        }

        moveSnowflake();
    }
});