full release edit capabilities oh my goodness gracious

Signed-off-by: ari melody <ari@arimelody.me>
This commit is contained in:
ari melody 2024-08-31 01:30:30 +01:00
parent 34cddcfdb2
commit 604e2a4a7c
25 changed files with 1043 additions and 202 deletions

View file

@ -27,7 +27,7 @@
<input type="checkbox" name="primary" {{if .Primary}}checked{{end}}>
</div>
</div>
<button type="button" class="delete">Delete</button>
<a class="delete">Delete</a>
</div>
</li>
{{end}}
@ -40,6 +40,8 @@
</form>
<script type="module">
import { makeMagicList } from "/admin/static/admin.js";
(() => {
const container = document.getElementById("editcredits");
const form = document.querySelector("#editcredits form");
@ -47,39 +49,21 @@
const addCreditBtn = document.getElementById("add-credit");
const discardBtn = form.querySelector("button#discard");
function creditFromElement(el) {
const artistID = el.dataset.artist;
const roleInput = el.querySelector(`input[name="role"]`)
const primaryInput = el.querySelector(`input[name="primary"]`)
const deleteBtn = el.querySelector("button.delete");
let credit = {
"artist": artistID,
"role": roleInput.value,
"primary": primaryInput.checked,
};
roleInput.addEventListener("change", () => {
credit.role = roleInput.value;
});
primaryInput.addEventListener("change", () => {
credit.primary = primaryInput.checked;
});
deleteBtn.addEventListener("click", e => {
if (!confirm("Are you sure you want to delete " + artistID + "'s credit?")) return;
el.remove();
credits = credits.filter(credit => credit.artist != artistID);
});
return credit;
}
let credits = [...form.querySelectorAll(".credit")].map(el => creditFromElement(el));
makeMagicList(creditList, ".credit");
creditList.addEventListener("htmx:afterSwap", e => {
const el = creditList.children[creditList.children.length - 1];
const credit = creditFromElement(el);
credits.push(credit);
const artistID = el.dataset.artist;
const deleteBtn = el.querySelector("a.delete");
deleteBtn.addEventListener("click", e => {
if (!confirm("Are you sure you want to delete " + artistID + "'s credit?")) return;
el.remove();
});
el.addEventListener("dragstart", () => { el.classList.add("moving") });
el.addEventListener("dragend", () => { el.classList.remove("moving") });
});
container.showModal();
@ -89,12 +73,18 @@
});
form.addEventListener("submit", e => {
const credits = [...creditList.querySelectorAll(".credit")].map(el => {
return {
"artist": el.dataset.artist,
"role": el.querySelector(`input[name="role"]`).value,
"primary": el.querySelector(`input[name="primary"]`).checked,
};
});
e.preventDefault();
fetch(form.action, {
method: "PUT",
headers: {
"Content-Type": "application/json",
},
headers: { "Content-Type": "application/json" },
body: JSON.stringify(credits)
}).then(res => {
if (res.ok) location = location;
@ -105,7 +95,7 @@
});
}
}).catch(err => {
alert("Failed to update credits. Check the console for details");
alert("Failed to update credits. Check the console for details.");
console.error(err);
});
});