From b54cda2f97f885f40a3c1f39d0d192b8ffdb7cfb Mon Sep 17 00:00:00 2001 From: Jens Ahrensfeld Date: Sun, 28 Jun 2026 12:00:11 +0200 Subject: [PATCH] Browser GUI: swap total/step countdown order; always use h:mm:ss format Total remaining now appears above step remaining in the header. Both countdowns and all other duration displays always use h:mm:ss format regardless of whether hours is zero, so the layout never shifts width. Co-Authored-By: Claude Sonnet 4.6 Claude-Session: https://claude.ai/code/session_01SH2D4LRuCnhLSzoYerAfJX --- web/app.js | 15 ++++++--------- web/index.html | 4 ++-- 2 files changed, 8 insertions(+), 11 deletions(-) diff --git a/web/app.js b/web/app.js index 0486370..0c17348 100644 --- a/web/app.js +++ b/web/app.js @@ -90,10 +90,7 @@ function formatDuration(seconds) { const hours = Math.floor(seconds / 3600); const minutes = Math.floor((seconds % 3600) / 60); const secs = seconds % 60; - if (hours) { - return `${hours}:${String(minutes).padStart(2, '0')}:${String(secs).padStart(2, '0')}`; - } - return `${minutes}:${String(secs).padStart(2, '0')}`; + return `${hours}:${String(minutes).padStart(2, '0')}:${String(secs).padStart(2, '0')}`; } // --- Sud schedule resolution - ports components/sud.py's _merge_defaults()/ @@ -166,7 +163,7 @@ function createStepPlate(index, step, resolvedTemp) { title.textContent = `Step ${index + 1}: ${step.descr || ''}`; const remaining = document.createElement('div'); remaining.className = 'remaining'; - remaining.textContent = '--:--'; + remaining.textContent = '-:--:--'; const target = document.createElement('div'); target.className = 'field span2'; const actual = document.createElement('div'); @@ -245,7 +242,7 @@ function updateStepPlates() { const total = Math.max(0, endT - startT); plate.remaining.textContent = formatDuration(Math.max(0, Math.min(total, endT - currentElapsed))); } else { - plate.remaining.textContent = '--:--'; + plate.remaining.textContent = '-:--:--'; } if (sudStepIndex === null || i > sudStepIndex) { @@ -279,8 +276,8 @@ function updateStepPlates() { function updateHeaderCountdown() { const currentElapsed = (elapsed !== null) ? elapsed : 0; const n = sudSchedule.length; - let stepText = '--:--'; - let totalText = '--:--'; + let stepText = '-:--:--'; + let totalText = '-:--:--'; let visible = false; if (n > 0 && sudStepIndex !== null) { visible = true; @@ -465,7 +462,7 @@ function updateStatusLine() { const pot = sudPotMass; const massText = `Pot: ${pot.toFixed(2)} kg, Water: ${water.toFixed(2)} kg, Grain ${grain.toFixed(2)} kg, total ${(pot + water + grain).toFixed(2)} kg`; text = text ? `${text} ${massText}` : massText; - const elapsedText = `Elapsed ${elapsed !== null ? formatDuration(elapsed) : '--:--'}`; + const elapsedText = `Elapsed ${elapsed !== null ? formatDuration(elapsed) : '-:--:--'}`; const totalEnergyKwh = (Object.values(energyByStep).reduce((a, b) => a + b, 0) + energyCurrent) / 1000.0; const energyText = `Energy ${totalEnergyKwh.toFixed(2)} kWh`; el.textContent = `${text} ${elapsedText} ${energyText}`; diff --git a/web/index.html b/web/index.html index efc44ea..ded092d 100644 --- a/web/index.html +++ b/web/index.html @@ -20,8 +20,8 @@