Dymas/h-play
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Show metadata as read-only by default

Browse Source
This commit is contained in:
Dymas
2026-09-15 16:06:41 +02:00
parent 553bd6f427
commit 1a94607712
6 changed files with 106 additions and 30 deletions
Download Patch File Download Diff File Expand all files Collapse all files
public/assets/app.js
+61 -26
View File
@@ -120,25 +120,26 @@ function renderDetails(title) {
<p>${escapeHtml(title.folder)} · ${title.count} file${title.count === 1 ? "" : "s"} · ${bytes(title.size)}</p>
</div>
<div class="summary__actions">
<button id="editMetaBtn" type="button">Edit</button>
<button id="fetchMetadataBtn" type="button">Metadata</button>
<button id="makeThumbBtn" type="button">Thumbnail</button>
</div>
</div>
<form id="metaForm" class="meta-form">
<label>
<div id="metaView" class="meta-view">
<section>
<span>Display title</span>
<input name="title" value="${escapeAttr(title.title)}">
</label>
<label>
<span>Thumbnail path or URL</span>
<input name="thumbnail" value="${escapeAttr(title.thumbnail)}" placeholder="/thumbs/example.jpg">
</label>
<label>
<span>Short description</span>
<textarea name="description" rows="5" placeholder="Add a private note or synopsis">${escapeHtml(title.description)}</textarea>
</label>
<button class="primary" type="submit">Save metadata</button>
</form>
<p>${escapeHtml(title.title)}</p>
</section>
<section>
<span>Thumbnail</span>
<p>${title.thumbnail ? escapeHtml(title.thumbnail) : "No thumbnail set"}</p>
</section>
<section>
<span>Description</span>
<p>${title.description ? escapeHtml(title.description) : "No description yet"}</p>
</section>
</div>
<div id="metaEditMount"></div>
</div>
</div>
<div class="seasons">
@@ -146,18 +147,8 @@ function renderDetails(title) {
</div>
`;
document.querySelector("#metaForm").addEventListener("submit", async (event) => {
event.preventDefault();
const form = new FormData(event.currentTarget);
await api(`/api/titles/${encodeURIComponent(title.id)}`, {
method: "PATCH",
body: JSON.stringify({
title: form.get("title"),
thumbnail: form.get("thumbnail"),
description: form.get("description")
})
});
await loadLibrary();
document.querySelector("#editMetaBtn").addEventListener("click", () => {
renderMetadataForm(title);
});
document.querySelector("#makeThumbBtn").addEventListener("click", async (event) => {
@@ -187,6 +178,50 @@ function renderDetails(title) {
});
}
function renderMetadataForm(title) {
document.querySelector("#metaView").classList.add("hidden");
const mount = document.querySelector("#metaEditMount");
mount.innerHTML = `
<form id="metaForm" class="meta-form">
<label>
<span>Display title</span>
<input name="title" value="${escapeAttr(title.title)}">
</label>
<label>
<span>Thumbnail path or URL</span>
<input name="thumbnail" value="${escapeAttr(title.thumbnail)}" placeholder="/thumbs/example.jpg">
</label>
<label>
<span>Short description</span>
<textarea name="description" rows="5" placeholder="Add a private note or synopsis">${escapeHtml(title.description)}</textarea>
</label>
<div class="meta-form__actions">
<button class="primary" type="submit">Save metadata</button>
<button id="cancelMetaBtn" class="ghost" type="button">Cancel</button>
</div>
</form>
`;
document.querySelector("#cancelMetaBtn").addEventListener("click", () => {
mount.innerHTML = "";
document.querySelector("#metaView").classList.remove("hidden");
});
document.querySelector("#metaForm").addEventListener("submit", async (event) => {
event.preventDefault();
const form = new FormData(event.currentTarget);
await api(`/api/titles/${encodeURIComponent(title.id)}`, {
method: "PATCH",
body: JSON.stringify({
title: form.get("title"),
thumbnail: form.get("thumbnail"),
description: form.get("description")
})
});
await loadLibrary();
});
}
function renderSeason(season) {
return `
<section class="season">