commit
c4debc0cff
|
|
@ -0,0 +1,159 @@
|
|||
var awaitingReload = [];
|
||||
|
||||
function updateModManager() {
|
||||
const modManager = document.getElementById("modManager");
|
||||
// make the title a bit better
|
||||
// modManager.getElementsByClassName("menuTitle").item(0).innerHTML = '<span class="menuTitle">Mod Manager</span>';
|
||||
document.getElementById("modManagerUrl").remove();
|
||||
const button = document.createElement("button");
|
||||
button.id = "modListOpen";
|
||||
button.onclick = openModList;
|
||||
button.innerText = "Open Mod List";
|
||||
button.style.position = "absolute";
|
||||
button.style.bottom = "5%";
|
||||
button.style.width = "100%";
|
||||
button.style.left = "0";
|
||||
button.style.height = "50px";
|
||||
button.style.backgroundColor = "#3c3c3c"
|
||||
button.style.paddingLeft = "auto";
|
||||
button.style.zIndex = 11;
|
||||
|
||||
modManager.appendChild(button);
|
||||
const list = document.getElementById("modManagerList");
|
||||
list.style.maxHeight = "60%";
|
||||
list.style.overflowY = "scroll";
|
||||
addModList();
|
||||
|
||||
}
|
||||
|
||||
function addModList() {
|
||||
const parent = document.createElement("div");
|
||||
parent.className = "menuParent"
|
||||
parent.id = "modListParent";
|
||||
parent.style.display = "none";
|
||||
const modList = document.createElement("div");
|
||||
modList.className = "menuScreen";
|
||||
modList.id = "modList";
|
||||
modList.innerHTML = `<button class="XButton" onclick="closeMenu();">-</button>
|
||||
<span class="menuTitle">Mod List</span><br><br>
|
||||
<span>NOTE: This list contains mods ONLY available on GitHub. For custom mods hosted elsewhere, enter JS url in the <a href="#modManagerUrl">.JS URL input box</a>.</span>`;
|
||||
const modListUl = document.createElement("ul");
|
||||
modListUl.id = "modListUl";
|
||||
modListUl.style.maxHeight = "50%";
|
||||
modListUl.style.overflowY = "scroll";
|
||||
modList.appendChild(modListUl);
|
||||
parent.appendChild(modList);
|
||||
// add the modManagerUrl back, on a different screen
|
||||
const modManagerUrl = document.createElement("input");
|
||||
modManagerUrl.id = "modManagerUrl";
|
||||
modManagerUrl.type = "text";
|
||||
modManagerUrl.placeholder = ".JS URL...";
|
||||
modManagerUrl.style.marginBottom = "10px";
|
||||
modManagerUrl.onkeydown = (ev) => {
|
||||
if (ev.key == "Enter") {
|
||||
addMod(document.getElementById("modManagerUrl").value);
|
||||
document.getElementById("modManagerUrl").value = '';
|
||||
}
|
||||
this.focus();
|
||||
}
|
||||
parent.appendChild(modManagerUrl);
|
||||
document.getElementById("gameDiv").appendChild(parent);
|
||||
const style = document.createElement("style");
|
||||
style.innerHTML = `#modListUl { margin-top: 20px; }\n#modListUl li { position: relative; list-style-type: none; }\n#modListUl li::before { content: '•'; position: absolute; left: -1.5em; font-size: 1em; font-family: 'Press Start 2P'; }\n.addMod { color: #00cc00; }\n.awaitingReload { color: #666; }\n::-webkit-scrollbar { width: 10px; }\n::-webkit-scrollbar-track { background: #1f1f1f; }\n::-webkit-scrollbar-thumb { background: #aaa; }\n::-webkit-scrollbar-thumb:hover { background: #666; }`;
|
||||
document.head.appendChild(style);
|
||||
updateModList();
|
||||
}
|
||||
|
||||
function updateModList() {
|
||||
const modList = document.getElementById("modListUl");
|
||||
// fetch all the mods from github
|
||||
fetch("https://api.github.com/repos/R74nCom/sandboxels/git/trees/main?recursive=1").then(res => res.json())
|
||||
.then(res => {
|
||||
res.tree.filter(f => f.path.startsWith("mods/")).map(f => f.path).forEach(file => {
|
||||
const link = document.createElement("a");
|
||||
link.target = "_blank";
|
||||
link.innerText = file.slice(5);
|
||||
link.href = file;
|
||||
const span = document.createElement("span");
|
||||
if (awaitingReload.includes(file)) {
|
||||
span.className = "awaitingReload";
|
||||
span.innerText = " -";
|
||||
} else if (enabledMods.includes(file)) {
|
||||
span.className = "removeModX";
|
||||
span.innerText = " X";
|
||||
} else {
|
||||
span.className = "addMod";
|
||||
span.innerText = " +";
|
||||
}
|
||||
span.onclick = () => {
|
||||
// makes sure that you cant modify mod state after its put into the awaiting reload group
|
||||
// those mods will get updated when the site is reloaded and awaitingReload (because its not stored in localStorage) will get reset
|
||||
if (awaitingReload.includes(file)) return;
|
||||
if (enabledMods.includes(file)) {
|
||||
// why on earth addMod adds "mods/" automatically and removeMod doesnt
|
||||
removeMod(file.startsWith("mods/") ? file : "mods/" + file);
|
||||
} else {
|
||||
addMod(file.replace(/mods\//g, ""));
|
||||
}
|
||||
awaitingReload.push(file);
|
||||
span.innerText = " -";
|
||||
span.className = "awaitingReload";
|
||||
}
|
||||
const listItem = document.createElement("li");
|
||||
listItem.appendChild(link);
|
||||
listItem.appendChild(span);
|
||||
modList.appendChild(listItem);
|
||||
}
|
||||
)})
|
||||
}
|
||||
|
||||
function openModList() {
|
||||
document.getElementById("modParent").style.display = "none";
|
||||
const modParent = document.getElementById("modListParent");
|
||||
modParent.style.display = "block";
|
||||
showingMenu = "modList";
|
||||
}
|
||||
|
||||
// called just once, changes the menu title, adds the button, changes the modManagerList css and adds modList component
|
||||
updateModManager();
|
||||
|
||||
closeMenu = function() {
|
||||
if (!showingMenu) { return; }
|
||||
if (showingMenu == "info") {
|
||||
var infoParent = document.getElementById("infoParent");
|
||||
var infoSearch = document.getElementById("infoSearch");
|
||||
infoParent.style.display = "none";
|
||||
infoSearch.value = "";
|
||||
showingMenu = false;
|
||||
infoHistory = [];
|
||||
}
|
||||
else if (showingMenu == "mods") {
|
||||
var modParent = document.getElementById("modParent");
|
||||
var modManagerUrl = document.getElementById("modManagerUrl");
|
||||
modParent.style.display = "none";
|
||||
modManagerUrl.value = "";
|
||||
showingMenu = false;
|
||||
}
|
||||
else if (showingMenu == "modList") {
|
||||
var modParent = document.getElementById("modListParent");
|
||||
var modManagerUrl = document.getElementById("modManagerUrl");
|
||||
modParent.style.display = "none";
|
||||
modManagerUrl.value = "";
|
||||
showingMenu = false;
|
||||
// open mod manager again so the mod list menu looks like a submenu
|
||||
showModManager();
|
||||
}
|
||||
else if (showingMenu == "settings") {
|
||||
var settingsParent = document.getElementById("settingsParent");
|
||||
settingsParent.style.display = "none";
|
||||
showingMenu = false;
|
||||
}
|
||||
else {
|
||||
// do it to all elements with the class "menuParent"
|
||||
var menuParents = document.getElementsByClassName("menuParent");
|
||||
for (var i = 0; i < menuParents.length; i++) {
|
||||
menuParents[i].style.display = "none";
|
||||
}
|
||||
showingMenu = false;
|
||||
}
|
||||
}
|
||||
Loading…
Reference in New Issue