SpaceApper/options/options.js
2024-07-28 23:22:45 +02:00

81 lines
2.2 KiB
JavaScript

import { createSpaces, removeSpaces, hashSpaceName } from "../scripts/spaces.mjs";
import { getApps, storeApps } from "../scripts/storage.mjs";
function buildInputRow(name, value) {
const td = document.createElement("td");
const input = document.createElement("input");
input.setAttribute("type", "text");
input.setAttribute("name", name);
input.setAttribute("value", value);
td.appendChild(input);
return td;
}
function buildSpaceElement(app) {
const tr = document.createElement("tr");
tr.className = "space";
tr.appendChild(buildInputRow("title", app.title));
tr.appendChild(buildInputRow("url", app.url));
tr.appendChild(buildInputRow("icon", app.icon));
const removeTd = document.createElement("td");
const removeButton = document.createElement("button");
removeButton.setAttribute("type", "button");
removeButton.addEventListener("click", removeSpace);
removeButton.textContent = "Remove";
removeTd.appendChild(removeButton);
tr.appendChild(removeTd);
return tr;
}
async function setupPage() {
const apps = await getApps();
const spaces = document.querySelector("#spaces > tbody");
apps.forEach((app) => {
spaces.appendChild(buildSpaceElement(app));
});
}
function addSpace() {
const spaces = document.querySelector("#spaces > tbody");
const newApp = {
title: "",
url: "",
icon: "",
};
spaces.appendChild(buildSpaceElement(newApp));
}
function removeSpace(e) {
e.target.parentElement.parentElement.remove();
}
async function saveChanges(e) {
await e.preventDefault();
const apps = [];
const spaces = Array.from(document.getElementsByClassName("space"));
spaces.forEach((space) => {
const app = {
name: hashSpaceName(space.querySelector("input[name='url']").value),
title: space.querySelector("input[name='title']").value,
url: space.querySelector("input[name='url']").value,
icon: space.querySelector("input[name='icon']").value,
};
apps.push(app);
});
await removeSpaces();
await storeApps(apps);
await createSpaces();
}
document.addEventListener("DOMContentLoaded", setupPage);
document.getElementById("add").addEventListener("click", addSpace);
document.querySelector("form").addEventListener("submit", saveChanges);