Ce code JS est un vrai bordel, pourrais-tu me le réarchitecturer ? Avec des classes, des fonction et toutes autres choses qui pourraient rendre le code plus lisible, stp;
JavaScript:
// ==UserScript==
// @name Gaming helper
// @namespace http://tampermonkey.net/
// @version 0.1
// @description press Ctrl + F1 for the menu
// @author You
// @match https://shotwars.io/
// @icon https://tikstar-user-images.oss-cn-hongkong.aliyuncs.com/5c17_6687233396861682694.jpg
// @grant none
// ==/UserScript==
(function () {
"use strict";
var lien = new URL(window.location.href);
var generateBotsButton = document.createElement('button')
var generateBotsInput = document.createElement('input');
var botCounterDisplay = document.createElement('p');
var displayDiv = true
var displayDivButton = document.createElement('button');
var changeNickname = document.createElement('p');
var HTMLapplyButton = document.createElement('button');
var botsCounter = 0
var HTMLdiv = document.createElement('div');
var HTMLNicknameChoosed = document.createElement('p');
var HTMLnicksList = document.createElement('ul');
var nicksList = ["☜❶☞Limbo ☜❶☞", "D҉O҉N҉A҉T҉҉1K҉", "Sock of Fate", "𝓚𝖔𝝇𝖒𝖔𝝇", "ẌūℒΐǤắ₦", "..λ.Ⱡ.₭.∑.Ʀ", "Đéɱǿή", "Føxŷ", "holy_Sneaker", "HowlClaw", "DarK_Knigt", "Ŧøթҹนķ", "ĴØЌÉŔ", "NeZoX", "K♚I♚N♚G", "Ѣеԉыȗ★ҜӪϯ", "_MaRiXyAnA_", "Im TuT_Ty_TrUp0_0", "çŤрẮχ", "Lemon4ik", "Early age", ">>¥¥♔Limbo♔¥¥<<", "Cr1stal", "ǤⒽǿⓈ†", "♠V1RUS♠", "⚡💥BlanderBot💥⚡", "Ďęмøņ", "ĶpĀčĀB4úĶ", "3Jlou_4uTep", "▀▄▀▄▀▄ FINISH ▀▄▀▄▀▄", "Utka_in_parks", "ℳ∑Đ\/Ē๖ۣۣۜD†₤₮", " Shooter ", "©ßЯ†ØÑ", "Fluffy", "|Power|™4ekHyTblu NigGa", "W1zarD", "Mr. Zadrot", "Haker♡", "He}I{g@H4uk", "ĢắḾ£b"];
var nickNameChoosed = "Sof";
var spamBoxText = document.createElement('p');
var spamBoxTextArea = document.createElement('textarea');
var spamBoxButton = document.createElement('button');
var spamBoxCheckBox = document.createElement('p');
var spamBoxCheckBoxLabel = document.createElement('p');
var spamBoxCheckBoxChecked = false
function modifyHTML() {
function changeColorAtHover(element, hoverColor = "rgb(210,210,210)", leaveColor = "white") {
element.addEventListener("mouseover", function () {
element.style.backgroundColor = hoverColor;
});
element.addEventListener("mouseout", function () {
element.style.backgroundColor = leaveColor;
});
}
nicksList.forEach((item) => {
let li = document.createElement("li");
li.innerText = item;
li.style = "margin: 10px; background-color: white; box-shadow: white 0px 0px 0px 5px; cursor: pointer;";
li.addEventListener("mouseover", function () {
li.style = "margin: 10px; background-color: rgb(210,210,210); box-shadow: rgb(210 210 210) 0px 0px 0px 5px; cursor: pointer;";
});
li.addEventListener("mouseout", function () {
li.style = "margin: 10px; background-color: white; box-shadow: white 0px 0px 0px 5px; cursor: pointer;";
});
li.onclick = function () {
nickNameChoosed = item;
HTMLdiv.removeChild(HTMLNicknameChoosed);
HTMLNicknameChoosed.innerHTML = nickNameChoosed;
HTMLdiv.appendChild(HTMLNicknameChoosed);
}
HTMLnicksList.appendChild(li);
})
HTMLnicksList.style.display = "none";
document.getElementById('signDiv-username').value = nickNameChoosed;
HTMLdiv.id = 'HTMLdiv';
HTMLdiv.style = 'top: 0px; position: absolute; z-index: 100; display: block; margin-block-start: 15px; margin-inline-start: 15px; border-radius: 10px; width: 450px; height: 500px; background-color: rgb(255, 255, 255); box-shadow: rgb(0 0 0) 0px 0px 0px 1px;';
document.body.appendChild(HTMLdiv);
generateBotsButton.innerHTML = "Generate bots";
generateBotsInput.placeholder = "Numbers of bots...";
botCounterDisplay.style = "top: 60px; left: 25px; padding: 5px; position: absolute;";
generateBotsInput.style = 'top: 25px; left: 25px; border-radius: 5px; padding: 5px; border-color: white; background: white; position: absolute; box-shadow: rgb(0 0 0) 0px 0px 0px 1px;';
generateBotsButton.style = 'top: 25px; left: 230px; border-radius: 5px; padding: 5px; border-color: white; background: white; position: absolute; cursor: pointer; box-shadow: rgb(0 0 0) 0px 0px 0px 1px;';
changeColorAtHover(generateBotsButton);
changeColorAtHover(HTMLNicknameChoosed)
botCounterDisplay.style = "top: 60px; left: 25px; border-radius: 5px; border-color: white; background: white; position: absolute;";
botCounterDisplay.innerHTML = "Bots genered = " + botsCounter
generateBotsButton.onclick = function () {
let botsNumber = generateBotsInput.value
for (let i = 0; i < botsNumber; i++) {
botsCounter += 1
HTMLdiv.removeChild(botCounterDisplay);
botCounterDisplay.innerHTML = "Bots genered = " + botsCounter
HTMLdiv.appendChild(botCounterDisplay);
play();
}
botsNumber = 0
};
displayDivButton.innerHTML = "-";
displayDivButton.style = "position: absolute; z-index: 100; background-color: red; width: 50px; height: 30px; border-radius: 10px; top: 487px; left: 417px; cursor: pointer;";
displayDivButton.onclick = function () {
if (displayDiv == true) {
displayDiv = false;
displayDivButton.innerHTML = "+";
displayDivButton.style = "position: absolute; z-index: 100; background-color: red; width: 50px; height: 30px; border-radius: 10px; top: 487px; left: 15px; cursor: pointer;";
HTMLdiv.style.display = "none";
} else {
displayDiv = true
displayDivButton.innerHTML = "-";
displayDivButton.style = "position: absolute; z-index: 100; background-color: red; width: 50px; height: 30px; border-radius: 10px; top: 487px; left: 417px; cursor: pointer;";
HTMLdiv.style.display = "block";
}
}
HTMLNicknameChoosed.innerHTML = nickNameChoosed;
changeNickname.innerHTML = "Change your nickname...";
changeNickname.style = "position: absolute; top: 100px; left: 25px;";
HTMLapplyButton.innerHTML = "Apply Nickname...";
HTMLapplyButton.style = "position: absolute; top: 130px; left: 300px; border-radius: 5px; padding: 5px; border-color: white; background: white; cursor: pointer; box-shadow: rgb(0 0 0) 0px 0px 0px 1px;";
HTMLapplyButton.onclick = function () {
document.getElementById('signDiv-username').value = nickNameChoosed;
}
changeColorAtHover(HTMLapplyButton);
HTMLNicknameChoosed.style = "position: absolute; top: 130px; left: 25px; border-radius: 5px; width: 240px; cursor: pointer; padding: 5px; border-color: white; background: white; box-shadow: rgb(0 0 0) 0px 0px 0px 1px;";
HTMLnicksList.style = "position: absolute; list-style-type: none; padding-inline-start: 15px; padding-block-start: 15px; margin-block: 0px; display: none; top: 160px; left: 25px; border-radius: 5px; background: white; box-shadow: rgb(0 0 0) 0px 0px 0px 1px; height: 90%; overflow: auto;";
HTMLnicksList.style.scroll = "";
HTMLNicknameChoosed.addEventListener("mouseover", function () {
document.onclick = function () {
HTMLnicksList.style.display = "block";
};
})
HTMLNicknameChoosed.addEventListener("mouseout", function () {
document.onclick = function () {
HTMLnicksList.style.display = "none";
};
})
spamBoxText.innerHTML = "Chat incredible texts...";
spamBoxText.style = "top: 180px; left: 25px; border-radius: 5px; border-color: white; background: white; position: absolute;";
spamBoxTextArea.placeholder = "To chat...";
spamBoxTextArea.cols = "40";
spamBoxTextArea.rows = "5";
spamBoxTextArea.style = "top: 210px; left: 25px; border-radius: 5px; padding: 5px; border-color: white; background: white; position: absolute; box-shadow: rgb(0 0 0) 0px 0px 0px 1px; height: 83px; resize: none;";
spamBoxButton.innerHTML = "Send...";
spamBoxButton.style = "z-index: 100; top: 210px; left: 370px; height: 84px; width: 64px; border-radius: 5px; padding: 5px; border-color: white; background: white; position: absolute; cursor: pointer; box-shadow: rgb(0 0 0) 0px 0px 0px 1px;";
changeColorAtHover(spamBoxButton);
spamBoxButton.onclick = function () {
document.getElementById('chattext').value = spamBoxTextArea.value;
}
spamBoxCheckBox.innerHTML = "";
spamBoxCheckBox.style = "top: 310px; position: absolute; left: 25px; border-radius: 5px; width: 15px; height: 15px; font-size: 11px; cursor: pointer; border-color: white; text-align: center; background: white; box-shadow: rgb(0 0 0) 0px 0px 0px 1px;";
spamBoxCheckBoxLabel.innerHTML = "Infinite Chat ?";
spamBoxCheckBoxLabel.style = "top: 310px; left: 50px; border-radius: 5px; border-color: white; background: white; position: absolute;";
changeColorAtHover(spamBoxCheckBox);
spamBoxCheckBox.onclick = function () {
if (spamBoxCheckBoxChecked == true) {
spamBoxCheckBoxChecked = false;
spamBoxCheckBox.innerHTML = "";
document.getElementById('chattext').value = "";
} else if (spamBoxCheckBoxChecked == false) {
spamBoxCheckBoxChecked = true;
spamBoxCheckBox.innerHTML = "✔";
document.getElementById('chattext').value = spamBoxTextArea.value;
}
}
document.body.appendChild(displayDivButton);
HTMLdiv.appendChild(spamBoxText);
HTMLdiv.appendChild(spamBoxButton);
HTMLdiv.appendChild(spamBoxTextArea);
HTMLdiv.appendChild(spamBoxCheckBox);
HTMLdiv.appendChild(spamBoxCheckBoxLabel);
HTMLdiv.appendChild(HTMLapplyButton);
HTMLdiv.appendChild(changeNickname);
HTMLdiv.appendChild(HTMLnicksList);
HTMLdiv.appendChild(HTMLNicknameChoosed);
HTMLdiv.appendChild(botCounterDisplay);
HTMLdiv.appendChild(generateBotsButton);
HTMLdiv.appendChild(generateBotsInput);
}
modifyHTML();
if (lien.href == false) {
window.close();
}
document.onkeydown = function (m) {
if (m.ctrlKey && m.key == "F2") {
window.open("https://www.youtube.com/results?search_query=musique+");
}
if (m.ctrlKey && m.key == "F1") {
window.open("https://keyboard-key-codes-adnk.netlify.app/");
}
if (m.key == "Enter") {
if (spamBoxCheckBoxChecked == true) {
document.getElementById('chattext').value = spamBoxTextArea.value;
}
}
};
})();