Keystrokes for Sploop.io

Keystrokes made for Sploop.io! | For support please join our Discord - https://discord.gg/zpVgaMdrrd

Verzia zo dňa 07.04.2023. Pozri najnovšiu verziu.

Na nainštalovanie skriptu si budete musieť nainštalovať rozšírenie, ako napríklad Tampermonkey, Greasemonkey alebo Violentmonkey.

Na nainštalovanie skriptu si budete musieť nainštalovať rozšírenie, ako napríklad Tampermonkey, % alebo Violentmonkey.

Na nainštalovanie skriptu si budete musieť nainštalovať rozšírenie, ako napríklad Tampermonkey, % alebo Violentmonkey.

Na nainštalovanie skriptu si budete musieť nainštalovať rozšírenie, ako napríklad Tampermonkey alebo Userscripts.

Na inštaláciu tohto skriptu je potrebné nainštalovať rozšírenie, ako napríklad Tampermonkey.

Na inštaláciu tohto skriptu je potrebné nainštalovať rozšírenie správcu používateľských skriptov.

(Už mám správcu používateľských skriptov, nechajte ma ho nainštalovať!)

Na inštaláciu tohto štýlu je potrebné nainštalovať rozšírenie, ako napríklad Stylus.

Na inštaláciu tohto štýlu je potrebné nainštalovať rozšírenie, ako napríklad Stylus.

Na inštaláciu tohto štýlu je potrebné nainštalovať rozšírenie, ako napríklad Stylus.

Na inštaláciu tohto štýlu je potrebné nainštalovať rozšírenie správcu používateľských štýlov.

Na inštaláciu tohto štýlu je potrebné nainštalovať rozšírenie správcu používateľských štýlov.

Na inštaláciu tohto štýlu je potrebné nainštalovať rozšírenie správcu používateľských štýlov.

(Už mám správcu používateľských štýlov, nechajte ma ho nainštalovať!)

// ==UserScript==
// @name         Keystrokes for Sploop.io
// @version      0.3
// @description  Keystrokes made for Sploop.io! | For support please join our Discord - https://discord.gg/zpVgaMdrrd
// @author       Ashureth
// @match        *://*sploop.io/*
// @license MIT
// @grant        none
// @namespace Keystrokes
// ==/UserScript==

// VERSIONS

/*
0.2 - Fixed some key bugs
0.3 - Fixed so that keys don't react when you're chatting or if you are in the clan tab.
*/


function Blocking() {
    return document.getElementById('chat-wrapper').offsetParent == null && document.getElementById('clan-menu').offsetParent == null && document.getElementById('play-text').offsetParent == null;
}

let html = `
<html>

    <style>
    .KeyBoard {
    position: absolute;
    width: 300px;
    height: 200px;
    top: 200px;
    left: -50px;
    padding: 15px;
    text-align: center;
    border-radius: 15px;
}
.line {
    width: 300px;
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.line2 {
    width: 300px;
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.Key {
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 20px;
    width: 50px;
    height: 50px;
    left: 0px;
    top: 0px;
    border: 3px solid black;
    background: #2F3336;
    color: #fff;
    margin: 5px;
    border-radius: 12px;
    box-shadow: 0px 0px 5px hsl(0, 0%, 0%);
    overflow: hidden;
    transition: ease-in-out;
}
.Space {
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 25px;
    width: 200px;
    height: 50px;
    left: 0px;
    top: 0px;
    border: 3px solid black;
    background: #2F3336;
    color: #fff;
    margin: 2px;
    border-radius: 12px;
    box-shadow: 0px 0px 10px hsl(0, 0%, 0%);
    overflow: hidden;
}
.keyText {
    font-family: Helvetica;
    -webkit-user-select: none;
    -webkit-touch-callout: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    text-shadow: 0px 0px 10px hsl(0, 0%, 100%);
}
    </style>
<head>
    <div class="KeyBoard">
        <div class="line">
            <div class="Key" id="keyQ">
                <span class="keyText">Q</span>
            </div>
            <div class="Key" id="keyW">
                <span class="keyText">W</span>
            </div>
            <div class="Key" id="keyE">
                <span class="keyText">E</span>
            </div>
        </div>
        <div class="line2">
            <div class="Key" id="keyA">
                <span class="keyText" id="keyA">A</span>
            </div>
            <div class="Key" id="keyS">
                <span class="keyText">S</span>
            </div>
            <div class="Key" id="keyD">
                <span class="keyText">D</span>
            </div>
        </div>
        <div class="line">
            <div class="Space" id="keySpace">
                <span class="keyText">━━━━━</span>
            </div>
        </div>
    </div>
</head>

<body>
</body>

</html>
`
let HeldKeys = [];
let EToggle = false;

setInterval(() => {

    if(document.getElementById('play-text').offsetParent !== null) {
        EToggle = false;
    }

    var Element;

    let arr = ['W', 'A', 'S', 'D', 'E', 'Q', 'Space'];

    for(let i of arr) {
        i != 'E' && document.getElementById(`key${i}`) && (document.getElementById(`key${i}`).style.background = '#2F3336');
    }


    for(let Key in HeldKeys) {
        if(HeldKeys[Key] != 'E' && HeldKeys[Key] != null) {
            Element = document.getElementById(`key${HeldKeys[Key]}`);

            if(Element) {
                Element.style.background = '#52585e'
            }
        } else {
            Element = document.getElementById(`keyE`);

            Element.style.background = EToggle ? '#52585e' : '#2F3336';

        }
    }
});

document.body.insertAdjacentHTML('beforeend', html);

let game = document.getElementById('game-canvas');

window.addEventListener('keydown', e => {
    if(!Blocking()) return;
    let isSpace = e.key === ' ';
    if(isSpace) {
        HeldKeys['Space'] = 'Space';
    } else {
        if(e.key == 'e') {
            EToggle = !EToggle;
        } else {
            HeldKeys[e.key.toUpperCase()] = e.key.toUpperCase();
        }
    }
});
window.addEventListener('keyup', e => {
    let isSpace = e.key === ' ';
    if(isSpace) {
        HeldKeys['Space'] = null;
    } else {
        HeldKeys[e.key.toUpperCase()] = null;
    }
});