VARASYS/metronome
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Countdown: keep counting into negative (overtime) instead of stopping at 0

Browse source 
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
Me Here 2026-05-24 18:12:16 -05:00
parent a447df39e9
commit 72147f5b32
1 changed files with 7 additions and 7 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

14
index.html
View file

@ -122,6 +122,7 @@
border:1px solid var(--edge); border-radius:14px; padding:16px; box-shadow:0 10px 30px rgba(0,0,0,.25); } border:1px solid var(--edge); border-radius:14px; padding:16px; box-shadow:0 10px 30px rgba(0,0,0,.25); }
.tval { font-family:"Courier New",monospace; font-size:13px; color:var(--hot); min-width:42px; } .tval { font-family:"Courier New",monospace; font-size:13px; color:var(--hot); min-width:42px; }
.tval.low { color:#ffb454; } .tval.low { color:#ffb454; }
.tval.over { color:#ff7b6b; }
@media (max-width: 820px) { @media (max-width: 820px) {
#app { display:block; } #app { display:block; }
#routineTray { position:static; max-height:none; width:auto; margin-top:18px; } #routineTray { position:static; max-height:none; width:auto; margin-top:18px; }
@ -951,25 +952,24 @@ function drawLoop() {
PRACTICE TIMERS — advance only while the metronome is running PRACTICE TIMERS — advance only while the metronome is running
========================================================================= */ ========================================================================= */
const timers = { elapsedMs: 0, totalMs: 5 * 60000, remainingMs: 5 * 60000, last: 0 }; const timers = { elapsedMs: 0, totalMs: 5 * 60000, remainingMs: 5 * 60000, last: 0 };
function fmtClock(ms) { const s = Math.max(0, Math.round(ms / 1000)); return Math.floor(s / 60) + ":" + String(s % 60).padStart(2, "0"); } function fmtClock(ms) { const neg = ms < 0; const s = Math.round(Math.abs(ms) / 1000); return (neg ? "-" : "") + Math.floor(s / 60) + ":" + String(s % 60).padStart(2, "0"); }
function tickTimers() { function tickTimers() {
const now = Date.now(); const now = Date.now();
const dt = timers.last ? Math.min(now - timers.last, 1000) : 0; // clamp so backgrounded gaps don't jump const dt = timers.last ? Math.min(now - timers.last, 1000) : 0; // clamp so backgrounded gaps don't jump
timers.last = now; timers.last = now;
if (state.running) { if (state.running) {
timers.elapsedMs += dt; timers.elapsedMs += dt;
if (timers.totalMs > 0) { if (timers.totalMs > 0) timers.remainingMs -= dt; // counts past 0 into negative (overtime); never stops the metronome
timers.remainingMs -= dt;
if (timers.remainingMs <= 0) { timers.remainingMs = 0; if (state.running) toggleTransport(); } // time's up → stop
}
} }
renderTimers(); renderTimers();
} }
function renderTimers() { function renderTimers() {
$("elapsedVal").textContent = fmtClock(timers.elapsedMs); $("elapsedVal").textContent = fmtClock(timers.elapsedMs);
const cd = $("countVal"); const cd = $("countVal");
if (timers.totalMs <= 0) { cd.textContent = "off"; cd.classList.remove("low"); } if (timers.totalMs <= 0) { cd.textContent = "off"; cd.className = "tval"; return; }
else { cd.textContent = fmtClock(timers.remainingMs); cd.classList.toggle("low", state.running && timers.remainingMs <= 10000); } cd.textContent = fmtClock(timers.remainingMs);
cd.classList.toggle("over", timers.remainingMs <= 0); // overtime
cd.classList.toggle("low", timers.remainingMs > 0 && timers.remainingMs <= 10000); // almost up
} }
// Status shows in the display, under the BPM. Stopped → meter count; running → // Status shows in the display, under the BPM. Stopped → meter count; running →