Change GUI structure to mimic postinit.js, and clean up codebase

This commit is contained in:
ZXMushroom63 2024-12-04 14:16:01 +08:00
parent f03ce418a5
commit 69d85db92a
5 changed files with 11 additions and 312 deletions

View File

@ -169,9 +169,8 @@
<!-- Code assets -->
<script src="postinit.js"></script>
<script src="postinit.async.js"></script>
<script src="modloader.injector.js"></script>
<script src="modgui.injector.js"></script>
<script src="modgui.js"></script>
<script src="efserver.js"></script>
</body>
</html>

View File

@ -1,301 +0,0 @@
globalThis.modapi_guikit = `// ModAPI GUI made by TheIdiotPlays
// https://github.com/TheIdiotPlays
(() => {
var splashes = [
"Now with A.I.D.S (automatically injected dedicated server)",
"Only causes death 90% of the time!",
"HTML is better.",
"https://github.com/EaglerForge",
"hey you should check out https://github.com/ZXMushroom63/scratch-gui",
"99% of people stop gambling before they win big.",
"Now with free estradiol!",
"Now with H.I.V (Hyper Injected Virtual-debugger)"
];
var gui = \`<div id="modapi_gui_container">
<header>
<h1 class="title">EaglerForge Mod Manager</h1>
<h4>
<!-- Now with with A.I.D.S. (automatically injected dedicated server)! -->
{splash_msg}
</h4>
<h5>
Warning: installing malicious mods can delete your worlds, ip-grab you, or even download more serious malware onto your computer. The EaglerForge developers are not liable for any damage caused by the use of EaglerForge and its related tools.
</h5>
</header>
<table class="modTable">
<thead>
<tr>
<td>
Mod
</td>
<td class="nothing"></td>
<td>
Controls
</td>
</tr>
</thead>
<tbody>
</tbody>
</table>
<div class="controls">
<button class="button" onclick="window.modapi_uploadmod()">Upload Mod (.js)</button>
<button class="button" onclick="window.modapi_addmod()">Add Mod From URL</button>
<button class="button" style="text-shadow: 0px 0px 10px rgba(255, 0, 0, 0.5)" onclick="window.modapi_clearmods()">Clear All Mods</button>
<button class="button _doneButton" onclick="this.parentElement.parentElement.remove();">Done</button>
</div>
<span>(reload to apply changes)</span>
<footer>
<p>
GUI by <a href="https://github.com/TheIdiotPlays">TheIdiotPlays</a>
</p>
<p>
Modloader linker by
<a href="https://github.com/ZXMushroom63">ZXMushroom63</a>
</p>
<p>
API by <a href="https://github.com/ZXMushroom63">ZXMushroom63,</a> <a href="https://leah.chromebooks.lol">Leah Anderson,</a> and <a href="https://github.com/radmanplays">radmanplays</a>
</p>
</footer>
<style>
#modapi_gui_container td:not(.nothing):not(:has(.button)) {
padding: 0.5rem 1.5rem;
margin: 0.5rem;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}
#modapi_gui_container td.nothing {
user-select: none;
opacity: 0;
width: 5rem;
}
#modapi_gui_container td {
text-align: center;
}
#modapi_gui_container h4, #modapi_gui_container h5 {
padding-bottom: 0;
margin-bottom: 0;
}
#modapi_gui_container h5 {
color: white;
text-shadow: 0px 0px 10px rgba(255,0,0,0.5);
font-size: 0.75rem;
}
#modapi_gui_container a {
color: white;
transition: 1s;
}
#modapi_gui_container a:hover {
color: lightblue;
}
#modapi_gui_container {
overflow-y: scroll;
overflow-x: hidden;
display: flex;
flex-direction: column;
align-items: center;
justify-content: space-between;
height: 100vh;
width: 100vw;
position: fixed;
z-index: 9999999999;
top: 0;
left: 0;
font-family: sans-serif;
background: white;
}
#modapi_gui_container header {
background-color: #333;
width: 100%;
padding: 1rem 0;
text-align: center;
color: white;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}
#modapi_gui_container .title {
font-size: 3rem;
margin: 0;
font-weight: 700;
text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
}
#modapi_gui_container .controls {
display: flex;
gap: 1rem;
margin-bottom: 2rem;
flex-wrap: wrap;
justify-content: center;
width: 100%;
}
#modapi_gui_container .button {
background-color: #555;
color: white;
padding: 12px 24px;
font-size: 1rem;
font-weight: 600;
border: none;
border-radius: 2px;
cursor: pointer;
transition: background-color 0.3s ease, transform 0.2s ease;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}
#modapi_gui_container .button:hover {
background-color: #777;
transform: translateY(-2px);
}
#modapi_gui_container footer {
width: 100%;
padding: 1rem;
background-color: #333;
text-align: center;
color: white;
font-size: 1.25rem;
box-shadow: 0 -4px 6px rgba(0, 0, 0, 0.1);
}
</style>
</div>\`;
async function fileToDataURI(file) {
return new Promise((res, rej) => {
var fr = new FileReader();
fr.addEventListener("error", (e) => { rej(e); });
fr.addEventListener("load", (e) => { res(fr.result); });
fr.readAsDataURL(file);
});
}
window.modapi_displayModGui = async function (cb) {
if (!getMods) {
return;
}
if (document.querySelector("#modapi_gui_container")) {
cb ||= document.querySelector("#modapi_gui_container")._cb;
document.querySelector("#modapi_gui_container").remove();
}
var element = document.createElement("div");
element.innerHTML = gui.replace("{splash_msg}", splashes[Math.floor(Math.random() * splashes.length)]);
document.body.appendChild(element);
document.querySelector("#modapi_gui_container")._cb = cb;
var modsList = await getMods();
var tbody = document.querySelector("#modapi_gui_container .modTable tbody");
tbody.innerHTML = "";
modsList.forEach((modtxt, i) => {
if (!modtxt) { return }
var hash = ModAPI.util.hashCode(modtxt);
var tr = document.createElement("tr");
var mod = document.createElement("td");
if (ModAPI.meta._titleMap[hash]) {
//Mod has metadata
if (ModAPI.meta._iconMap[hash]) {
var img = document.createElement("img");
img.style.width = "48px";
img.style.height = "48px";
img.style.imageRendering = "pixelated";
img.src = ModAPI.meta._iconMap[hash];
mod.appendChild(img);
}
var h4 = document.createElement("h4");
h4.style.margin = 0;
h4.style.padding = 0;
h4.innerText = ModAPI.meta._titleMap[hash] + (ModAPI.meta._versionMap[hash] ? " " + ModAPI.meta._versionMap[hash] : "");
mod.appendChild(h4);
if (ModAPI.meta._developerMap[hash]) {
var h6 = document.createElement("h6");
h6.style.margin = 0;
h6.style.padding = 0;
h6.innerText = ModAPI.meta._developerMap[hash];
mod.appendChild(h6);
}
if (ModAPI.meta._descriptionMap[hash]) {
var span = document.createElement("span");
span.style.fontSize = "0.65rem";
span.innerText = ModAPI.meta._descriptionMap[hash];
mod.appendChild(span);
}
} else {
//Mod does not have metadata
if (modtxt.length > 125) {
try {
mod.innerText = modtxt.match(/data:text\\/\\S+?;fs=\\S+;/m)[0]
} catch (error) {
mod.innerText = "Unknown Mod.";
}
} else { mod.innerText = modtxt; }
}
var spacer = document.createElement("td");
spacer.classList.add("nothing");
var controls = document.createElement("td");
var button = document.createElement("button");
button.innerText = "Delete";
button.style.height = "3rem";
button.style.marginTop = "calc(50% - 1.5rem)";
button.addEventListener("click", async () => {
await removeMod(i);
window.modapi_displayModGui();
});
button.classList.add("button");
controls.appendChild(button);
tr.appendChild(mod);
tr.appendChild(spacer);
tr.appendChild(button);
tbody.appendChild(tr);
});
var once = false;
if (cb) {
document.querySelector("#modapi_gui_container ._doneButton").addEventListener("mousedown", ()=>{
if (once) {
return;
}
once = true;
cb();
document.querySelector("#modapi_gui_container").remove();
})
}
}
window.modapi_clearmods = async () => {
await resetMods();
window.modapi_displayModGui();
}
window.modapi_addmod = async () => {
var mod = window.prompt("Paste in the URL of the mod you wish to add: ");
if (!mod || mod.length === 0) {
return;
}
await addMod("web@" + mod);
window.modapi_displayModGui();
}
window.modapi_uploadmod = async () => {
var f = document.createElement("input");
f.type = "file";
f.accept = "text/javascript";
f.multiple = true;
f.addEventListener("input", async () => {
if (f.files.length < 1) {
return;
}
for (let i = 0; i < f.files.length; i++) {
await addMod("web@" + (await fileToDataURI(f.files[i])).replaceAll(";base64", ";fs=" + f.files[i].name + ";base64"));
}
window.modapi_displayModGui();
});
f.click();
}
})();
`;

