tracks can be edited! + major template overhaul

admin/static/edit-release.js

@@ -1,112 +1,127 @@
 import Stateful from "/script/silver.min.js"
 
 const releaseID = document.getElementById("release").dataset.id;
-const title_input = document.getElementById("title");
-const artwork_img = document.getElementById("artwork");
-const artwork_input = document.getElementById("artwork-file");
-const type_input = document.getElementById("type");
-const desc_input = document.getElementById("description");
-const date_input = document.getElementById("release-date");
-const buyname_input = document.getElementById("buyname");
-const buylink_input = document.getElementById("buylink");
-const vis_input = document.getElementById("visibility");
-const save_btn = document.getElementById("save");
-
-var artwork_data = artwork_img.attributes.src.value;
-
-var token = atob(localStorage.getItem("arime-token"));
+const titleInput = document.getElementById("title");
+const artworkImg = document.getElementById("artwork");
+const artworkInput = document.getElementById("artwork-file");
+const typeInput = document.getElementById("type");
+const descInput = document.getElementById("description");
+const dateInput = document.getElementById("release-date");
+const buynameInput = document.getElementById("buyname");
+const buylinkInput = document.getElementById("buylink");
+const visInput = document.getElementById("visibility");
+const saveBtn = document.getElementById("save");
+const deleteBtn = document.getElementById("delete");
 
+var artworkData = artworkImg.attributes.src.value;
 var edited = new Stateful(false);
+var releaseData = updateData(undefined);
 
-var release_data = update_data(undefined);
-
-function update_data(old) {
-    var release_data = {
-        visible: vis_input.value === "true",
-        title: title_input.value,
-        description: desc_input.value,
-        type: type_input.value,
-        releaseDate: date_input.value,
-        artwork: artwork_data,
-        buyname: buyname_input.value,
-        buylink: buylink_input.value,
+function updateData(old) {
+    var releaseData = {
+        visible: visInput.value === "true",
+        title: titleInput.value,
+        description: descInput.value,
+        type: typeInput.value,
+        releaseDate: dateInput.value,
+        artwork: artworkData,
+        buyname: buynameInput.value,
+        buylink: buylinkInput.value,
     };
 
-    if (release_data && release_data != old) {
+    if (releaseData && releaseData != old) {
         edited.set(true);
     }
 
-    return release_data;
+    return releaseData;
 }
 
-function save_release() {
-    console.table(release_data);
-
-    (async () => {
-        const res = await fetch(
-            "/api/v1/music/" + releaseID, {
-            method: "PUT",
-            body: JSON.stringify(release_data),
-            headers: {
-                "Content-Type": "application/json",
-                "Authorisation": "Bearer " + token,
-            },
-        });
+function saveRelease() {
+    console.table(releaseData);
 
+    fetch("/api/v1/music/" + releaseID, {
+        method: "PUT",
+        body: JSON.stringify(releaseData),
+        headers: { "Content-Type": "application/json" }
+    }).then(res => {
         if (!res.ok) {
-            const text = await res.text();
-            console.error(text);
-            alert(text);
+            res.text().then(error => {
+                console.error(error);
+                alert("Failed to update release: " + error);
+            });
             return;
         }
 
         location = location;
-    })();
+    });
+}
+
+function deleteRelease() {
+    fetch("/api/v1/music/" + releaseID, {
+        method: "DELETE",
+    }).then(res => {
+        if (!res.ok) {
+            res.text().then(error => {
+                console.error(error);
+                alert("Failed to delete release: " + error);
+            });
+            return;
+        }
+
+        location = "/admin";
+    });
 }
 
 edited.onUpdate(edited => {
-    save_btn.disabled = !edited;
+    saveBtn.disabled = !edited;
 })
 
-title_input.addEventListener("change", () => {
-    release_data = update_data(release_data);
+titleInput.addEventListener("change", () => {
+    releaseData = updateData(releaseData);
 });
-artwork_img.addEventListener("click", () => {
-    artwork_input.addEventListener("change", () => {
-        if (artwork_input.files.length > 0) {
+artworkImg.addEventListener("click", () => {
+    artworkInput.addEventListener("change", () => {
+        if (artworkInput.files.length > 0) {
             const reader = new FileReader();
             reader.onload = e => {
                 const data = e.target.result;
-                artwork_img.src = data;
-                artwork_data = data;
-                release_data = update_data(release_data);
+                artworkImg.src = data;
+                artworkData = data;
+                releaseData = updateData(releaseData);
             };
-            reader.readAsDataURL(artwork_input.files[0]);
+            reader.readAsDataURL(artworkInput.files[0]);
         }
     });
-    artwork_input.click();
+    artworkInput.click();
 });
-type_input.addEventListener("change", () => {
-    release_data = update_data(release_data);
+typeInput.addEventListener("change", () => {
+    releaseData = updateData(releaseData);
 });
-desc_input.addEventListener("change", () => {
-    release_data = update_data(release_data);
+descInput.addEventListener("change", () => {
+    releaseData = updateData(releaseData);
 });
-date_input.addEventListener("change", () => {
-    release_data = update_data(release_data);
+dateInput.addEventListener("change", () => {
+    releaseData = updateData(releaseData);
 });
-buyname_input.addEventListener("change", () => {
-    release_data = update_data(release_data);
+buynameInput.addEventListener("change", () => {
+    releaseData = updateData(releaseData);
 });
-buylink_input.addEventListener("change", () => {
-    release_data = update_data(release_data);
+buylinkInput.addEventListener("change", () => {
+    releaseData = updateData(releaseData);
 });
-vis_input.addEventListener("change", () => {
-    release_data = update_data(release_data);
+visInput.addEventListener("change", () => {
+    releaseData = updateData(releaseData);
 });
 
-save_btn.addEventListener("click", () => {
+saveBtn.addEventListener("click", () => {
     if (!edited.get()) return;
+    saveRelease();
+});
 
-    save_release();
-})
+deleteBtn.addEventListener("click", () => {
+    if (releaseID != prompt(
+        "You are about to permanently delete " + releaseID + ". " +
+        "This action is irreversible. " +
+        "Please enter \"" + releaseID + "\" to continue.")) return;
+    deleteRelease();
+});