Sploop.io Advanced Keystrokes.

customized keystrokes tailored to your preferences & use.

// ==UserScript==
// @name Sploop.io Advanced Keystrokes.
// @version 2
// @description customized keystrokes tailored to your preferences & use.
// @author DETIX
// @match *://sploop.io/*
// @icon https://sploop.io/img/ui/favicon.png
// @license MIT
// @namespace https://greasyfork.org/users/1311498
// ==/UserScript==

const DATA = {
    CPS: 0,
    MAXCPS: 0
};

let SHOP, FOOD, SPIKE, TRAP;

const OBJECT = {
    KEYS: {
        // These are the default keys, which gonna be change depending on the keys you set in the game menu.
        PRIMARY: { KEY: "Digit1", KEY2: "Numpad1", PRESSED: false },
        SECONDARY: { KEY: "Digit2", KEY2: "Numpad2", PRESSED: false },
        FOOD: { KEY: "KeyQ", KEY2: "Digit3", PRESSED: false },
        SPIKE: { KEY: "KeyR", KEY2: "Digit5", PRESSED: false },
        TRAP: { KEY: "KeyF", KEY2: "Digit7", PRESSED: false },
        SPACE: { KEY: "Space", PRESSED: false },
        LOCK: { KEY: "KeyX", PRESSED: false },
        AUTOHIT: { KEY: "KeyE", PRESSED: false },
        SHOP: { KEY: "KeyN", PRESSED: false }
    },
    BUTTONS: {
        LEFT: { BUTTON: 0, PRESSED: false },
        MIDDLE: { BUTTON: 1, PRESSED: false },
        //These three buttons will not be shown in the menu, but using them will still increase the CPS in the menu.
        RIGHT: { BUTTON: 2, PRESSED: false },
        XBUTTON1: { BUTTON: 3, PRESSED: false },
        XBUTTON2: { BUTTON: 4, PRESSED: false }
    }
};

const isInGame = () => {
    const homepage = document.getElementById("homepage");
    return homepage && homepage.style.display !== "flex";
};

const isAVAILABLE = () => {
    if (!isInGame()) return false;
    const chatWrapper = document.getElementById("chat-wrapper");
    const clanMenu = document.getElementById("clan-menu");
    return chatWrapper && clanMenu && chatWrapper.style.display !== "block" && clanMenu.style.display !== "block";
};

