🌕 Moon Visuals 🌕 [New Visuals!]

Visuals created by me using the CSS of moomoo.io offcial, give me ideas!

您需要先安装一个扩展,例如 篡改猴Greasemonkey暴力猴,之后才能安装此脚本。

您需要先安装一个扩展,例如 篡改猴暴力猴,之后才能安装此脚本。

您需要先安装一个扩展,例如 篡改猴暴力猴,之后才能安装此脚本。

您需要先安装一个扩展,例如 篡改猴Userscripts ,之后才能安装此脚本。

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey,才能安装此脚本。

您需要先安装用户脚本管理器扩展后才能安装此脚本。

(我已经安装了用户脚本管理器,让我安装!)

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

(我已经安装了用户样式管理器,让我安装!)

// ==UserScript==
// @name         🌕 Moon Visuals 🌕 [New Visuals!]
// @namespace    http://tampermonkey.net/
// @version      1.3
// @description  Visuals created by me using the CSS of moomoo.io offcial, give me ideas!
// @author       DaRK :)
// @match        *://*.moomoo.io/*
// @icon         https://cdn.discordapp.com/attachments/1129277020661100605/1182191381809205268/john-wagner-bloodmoon.png?ex=6583cc85&is=65715785&hm=adb74fe6d62f3c27077b2f36e6febdf74d3280e2d303283cdb550e08c990aba9&
// @grant        none
// @license      MIT
// ==/UserScript==

(function() {
    'use strict';

    window.addEventListener('load', function() {
        const canvas = document.getElementById("gameCanvas");
        const ctx = canvas.getContext("2d");

        const originalDrawImage = ctx.drawImage;

        ctx.drawImage = function () {
            this.shadowColor = "rgba(50, 50, 50, 0.5)";
            this.shadowBlur = 10;

            originalDrawImage.apply(this, arguments);

            this.shadowColor = "transparent";
            this.shadowBlur = 0;
        };
    });

    document.getElementById('loadingText').innerHTML = 'Moon Visuals Loading...';
    document.getElementById('loadingText').style.color = "b32821";
    document.getElementById("nameInput").style.backgroundColor = "black";
    document.getElementById("nameInput").style.color = "b32821";
    document.getElementById("enterGame").style.backgroundColor = "Black";
    document.getElementById("enterGame").style.color = "b32821";
    document.getElementById("mainMenu").style.backgroundImage = "url('https://memeguy.com/photos/images/i-drew-this-pixel-art-animation-using-colors-and-called-it-moonset--522728.gif')";
    document.getElementById("mainMenu").style.backgroundRepeat = "no-repeat";
    document.getElementById("mainMenu").style.backgroundSize = "cover";
    document.getElementById('enterGame').innerHTML ='🎮Enter Game!🎮';
    document.getElementById('enterGame').style.color = 'text-shadow: red 1px 1px 40px;';
    document.getElementById('nameInput').placeholder = "Ur Name Here xD";
    document.getElementById('diedText').innerHTML = '💥Why moon died?💥';
    document.getElementById('gameName').innerHTML = '🌕 Moon Visuals 🌕!';
    document.getElementById('gameName').style.color = "ffff66";
    document.getElementById("leaderboard").append ('🌕M̵͚͕͓͗ô̵̖͈͔̏̓ō̸͕̓͝ͅņ̵̬͈̐̄̎🌕');
    document.getElementById("leaderboard").style.color = "text-shadow: green 2px 2px 40px;";
    document.getElementById("leaderboard").style.border = "2px solid yellow";

    let ageBar = document.getElementById("ageBar");
    let hueAgeBar = 0;

    function updateAgeBarColor() {
        ageBar.style.backgroundColor = `hsl(${hueAgeBar}, 100%, 50%)`;
        hueAgeBar = (hueAgeBar + 1) % 360;
    }

    let intervalAgeBarId = setInterval(updateAgeBarColor, 50);

    let leaderboard = document.getElementById("leaderboard");
    let hueLeaderboard = 0;

    function updateLeaderboardColor() {
        leaderboard.style.borderColor = `hsl(${hueLeaderboard}, 100%, 50%)`;
        hueLeaderboard = (hueLeaderboard + 1) % 360;
    }

    let intervalLeaderboardId = setInterval(updateLeaderboardColor, 50);

    let foodDisplay = document.getElementById("foodDisplay");
    let woodDisplay = document.getElementById("woodDisplay");
    let stoneDisplay = document.getElementById("stoneDisplay");
    let scoreDisplay = document.getElementById("scoreDisplay");

    let hueText = 0;

    function updateTextColors() {
        foodDisplay.style.color = `hsl(${hueText}, 100%, 50%)`;
        woodDisplay.style.color = `hsl(${hueText}, 100%, 50%)`;
        stoneDisplay.style.color = `hsl(${hueText}, 100%, 50%)`;
        scoreDisplay.style.color = `hsl(${hueText}, 100%, 50%)`;

        hueText = (hueText + 1) % 360;
    }

    let intervalTextId = setInterval(updateTextColors, 50);

    let mapDisplay = document.getElementById("mapDisplay");


    mapDisplay.style.backgroundImage = "url('https://i.imgur.com/fgFsQJp.png')";
    mapDisplay.style.backgroundRepeat = "no-repeat";
    mapDisplay.style.backgroundSize = "cover";

})();