adds part of the keyboard to your screen. And your CPS
// ==UserScript==
// @name CPS, keyboard panel and click panel
// @namespace https://greasyfork.org/es/users/805514
// @version 1.0
// @description adds part of the keyboard to your screen. And your CPS
// @author Zyenth
// @match *://sandbox.moomoo.io/*
// @match *://dev.moomoo.io/*
// @match *://moomoo.io/*
// @match *://*.moomoo.io/*
// @grant none
// ==/UserScript==
/* jshint esversion:8 */
!(function () {
var e = 0,
t = 0;
function i() {
var s = Date.now(),
d = s - e;
d < 700 ? ++t : ((FPS = Math.round(t / (d / 1e3))), (t = 0), (e = s)),
requestAnimationFrame(i);
}
(e = Date.now()), requestAnimationFrame(i);
})(),
setInterval(() => {
var e = new Date();
(Month = e.getUTCMonth() + 1),
(Day = e.getUTCDate()),
(Year = e.getUTCFullYear()),
(fpsdiv.innerHTML =
"FPS: " + FPS + "<br>Clock: " + KFC + ":" + MLC + ":" + RLC);
}, 0);
let fpsdiv = document.createElement("div");
(fpsdiv.id = "test"),
document.body.prepend(fpsdiv),
(document.getElementById("test").style.color = "red"),
(document.getElementById("test").style.fontSize = "20px"),
(document.getElementById("test").style.position = "absolute"),
(document.getElementById("test").style.textAlign = "center"),
(document.getElementById("test").style.width = "auto"),
(document.getElementById("test").style.height = "auto"),
(document.getElementById("test").style.backgroundColor =
"rgba(0, 0, 0, 0.4)"),
(document.getElementById("test").style.padding = "2px"),
setTimeout(() => {
document.getElementById("ot-sdk-btn-floating").remove(),
document.getElementById("pre-content-container").remove();
}, 5e3);
var FPS,
Day,
Month,
Year,
counter = 0;
(window.addKey = async function () {
let e = document.getElementById("newKey").value;
if (document.getElementById(e)) return;
await document.getElementById("controlPanel").insertAdjacentHTML(
"afterend",
`<div id="${counter}" style="display: flex; position: absolute;" ><div id="${e.toLowerCase()}" class="keyDisplay" style="width: 80px; pointer-events: all; top: 0; left: 0;" >${e.toUpperCase()}</div></div>`
);
let t = document.getElementById(counter.toString());
t.addEventListener("mousedown", function (e) {
var i = e.clientX,
s = e.clientY;
function d(e) {
let d = i - e.clientX,
l = s - e.clientY,
n = t.getBoundingClientRect();
(t.style.left = n.left - d + "px"),
(t.style.top = n.top - l + "px"),
(i = e.clientX),
(s = e.clientY);
}
function l() {
window.removeEventListener("mousemove", d),
window.removeEventListener("mouseup", l);
}
window.addEventListener("mousemove", d),
window.addEventListener("mouseup", l);
}),
counter++;
}),
(window.removeKey = function () {
let e = document.getElementById("newKey").value;
document.getElementById(e) && document.getElementById(e).remove();
});
let DivHTML = ` <div id="controlPanel"><span style="margin: 15px; font-size: 18px; padding: 5px; margin-top: 15px;">Toggle control panel with...</span><input id='toggleKey' type='text' value="\\" maxlength="1" style="width: 40px; height: 15px; background: none; border: 2px solid white; text-align: center; color: white;"></br><input id="wasd" type="checkbox" name="wasd" checked><label for="wasd">Display Movement Keys</label></br><input id="cpss" type="checkbox" name="cpss" checked><label for="nums">Display CPS/Max CPS</label></br><input id="clickss" type="checkbox" name="clickss" checked><label for="nums">Display Mouse Clicks</label></br><input id="newKey" maxlength="1" type="text" style="margin: 15px; color: white; background: none; border: 2px solid white; height: 20px; width: 40px; text-align: center;"><button id="create" style="width: 100px; text-align: center; color: white; background: none; border: 2px solid white; height: 25px;" onclick="addKey()">Create New</button><button id="remove" style="width: 100px; text-align: center; color: white; background: none; border: 2px solid white; height: 25px;" onclick="removeKey()">Remove Key</button></div>
<div id="numberRow">
<div class="keyDisplay" id="1">1</div>
<div class="keyDisplay" id="2">2</div>
<div class="keyDisplay" id="3">3</div>
<div class="keyDisplay" id="4">4</div>
<div class="keyDisplay" id="5">5</div>
<div class="keyDisplay" id="6">6</div>
<div class="keyDisplay" id="7">7</div>
<div class="keyDisplay" id="8">8</div>
<div class="keyDisplay" id="9">9</div>
<div class="keyDisplay" id="0">0</div>
</div>
<div id="keys">
<div class="keyDisplay" id="q">Q</div>
<div class="keyDisplay" id="w">W</div>
<div class="keyDisplay" id="e">E</div>
<div class="keyDisplay" id="r">R</div>
<div class="keyDisplay" id="t">T</div>
<div class="keyDisplay" id="y">Y</div>
<div class="keyDisplay" id="u">U</div>
<div class="keyDisplay" id="i">I</div>
<div class="keyDisplay" id="o">O</div>
<div class="keyDisplay" id="p">P</div>
</div>
<div id="secondRow">
<div class="keyDisplay" id="a">A</div>
<div class="keyDisplay" id="s">S</div>
<div class="keyDisplay" id="d">D</div>
<div class="keyDisplay" id="f">F</div>
<div class="keyDisplay" id="g">G</div>
<div class="keyDisplay" id="h">H</div>
<div class="keyDisplay" id="j">J</div>
<div class="keyDisplay" id="k">K</div>
<div class="keyDisplay" id="l">L</div>
</div>
<div id="thirdRow">
<div class="keyDisplay" id="z">Z</div>
<div class="keyDisplay" id="x">X</div>
<div class="keyDisplay" id="c">C</div>
<div class="keyDisplay" id="v">V</div>
<div class="keyDisplay" id="b">B</div>
<div class="keyDisplay" id="n">N</div>
<div class="keyDisplay" id="m">M</div>
</div>
<div id="cps">
<div class="keyDisplay" id="Space">_____</div>
<div id="clicker">
<div id="clickLeft"></div>
<div id="clickRight">
<div id="clickBottom"></div>
</div>
</div>
</div>
<div id="cpsDisplay">
<div id="cpsDivDisp" class="keyDisplay">CPS: 0</div>
<div id="MaxCPS" class="keyDisplay">Max CPS: 0</div>
</div>`,
styles = document.createTextNode(` #controlPanel {
display: none;
color: white;
position: absolute;
width: 400px;
height: 275px;
background-color: rgba(0, 0, 0, 0.25);
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
border-radius: 3px;
pointer-events: all;
}
#numberRow {
display: flex;
flex-wrap: nowrap;
align-content: start;
width: 400px;
position: absolute;
z-index: 15;
left: 10px;
top: 10px;
pointer-events: all;
}
#keys {
display: flex;
flex-wrap: nowrap;
align-content: start;
width: 400px;
position: absolute;
z-index: 15;
left: 10px;
top: 60px;
pointer-events: all;
}
#secondRow {
display: flex;
flex-wrap: nowrap;
align-content: start;
width: 400px;
position: absolute;
z-index: 15;
left: 10px;
top: 110px;
pointer-events: all;
}
#thirdRow {
display: flex;
flex-wrap: nowrap;
align-content: start;
width: 400px;
position: absolute;
z-index: 15;
left: 35px;
top: 160px;
pointer-events: all;
}
#cps {
position: absolute;
display: flex;
z-index: 15;
pointer-events: all;
top: 210px;
}
#cpsDisplay {
position: absolute;
z-index: 15;
pointer-events: all;
top: 40%;
}
.keyDisplay {
margin: 5px;
padding: 2px;
border: 2px solid white;
color: white;
height: 40px;
min-width: 50px;
max-width: 100px;
text-align: center;
font-size: 17px;
top: 50%;
line-height: 40px;
}
.keyDisplay.active {
color: black;
background: white;
}
#clicker {
display: flex;
}
#clickLeft {
width: 20px;
height: 40px;
border-top-left-radius: 100px;
border-top-right-radius: 5px;
border-bottom-left-radius: 5px;
border-bottom-right-radius: 5px;
border: 2px solid white;
margin-right: 10px;
}
#clickRight {
width: 20px;
height: 40px;
border-top-right-radius: 100px;
border-top-left-radius: 5px;
border-bottom-left-radius: 5px;
border-bottom-right-radius: 5px;
border: 2px solid white;
}
#clickBottom {
margin-top: 48px;
margin-left: -25px;
width: 40px;
height: 20px;
border-top-radius: 5px;
border-bottom-left-radius: 100px;
border-bottom-right-radius: 100px;
border: 2px solid white;
}
.active2 {
background: white;
}
`),
css = document.createElement("style");
(css.type = "text/css"),
css.appendChild(styles),
document.body.appendChild(css),
document
.getElementById("storeMenu")
.insertAdjacentHTML("beforebegin", DivHTML);
const keys = document.getElementById("keys"),
secondRow = document.getElementById("secondRow"),
thirdRow = document.getElementById("thirdRow"),
numberRow = document.getElementById("numberRow"),
cps = document.getElementById("cps"),
cpsDisp = document.getElementById("cpsDisplay"),
cpsDiv = document.getElementById("cpsDivDisp"),
maxCpsDiv = document.getElementById("MaxCPS"),
wasd = document.getElementById("wasd"),
cpss = document.getElementById("cpss"),
clicks = document.getElementById("clickss");
var theCps = 0,
maxCps = 0,
keyDownLeft = false,
keyDownRight = false,
keyDownSpace = false;
function displayControlPanel() {
let e = document.getElementById("controlPanel");
"none" === e.style.display ?
(e.style.display = "block") :
(e.style.display = "none");
}
document.addEventListener("keydown", function (e) {
let t;
" " === e.key ?
((t = document.getElementById("Space")),
keyDownSpace ||
(theCps++,
setTimeout(function () {
theCps--;
}, 1e3),
(keyDownSpace = true))) :
(t = document.getElementById(e.key.toLowerCase())),
t && t.classList.add("active");
}),
document.addEventListener("keyup", function (e) {
let t;
" " === e.key ?
((t = document.getElementById("Space")), (keyDownSpace = false)) :
(t = document.getElementById(e.key.toLowerCase())),
t && t.classList.remove("active");
}),
document.addEventListener("mousedown", function (e) {
let t = false;
(2 === e.button && (t = true), t) ?
(document.getElementById("clickRight").classList.add("active2"),
keyDownRight ||
(theCps++,
setTimeout(function () {
theCps--;
}, 1e3),
(keyDownRight = true))) :
(document.getElementById("clickLeft").classList.add("active2"),
keyDownLeft ||
(theCps++,
setTimeout(function () {
theCps--;
}, 1e3),
(keyDownLeft = true)));
}),
document.addEventListener("mouseup", function (e) {
let t = false;
(2 === e.button && (t = true), t) ?
(document.getElementById("clickRight").classList.remove("active2"),
(keyDownRight = false)) :
(document.getElementById("clickLeft").classList.remove("active2"),
(keyDownLeft = false));
}),
setInterval(function () {
(cpsDiv.innerHTML = "CPS: " + theCps),
(maxCpsDiv.innerHTML = "Max CPS: " + maxCps),
theCps > maxCps && (maxCps = theCps);
}, 100),
document
.getElementById("toggleKey")
.addEventListener("keydown", function (e) {
"\\" === e.key && displayControlPanel();
}),
document.getElementById("toggleKey").addEventListener("keyup", function (e) {
"\\" === e.key && displayControlPanel();
}),
false === wasd.checked &&
((keys.style.display = "none"),
(secondRow.style.top = "10px"),
(thirdRow.style.top = "60px"),
(numberRow.style.top = "110px")),
wasd.addEventListener("change", function () {
false === wasd.checked ?
((keys.style.display = "none"),
(secondRow.style.top = "10px"),
(thirdRow.style.top = "60px"),
(numberRow.style.top = "110px")) :
((keys.style.display = "flex"),
(secondRow.style.top = "60px"),
(thirdRow.style.top = "110px"),
(numberRow.style.top = "10px"));
}),
false === cpss.checked &&
((cps.style.display = "none"), (cpsDisp.style.top = "15%")),
cpss.addEventListener("change", function () {
false === cpss.checked ?
((cps.style.display = "none"), (cpsDisp.style.top = "15%")) :
((cps.style.display = "flex"), (cpsDisp.style.top = "40%"));
}),
false === clickss.checked &&
(document.getElementById("clicker").style.display = "none"),
clickss.addEventListener("change", function () {
false === clickss.checked ?
(document.getElementById("clicker").style.display = "none") :
(document.getElementById("clicker").style.display = "flex");
});