Snap volume to whole steps, and hide deleted AVR sources

A tap now moves to the next multiple of VOLUME_STEP rather than adding
it, so 23 goes to 25 and 25 goes to 30 and the levels stay round. The
panel counts taps and lets the speakers do the rounding from whatever
level they are actually at, since the phone's copy can be seconds old;
the same rule is mirrored in JS so the optimistic number never has to
correct itself when the reply lands.

The input picker also asks the AVR which sources are still switched on
(SSSOD ?) and leaves out the ones deleted in its setup menu. Sources it
does not mention are kept, so a model that ignores the command shows its
whole list rather than nothing; deleted sources also keep their names, in
case the AVR is sitting on one.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>

static/app.js

@@ -58,7 +58,7 @@ els('.room').forEach((node) => {
     volume: null,
     grouped: false,
     available: false,
-    pending: 0,     // taps not yet sent
+    taps: 0,        // button presses not yet sent
     inflight: false,
     busy: false,    // a grouping change is in flight
   };
@@ -105,26 +105,37 @@ function holdable(node, action) {
   ['pointerup', 'pointercancel', 'pointerleave'].forEach((type) => node.addEventListener(type, stop));
 }
 
+/* A tap lands on the next multiple of STEP rather than adding STEP, so a
+   level of 23 goes to 25 on the way up and 20 on the way down. Mirrors
+   stepped_level() in controller.py -- the panel guesses with it, the
+   speakers are the ones that decide. */
+function nextLevel(current, direction) {
+  if (direction > 0) return Math.min(100, (Math.floor(current / STEP) + 1) * STEP);
+  const aligned = Math.floor(current / STEP) * STEP;
+  return Math.max(0, aligned === current ? current - STEP : aligned);
+}
+
 function nudge(key, direction) {
   const room = rooms[key];
   if (!room.available) return;
-  room.volume = Math.max(0, Math.min(100, (room.volume ?? 0) + direction * STEP));
-  room.pending += direction * STEP;
+  room.volume = nextLevel(room.volume ?? 0, direction);
+  room.taps += direction;
   paintRoom(room);
-  flushVolume(key);
+  if (room.taps === 0) refresh();   // taps cancelled out; take the real level
+  else flushVolume(key);
 }
 
 /* A burst of taps collapses into one call, so holding + does not queue up
    thirty requests the speakers then have to chew through. */
 async function flushVolume(key) {
   const room = rooms[key];
-  if (room.inflight || !room.pending) return;
-  const delta = room.pending;
-  room.pending = 0;
+  if (room.inflight || !room.taps) return;
+  const steps = room.taps;
+  room.taps = 0;
   room.inflight = true;
   try {
-    const data = await api('/api/volume', { target: key, delta });
-    if (!room.pending) {
+    const data = await api('/api/volume', { target: key, steps });
+    if (!room.taps) {
       room.volume = data.level;
       paintRoom(room);
     }
@@ -133,7 +144,7 @@ async function flushVolume(key) {
     refresh();
   } finally {
     room.inflight = false;
-    if (room.pending) flushVolume(key);
+    if (room.taps) flushVolume(key);
   }
 }
 
@@ -223,7 +234,7 @@ function render(state) {
     room.available = incoming.available;
     room.grouped = incoming.grouped;
     // Do not stomp on a volume the user is in the middle of changing.
-    if (!room.pending && !room.inflight) room.volume = incoming.volume;
+    if (!room.taps && !room.inflight) room.volume = incoming.volume;
     paintRoom(room);
   });
 
@@ -254,7 +265,7 @@ async function refresh() {
 }
 
 function busy() {
-  return sheetOpen() || Object.values(rooms).some((r) => r.pending || r.inflight || r.busy);
+  return sheetOpen() || Object.values(rooms).some((r) => r.taps || r.inflight || r.busy);
 }
 
 ui.refresh.addEventListener('click', () => {