full release edit capabilities oh my goodness gracious
Signed-off-by: ari melody <ari@arimelody.me>
This commit is contained in:
parent
34cddcfdb2
commit
604e2a4a7c
25 changed files with 1043 additions and 202 deletions
|
@ -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);
|
||||
});
|
||||
});
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue