danvics/soulsync
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 1

Two-line batch history layout with descriptive stats

Browse source
This commit is contained in:
JohnBaumb 2026-04-23 00:44:59 -07:00
parent 332392f338
commit 9b3e65c3d8
2 changed files with 36 additions and 15 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

23
webui/static/pages-extra.js
View file

@ -2832,15 +2832,17 @@ function _adlRenderBatchHistory() {
const failed = h.tracks_failed || 0;
const total = h.total_tracks || 0;
// Build stats: "found/total Xnew Xfailed"
// Build stats line: "X in library · X downloaded · X failed (of N)"
const statsParts = [];
if (found > 0 || downloaded > 0) {
const owned = found - downloaded; // already in library before this sync
if (owned > 0) statsParts.push(`<span style="color:rgba(74,222,128,0.7)" title="Already in library">${owned}</span>`);
if (downloaded > 0) statsParts.push(`<span style="color:rgba(96,165,250,0.7)" title="Downloaded">${downloaded} new</span>`);
if (owned > 0) statsParts.push(`<span style="color:rgba(74,222,128,0.7)" title="Already in library">${owned} in library</span>`);
if (downloaded > 0) statsParts.push(`<span style="color:rgba(96,165,250,0.7)" title="Downloaded">${downloaded} downloaded</span>`);
}
if (failed > 0) statsParts.push(`<span style="color:#ef4444" title="Failed">${failed} failed</span>`);
if (statsParts.length === 0) statsParts.push(`0/${total}`);
const notFound = total - found - failed;
if (notFound > 0) statsParts.push(`<span title="Not found">${notFound} not found</span>`);
if (statsParts.length === 0) statsParts.push(`${total} tracks`);
let dateText = '';
if (h.completed_at) {
@ -2877,11 +2879,16 @@ function _adlRenderBatchHistory() {
: '';
return `<div class="adl-batch-history-item">
${histDot}
${thumb}
<div class="adl-batch-history-name">${name} ${sourceLabel}</div>
<div class="adl-batch-history-stats">${statsParts.join(' · ')}</div>
<div class="adl-batch-history-date">${dateText}</div>
<div class="adl-batch-history-content">
<div class="adl-batch-history-row1">
${histDot}
<span class="adl-batch-history-name">${name}</span>
${sourceLabel}
<span class="adl-batch-history-date">${dateText}</span>
</div>
<div class="adl-batch-history-row2">${statsParts.join(' · ')}</div>
</div>
</div>`;
}).join('');
}

28
webui/static/style.css
View file

@ -57115,37 +57115,51 @@ body.reduce-effects *::after {
display: flex;
align-items: center;
gap: 8px;
padding: 6px 0;
padding: 7px 0;
border-bottom: 1px solid rgba(255, 255, 255, 0.02);
}
.adl-batch-history-thumb {
width: 24px;
height: 24px;
width: 28px;
height: 28px;
border-radius: 3px;
object-fit: cover;
flex-shrink: 0;
}
.adl-batch-history-name {
.adl-batch-history-content {
flex: 1;
min-width: 0;
}
.adl-batch-history-row1 {
display: flex;
align-items: center;
gap: 6px;
}
.adl-batch-history-name {
font-size: 0.75rem;
color: rgba(255, 255, 255, 0.5);
color: rgba(255, 255, 255, 0.55);
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
flex: 1;
min-width: 0;
}
.adl-batch-history-stats {
.adl-batch-history-row2 {
font-size: 0.68rem;
color: rgba(255, 255, 255, 0.3);
flex-shrink: 0;
margin-top: 2px;
padding-left: 12px;
}
.adl-batch-history-date {
font-size: 0.65rem;
color: rgba(255, 255, 255, 0.2);
flex-shrink: 0;
margin-left: auto;
}
/* ---- Responsive ---- */