View File

@ -1,6 +1,7 @@
// ModAPI GUI made by TheIdiotPlays
// https://github.com/TheIdiotPlays
(() => {
globalThis.modapi_guikit = "(" + (() => {
// ModAPI GUI made by TheIdiotPlays
// https://github.com/TheIdiotPlays
var splashes = [
"Now with A.I.D.S (automatically injected dedicated server)",
"Only causes death 90% of the time!",
@ -297,4 +298,4 @@
});
f.click();
}
})();
}).toString() + ")();";

View File

@ -1,4 +0,0 @@
globalThis.modapi_postinitasync = "(" + (() => {
//EaglerForge post initialization code for async.
}).toString() + ")();";

View File

@ -955,6 +955,10 @@ globalThis.modapi_postinit = "(" + (() => {
function qhash(txt, arr) {
var interval = 4095 - arr.length;
if (interval < 1) {
console.error("[ModAPI.keygen] Ran out of IDs while generating for " + txt);
return -1;
}
var x = 1;
for (let i = 0; i < txt.length; i++) {
x += txt.charCodeAt(i);
@ -962,7 +966,7 @@ globalThis.modapi_postinit = "(" + (() => {
x = Math.abs(x);
x = x % interval;
}
var hash = x + arr.length;
var hash = x;
while (arr.includes(hash)) {
hash = (hash + 1) % (interval + arr.length);
}