fix(dashcam): use style.display instead of hidden attr (d-flex overrides hidden)

Bootstrap d-flex sets display:flex !important which beats the HTML hidden
attribute. Switch to style.display='none'/'flex' for both status bars.

Co-authored-by: Copilot <[email protected]>
This commit is contained in:
Mathieu Moran
2026-08-10 00:51:27 -04:00
co-authored by Copilot
parent b064b4f902
commit 5b2854fbec
2 changed files with 7 additions and 10 deletions
+5 -8
View File
@@ -27,14 +27,12 @@ function showImportProgress(msg, total) {
importStartTime = Date.now();
importStatus.textContent = msg;
importEta.textContent = '';
importStatusBar.hidden = false;
importResultBar.hidden = true;
// Update ETA every second based on elapsed time vs total
importStatusBar.style.display = 'flex';
importResultBar.style.display = 'none';
clearInterval(importEtaInterval);
if (importTotal > 0) {
importEtaInterval = setInterval(() => {
const elapsed = (Date.now() - importStartTime) / 1000;
// rough heuristic: ~3s per video on average
const estTotal = importTotal * 3;
const remaining = Math.max(0, Math.round(estTotal - elapsed));
importEta.textContent = remaining > 0 ? `~${remaining}s remaining` : '';
@@ -44,11 +42,10 @@ function showImportProgress(msg, total) {
function showImportResult(msg) {
clearInterval(importEtaInterval);
importStatusBar.hidden = true;
importStatusBar.style.display = 'none';
importResult.textContent = msg;
importResultBar.hidden = false;
// Auto-hide result after 10s
setTimeout(() => { importResultBar.hidden = true; }, 10000);
importResultBar.style.display = 'block';
setTimeout(() => { importResultBar.style.display = 'none'; }, 10000);
}
function fetchJson(url, options) {
+2 -2
View File
@@ -18,12 +18,12 @@
<i class="fas fa-download me-1"></i>Import all
</button>
</div>
<div id="dash-import-status-bar" class="card-footer py-2 d-flex align-items-center gap-2" hidden>
<div id="dash-import-status-bar" class="card-footer py-2 align-items-center gap-2" style="display:none;">
<div class="spinner-border spinner-border-sm text-primary" role="status"></div>
<span id="dash-import-status" class="small text-muted flex-grow-1">Importing…</span>
<span id="dash-import-eta" class="small text-muted text-nowrap"></span>
</div>
<div id="dash-import-result-bar" class="card-footer py-2 small text-muted" hidden>
<div id="dash-import-result-bar" class="card-footer py-2 small text-muted" style="display:none;">
<span id="dash-import-result"></span>
</div>
</div>