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 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01SH2D4LRuCnhLSzoYerAfJX
This commit is contained in:
+5
-8
@@ -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')}`;
|
||||
}
|
||||
|
||||
// --- 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}`;
|
||||
|
||||
+2
-2
@@ -20,8 +20,8 @@
|
||||
<button id="btn-sud-pause" class="transport-btn transport-pause" title="Pause">▮▮</button>
|
||||
<button id="btn-sud-stop" class="transport-btn transport-stop" title="Stop">■</button>
|
||||
<span id="header-countdown" class="hidden">
|
||||
<span class="hdr-cdown-row"><span class="hdr-cdown-lbl">step</span><span id="hdr-step-remaining">--:--</span></span>
|
||||
<span class="hdr-cdown-row"><span class="hdr-cdown-lbl">total</span><span id="hdr-total-remaining">--:--</span></span>
|
||||
<span class="hdr-cdown-row"><span class="hdr-cdown-lbl">total</span><span id="hdr-total-remaining">-:--:--</span></span>
|
||||
<span class="hdr-cdown-row"><span class="hdr-cdown-lbl">step</span><span id="hdr-step-remaining">-:--:--</span></span>
|
||||
</span>
|
||||
</span>
|
||||
</header>
|
||||
|
||||
Reference in New Issue
Block a user