jens/brewpi
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Browser GUI: swap total/step countdown order; always use h:mm:ss format

Browse Source 
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:
jens
2026-06-28 12:00:11 +02:00
co-authored by Claude Sonnet 4.6
parent 8714a140bb
commit b54cda2f97
2 changed files with 8 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files
web/app.js
+6 -9
View File
@@ -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}`;
web/index.html
+2 -2
View File
@@ -20,8 +20,8 @@
<button id="btn-sud-pause" class="transport-btn transport-pause" title="Pause">&#9646;&#9646;</button>
<button id="btn-sud-stop" class="transport-btn transport-stop" title="Stop">&#9632;</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>