const UPDATE = {
    KEYS: {
        DOWN: function (e) {
            if (e.code === OBJECT.KEYS.PRIMARY.KEY || e.code === OBJECT.KEYS.PRIMARY.KEY2) {
                OBJECT.KEYS.PRIMARY.PRESSED = true;
            }
            if (e.code === OBJECT.KEYS.SECONDARY.KEY || e.code === OBJECT.KEYS.SECONDARY.KEY2) {
                OBJECT.KEYS.SECONDARY.PRESSED = true;
            }
            if (e.code === OBJECT.KEYS.FOOD.KEY || e.code === OBJECT.KEYS.FOOD.KEY2) {
                OBJECT.KEYS.FOOD.PRESSED = true;
            }
            if (e.code === OBJECT.KEYS.SPIKE.KEY || e.code === OBJECT.KEYS.SPIKE.KEY2) {
                OBJECT.KEYS.SPIKE.PRESSED = true;
            }
            if (e.code === OBJECT.KEYS.TRAP.KEY || e.code === OBJECT.KEYS.TRAP.KEY2) {
                OBJECT.KEYS.TRAP.PRESSED = true;
            }
            if (e.code === OBJECT.KEYS.SPACE.KEY) {
                if (event.repeat) return;
                OBJECT.KEYS.SPACE.PRESSED = true;
                UPDATE.CPS();
            }
            if (e.code === OBJECT.KEYS.SHOP.KEY && isAVAILABLE()) {
                OBJECT.KEYS.SHOP.PRESSED = true;
            }

            // KeyE & KeyX
            if (e.code === OBJECT.KEYS.LOCK.KEY && isAVAILABLE()) {
                if (event.repeat) return;
                OBJECT.KEYS.LOCK.PRESSED = !OBJECT.KEYS.LOCK.PRESSED;
            }
            if (e.code === OBJECT.KEYS.AUTOHIT.KEY && isAVAILABLE()) {
                if (event.repeat) return;
                OBJECT.KEYS.AUTOHIT.PRESSED = !OBJECT.KEYS.AUTOHIT.PRESSED;
            }
        },
        UP: function (e) {
            if (e.code === OBJECT.KEYS.PRIMARY.KEY || e.code === OBJECT.KEYS.PRIMARY.KEY2) {
                OBJECT.KEYS.PRIMARY.PRESSED = false;
            }
            if (e.code === OBJECT.KEYS.SECONDARY.KEY || e.code === OBJECT.KEYS.SECONDARY.KEY2) {
                OBJECT.KEYS.SECONDARY.PRESSED = false;
            }
            if (e.code === OBJECT.KEYS.FOOD.KEY || e.code === OBJECT.KEYS.FOOD.KEY2) {
                OBJECT.KEYS.FOOD.PRESSED = false;
            }
            if (e.code === OBJECT.KEYS.SPIKE.KEY || e.code === OBJECT.KEYS.SPIKE.KEY2) {
                OBJECT.KEYS.SPIKE.PRESSED = false;
            }
            if (e.code === OBJECT.KEYS.TRAP.KEY || e.code === OBJECT.KEYS.TRAP.KEY2) {
                OBJECT.KEYS.TRAP.PRESSED = false;
            }
            if (e.code === OBJECT.KEYS.SPACE.KEY) {
                OBJECT.KEYS.SPACE.PRESSED = false;
            }
            if (e.code === OBJECT.KEYS.SHOP.KEY) {
                OBJECT.KEYS.SHOP.PRESSED = false;
            }
        }
    },
    BUTTONS: {
        DOWN: function (e) {
            if (e.button === OBJECT.BUTTONS.LEFT.BUTTON) {
                OBJECT.BUTTONS.LEFT.PRESSED = true;
                UPDATE.CPS();
            }
            if (e.button === OBJECT.BUTTONS.MIDDLE.BUTTON) {
                OBJECT.BUTTONS.MIDDLE.PRESSED = true;
                UPDATE.CPS();
            }
            if (e.button === OBJECT.BUTTONS.RIGHT.BUTTON) {
                OBJECT.BUTTONS.RIGHT.PRESSED = true;
                UPDATE.CPS();
            }
            if (e.button === OBJECT.BUTTONS.XBUTTON1.BUTTON) {
                OBJECT.BUTTONS.XBUTTON1.PRESSED = true;
                UPDATE.CPS();
            }
            if (e.button === OBJECT.BUTTONS.XBUTTON2.BUTTON) {
                OBJECT.BUTTONS.XBUTTON2.PRESSED = true;
                UPDATE.CPS();
            }
        },
        UP: function (e) {
            if (e.button === OBJECT.BUTTONS.LEFT.BUTTON) {
                OBJECT.BUTTONS.LEFT.PRESSED = false;
            }
            if (e.button === OBJECT.BUTTONS.MIDDLE.BUTTON) {
                OBJECT.BUTTONS.MIDDLE.PRESSED = false;
            }
            if (e.button === OBJECT.BUTTONS.RIGHT.BUTTON) {
                OBJECT.BUTTONS.RIGHT.PRESSED = false;
            }
            if (e.button === OBJECT.BUTTONS.XBUTTON1.BUTTON) {
                OBJECT.BUTTONS.XBUTTON1.PRESSED = false;
            }
            if (e.button === OBJECT.BUTTONS.XBUTTON2.BUTTON) {
                OBJECT.BUTTONS.XBUTTON2.PRESSED = false;
            }
        }
    },
    CPS: function () {
        DATA.CPS++;
        if (DATA.CPS > DATA.MAXCPS) {
            DATA.MAXCPS = DATA.CPS;
        }
        setTimeout(() => {
            DATA.CPS--;
        }, 1000);
    },
    VISUALS: function (COLOR) {
        COLOR = "#D0D0D0";
        // Primary Key
        document.getElementById("primary").style.backgroundColor = OBJECT.KEYS.PRIMARY.PRESSED ? COLOR : "";

        // Secondary Key
        document.getElementById("secondary").style.backgroundColor = OBJECT.KEYS.SECONDARY.PRESSED ? COLOR : "";

        // Food Key
        document.getElementById("food").style.backgroundColor = OBJECT.KEYS.FOOD.PRESSED ? COLOR : "";

        // Spike Key
        document.getElementById("spike").style.backgroundColor = OBJECT.KEYS.SPIKE.PRESSED ? COLOR : "";

        // Trap Key
        document.getElementById("trap").style.backgroundColor = OBJECT.KEYS.TRAP.PRESSED ? COLOR : "";

        // Autohit Key
        document.getElementById("autohit").style.backgroundColor = OBJECT.KEYS.AUTOHIT.PRESSED ? COLOR : "";

        // Lock Key
        document.getElementById("lockdir").style.backgroundColor = OBJECT.KEYS.LOCK.PRESSED ? COLOR : "";

        // Shop Key
        document.getElementById("shop_").textContent = OBJECT.KEYS.SHOP.KEY;
        document.getElementById("shop_").style.backgroundColor = OBJECT.KEYS.SHOP.PRESSED ? COLOR : "";

        // Space Key
        document.getElementById("spacebar").style.backgroundColor = OBJECT.KEYS.SPACE.PRESSED ? COLOR : "";

        // Left Click
        document.getElementById("left-click").style.backgroundColor = OBJECT.BUTTONS.LEFT.PRESSED ? COLOR : "";

        // Right Click
        document.getElementById("right-click").style.backgroundColor = OBJECT.BUTTONS.RIGHT.PRESSED ? COLOR : "";

        document.getElementById("cps").textContent = `CPS: ${DATA.CPS}`;
        document.getElementById("maxcps").textContent = `MCPS: ${DATA.MAXCPS}`;
        requestAnimationFrame(UPDATE.VISUALS);
    },
    KEYBINDS: function () {
        SHOP = document.getElementById('for-shop').textContent;
        FOOD = document.getElementById('for-food').textContent;
        SPIKE = document.getElementById('for-spike').textContent;
        TRAP = document.getElementById('for-trap').textContent;

        OBJECT.KEYS.SHOP.KEY = SHOP;
        OBJECT.KEYS.FOOD.KEY = FOOD;
        OBJECT.KEYS.SPIKE.KEY = SPIKE;
        OBJECT.KEYS.TRAP.KEY = TRAP;
    },
    SUBMIT: function () {
        UPDATE.KEYBINDS();
        setInterval(UPDATE.KEYBINDS, 100);
    }
};

