Fix redownload progress bar visibility
Bar was using var(--accent) which can be dark/invisible against the modal background. Now uses bright green gradient with glow shadow. Also thicker (8px) and queries DOM fresh each poll tick to prevent stale references.
This commit is contained in:
parent
19538233fd
commit
04bf2c5c4f
2 changed files with 15 additions and 16 deletions
|
|
@ -43282,19 +43282,22 @@ if (false) {
|
|||
}
|
||||
|
||||
function _pollRedownloadProgress(taskId, overlay) {
|
||||
const bar = document.getElementById('redownload-progress-bar');
|
||||
const status = document.getElementById('redownload-progress-status');
|
||||
let completed = false;
|
||||
|
||||
const poll = setInterval(async () => {
|
||||
if (completed) return;
|
||||
|
||||
// Get fresh DOM references every tick (in case DOM was rebuilt)
|
||||
const bar = document.getElementById('redownload-progress-bar');
|
||||
const status = document.getElementById('redownload-progress-status');
|
||||
|
||||
try {
|
||||
// Poll real download progress from /api/downloads/status
|
||||
const dlRes = await fetch('/api/downloads/status');
|
||||
const dlData = await dlRes.json();
|
||||
const transfers = dlData.transfers || [];
|
||||
|
||||
// Find our transfer — match by checking active non-completed transfers
|
||||
// Find any active transfer
|
||||
let bestTransfer = null;
|
||||
for (const t of transfers) {
|
||||
const st = (t.state || '').toLowerCase();
|
||||
|
|
@ -43313,22 +43316,17 @@ function _pollRedownloadProgress(taskId, overlay) {
|
|||
|
||||
if (bar) bar.style.width = `${Math.min(95, pct)}%`;
|
||||
if (status) {
|
||||
if (total > 0) {
|
||||
status.textContent = `Downloading... ${Math.round(pct)}% (${transferredMB} / ${totalMB} MB)`;
|
||||
} else {
|
||||
status.textContent = `Downloading... ${Math.round(pct)}%`;
|
||||
}
|
||||
status.textContent = total > 0
|
||||
? `Downloading... ${Math.round(pct)}% (${transferredMB} / ${totalMB} MB)`
|
||||
: `Downloading... ${Math.round(pct)}%`;
|
||||
}
|
||||
} else {
|
||||
// No active Soulseek transfer — might be a streaming source (Tidal/YouTube)
|
||||
// or post-processing phase
|
||||
if (bar && parseFloat(bar.style.width) < 50) {
|
||||
bar.style.width = '60%';
|
||||
}
|
||||
// No active slskd transfer — streaming source or post-processing
|
||||
if (bar) bar.style.width = '80%';
|
||||
if (status) status.textContent = 'Processing...';
|
||||
}
|
||||
|
||||
// Check for completion — look for completed transfers or batch gone
|
||||
// Check for batch completion
|
||||
const procRes = await fetch('/api/active-processes');
|
||||
const procData = await procRes.json();
|
||||
const procs = procData.active_processes || [];
|
||||
|
|
@ -43354,6 +43352,7 @@ function _pollRedownloadProgress(taskId, overlay) {
|
|||
setTimeout(() => {
|
||||
if (!completed) {
|
||||
clearInterval(poll);
|
||||
const status = document.getElementById('redownload-progress-status');
|
||||
if (status) status.textContent = 'Download may still be in progress. Check the dashboard.';
|
||||
}
|
||||
}, 300000);
|
||||
|
|
|
|||
|
|
@ -52354,8 +52354,8 @@ tr.tag-diff-same {
|
|||
.redownload-progress { padding: 20px 0; text-align: center; }
|
||||
.redownload-progress-title { font-size: 13px; font-weight: 600; color: rgba(255,255,255,0.8); }
|
||||
.redownload-progress-from { font-size: 11px; color: rgba(255,255,255,0.3); margin: 4px 0 16px; }
|
||||
.redownload-progress-bar-wrap { height: 6px; background: rgba(255,255,255,0.06); border-radius: 3px; overflow: hidden; }
|
||||
.redownload-progress-bar { height: 100%; background: var(--accent); border-radius: 3px; width: 0; transition: width 0.5s ease; }
|
||||
.redownload-progress-bar-wrap { height: 8px; background: rgba(255,255,255,0.08); border-radius: 4px; overflow: hidden; }
|
||||
.redownload-progress-bar { height: 100%; background: linear-gradient(90deg, #4caf50, #66bb6a); border-radius: 4px; width: 0; transition: width 0.5s ease; box-shadow: 0 0 8px rgba(76, 175, 80, 0.4); }
|
||||
.redownload-progress-status { font-size: 11px; color: rgba(255,255,255,0.3); margin-top: 12px; }
|
||||
|
||||
/* Action buttons */
|
||||
|
|
|
|||
Loading…
Reference in a new issue