Show watchlist refresh progress as a single bar
This commit is contained in:
+74
-5
@@ -254,6 +254,44 @@ WATCHLIST_HTML = r"""<!doctype html>
|
||||
color: #ddd0ff;
|
||||
font-size: 13px;
|
||||
}
|
||||
.refresh-progress {
|
||||
display: none;
|
||||
gap: 7px;
|
||||
min-width: 0;
|
||||
}
|
||||
.refresh-progress.visible {
|
||||
display: grid;
|
||||
}
|
||||
.refresh-progress-header {
|
||||
align-items: center;
|
||||
color: var(--muted);
|
||||
display: flex;
|
||||
font-size: 12px;
|
||||
font-weight: 700;
|
||||
justify-content: space-between;
|
||||
gap: 10px;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
.refresh-progress-track {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border: 1px solid var(--line);
|
||||
border-radius: 999px;
|
||||
height: 11px;
|
||||
overflow: hidden;
|
||||
}
|
||||
.refresh-progress-fill {
|
||||
background: linear-gradient(90deg, var(--accent), var(--accent-2));
|
||||
border-radius: inherit;
|
||||
height: 100%;
|
||||
transition: width 0.2s ease;
|
||||
width: 0%;
|
||||
}
|
||||
.refresh-progress-current {
|
||||
color: #ddd0ff;
|
||||
font-size: 13px;
|
||||
min-height: 20px;
|
||||
overflow-wrap: anywhere;
|
||||
}
|
||||
.field-hint {
|
||||
color: var(--muted);
|
||||
font-size: 12px;
|
||||
@@ -716,6 +754,16 @@ WATCHLIST_HTML = r"""<!doctype html>
|
||||
<button class="ghost" id="refreshAllWatchlistBtn" type="button">Refresh All</button>
|
||||
</div>
|
||||
<div class="notice" id="notice"></div>
|
||||
<div class="refresh-progress" id="refreshJobStatus">
|
||||
<div class="refresh-progress-header">
|
||||
<span>Refresh progress</span>
|
||||
<span id="refreshJobCount">0 / 0</span>
|
||||
</div>
|
||||
<div class="refresh-progress-track" aria-hidden="true">
|
||||
<div class="refresh-progress-fill" id="refreshJobFill"></div>
|
||||
</div>
|
||||
<div class="refresh-progress-current" id="refreshJobCurrent"></div>
|
||||
</div>
|
||||
<div class="summary-grid" id="watchlist-summary">
|
||||
<div class="summary-card">
|
||||
<span class="summary-value">0</span>
|
||||
@@ -737,7 +785,6 @@ WATCHLIST_HTML = r"""<!doctype html>
|
||||
<div>
|
||||
<h2>Watchlist library</h2>
|
||||
<p class="muted" id="watchlist-meta">Compact poster grid for faster scanning.</p>
|
||||
<p class="muted" id="refreshJobStatus"></p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="category-tabs" id="watchlistTabs"></div>
|
||||
@@ -867,18 +914,40 @@ WATCHLIST_HTML = r"""<!doctype html>
|
||||
button.textContent = running ? "Refreshing..." : "Refresh All";
|
||||
}
|
||||
|
||||
function refreshJobPercent(job) {
|
||||
const total = Number((job || {}).total || 0);
|
||||
if (total <= 0) return 0;
|
||||
const completed = Math.max(0, Math.min(total, Number((job || {}).completed || 0)));
|
||||
return Math.round((completed / total) * 100);
|
||||
}
|
||||
|
||||
function setRefreshJobStatus(job) {
|
||||
const el = $("refreshJobStatus");
|
||||
if (!el) return;
|
||||
if (!job) {
|
||||
el.textContent = "";
|
||||
el.classList.remove("visible");
|
||||
$("refreshJobFill").style.width = "0%";
|
||||
$("refreshJobCount").textContent = "0 / 0";
|
||||
$("refreshJobCurrent").textContent = "";
|
||||
return;
|
||||
}
|
||||
const completed = Number(job.completed || 0);
|
||||
const total = Number(job.total || 0);
|
||||
const percent = refreshJobPercent(job);
|
||||
el.classList.toggle("visible", job.status === "running" || job.status === "pending");
|
||||
$("refreshJobFill").style.width = `${percent}%`;
|
||||
$("refreshJobCount").textContent = `${completed} / ${total}`;
|
||||
if (job.status === "pending") {
|
||||
$("refreshJobCurrent").textContent = job.message || "Waiting to start refresh.";
|
||||
return;
|
||||
}
|
||||
if (job.status === "running") {
|
||||
el.textContent = `${job.completed || 0}/${job.total || 0} refreshed${job.current_title ? ` · ${job.current_title}` : ""}`;
|
||||
$("refreshJobCurrent").textContent = job.current_title
|
||||
? `Refreshing ${job.current_title}`
|
||||
: "Refreshing watchlist entries";
|
||||
return;
|
||||
}
|
||||
el.textContent = job.message || "";
|
||||
$("refreshJobCurrent").textContent = "";
|
||||
}
|
||||
|
||||
function coverInitials(title) {
|
||||
@@ -1497,7 +1566,7 @@ WATCHLIST_HTML = r"""<!doctype html>
|
||||
setRefreshAllButton(running);
|
||||
setRefreshJobStatus(job);
|
||||
if (running) {
|
||||
setNotice(job.message || "Refreshing all watchlist entries...");
|
||||
setNotice("");
|
||||
} else if (job && wasRunning && refreshOnComplete) {
|
||||
const message = job.message || "Watchlist refreshed.";
|
||||
await fetchWatchlist();
|
||||
|
||||
Reference in New Issue
Block a user