const MENU = () => {
    const menuHTML = `
<div id="menu">
<div class="menu-row">
<div class="menu-item" id="primary">Primary</div>
<div class="menu-item" id="secondary">Secondary</div>
</div>
<div class="menu-row">
<div class="menu-item" id="food">Food</div>
<div class="menu-item" id="spike">Spike</div>
<div class="menu-item" id="trap">Trap</div>
</div>
<div class="menu-row">
<div class="menu-item" id="autohit">KeyE</div>
<div class="menu-item" id="shop_">${OBJECT.KEYS.SHOP.KEY}</div>
<div class="menu-item" id="lockdir">KeyX</div>
</div>
<div class="menu-row">
<div class="menu-item mouse-button" id="left-click">LEFT</div>
<div class="menu-item mouse-button" id="right-click">RIGHT</div>
</div>
<div class="menu-row">
<div class="menu-item spacebar" id="spacebar">Spacebar</div>
</div>
<div class="menu-row">
<div class="menu-item cps" id="cps">CPS: 0</div>
<div class="menu-item maxcps" id="maxcps">MCPS: 0</div>
</div>
</div>
`;

    const menuStyles = `
#menu {
position: fixed;
top: 20px;
left: 20px;
color: #fff;
padding: 10px;
border-radius: 5px;
z-index: 1000;
font-family: Arial, sans-serif;
font-size: 14px;
pointer-events: none; /* this allows the user to click through the menu. */
}
.menu-row {
display: flex;
justify-content: space-between;
margin-bottom: 8px;
}
.menu-item {
flex: 1;
text-align: center;
padding: 8px;
background-color: rgba(0, 0, 0, 0.2);
border-radius: 5px;
}
.spacebar {
width: 100%;
background-color: rgba(0, 0, 0, 0.2);
border-radius: 5px;
text-align: center;
padding: 8px;
}
.cps, .maxcps {
width: 50%;
}
.mouse-button {
width: 48%;
}
.menu-item:last-child {
margin-bottom: 0;
}
`;
    document.body.insertAdjacentHTML('beforeend', menuHTML);
    const styleElement = document.createElement('style');
    styleElement.textContent = menuStyles;
    document.head.appendChild(styleElement);
    UPDATE.VISUALS();
    UPDATE.SUBMIT();
};

document.addEventListener("keydown", UPDATE.KEYS.DOWN);
document.addEventListener("keyup", UPDATE.KEYS.UP);
document.addEventListener("mousedown", UPDATE.BUTTONS.DOWN);
document.addEventListener("mouseup", UPDATE.BUTTONS.UP);

MENU();