feat: temperatuurverloop van vandaag ook bij de binnenmodules

Naast het getal in elke modulekaart staat nu hetzelfde soort lijntje als
bij buiten (200x40). Zonder labels: daar is in zo'n kaart geen ruimte
voor, de schaal staat al op de regel eronder en het venster is hetzelfde
"vandaag" als bij het grafiekje van buiten ernaast.

Per module een eigen getmeasure, gecachet onder temperature-<module> met
een gedeelde TTL; fetch() heeft daarvoor een losse ttlKey gekregen, want
anders zou de TTL-lookup per module mislukken en zou er helemaal niet
gecachet worden. Het basisstation meet zelf temperatuur en wordt zonder
module_id opgevraagd, dus die parameter is optioneel geworden. In de
payload als indoor[].history; mislukt er een, dan blijft die lijst leeg
en verdwijnt alleen dat lijntje, met de foutcode in errors. Een
stale-vlag per kamer zou het contract nodeloos zwaar maken.

De hoogte is overal 40px, ook bij een vastgezette module: gelijke hoogte
houdt de kamers onderling vergelijkbaar, en een hoger lijntje zou de
toch al krappe speling onder de kolom opeten. De grafiekjes voegen geen
hoogte toe aan de kaarten.

FakeSource houdt nu alle aanroepen bij in plaats van alleen de laatste,
zodat een test de volgorde van de vier temperatuur-calls kan nalopen.
Servicewerker naar v11.

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

public/app.js

@@ -100,9 +100,14 @@ function renderRooms(rooms) {
     const co2 = co2Level(off ? null : r.co2);
     const pill = `<span class="pill ${co2.level} num" title="${co2.label}">${co2.level === 'unknown' ? '–' : r.co2 + ' ppm'}</span>`;
     const pinned = r.id === state.pinnedRoomId;
+    const points = r.history || [];
+    // Zonder twee punten valt er niets te tekenen; dan blijft de plek naast het getal gewoon leeg.
+    const spark = points.length < 2 ? '' : `<svg class="a-rspark" viewBox="0 0 200 40" preserveAspectRatio="none" aria-hidden="true">
+        <path class="a-spark-line" d="${sparklinePath(points.map((p) => p.temp), 200, 40, 3)}"/>
+      </svg>`;
     return `<div class="a-room${off ? ' off' : ''}${pinned ? ' pinned' : ''}" data-id="${esc(r.id)}">
       <p class="a-rname"><span>${esc(r.name)}</span>${pill}</p>
-      <p class="a-rtemp num">${off ? '–' : f1(r.temp) + '°'}</p>
+      <div class="a-rrow"><p class="a-rtemp num">${off ? '–' : f1(r.temp) + '°'}</p>${spark}</div>
       <p class="a-rmm num"><span class="cold">↓ ${off ? '–' : f1(r.min) + '°'}</span><span class="warm">↑ ${off ? '–' : f1(r.max) + '°'}</span><span class="rv">RV ${off ? '–' : fPct(r.humidity)}</span></p>
     </div>`;
   });

public/styles.css

@@ -119,7 +119,11 @@ html, body {
 .pill.medium { background: var(--warm); }
 .pill.bad { background: var(--bad); }
 .pill.unknown { background: var(--line); color: var(--muted); }
-.a-rtemp { font-size: 50px; font-weight: 300; line-height: 1.05; transition: font-size .25s ease; }
+.a-rrow { display: flex; align-items: center; gap: 16px; }
+.a-rtemp { font-size: 50px; font-weight: 300; line-height: 1.05; transition: font-size .25s ease; flex: none; }
+/* Overal even hoog: zo zijn de kamers onderling vergelijkbaar, en groeit een vastgezette kaart niet
+   zo ver door dat de speling onder de kolom opraakt. */
+.a-rspark { flex: 1; min-width: 0; height: 40px; overflow: visible; }
 .a-room.off .a-rtemp { color: var(--muted); }
 .a-room.pinned .a-rtemp { font-size: 92px; }
 .a-rmm { font-size: 17px; display: flex; gap: 18px; }

public/sw.js

@@ -1,6 +1,6 @@
 /* Service worker: app-shell cache-first, API network-first met timeout en fallback op de laatste response. */
 
-const VERSION = 'weerscherm-v10';
+const VERSION = 'weerscherm-v11';
 const SHELL = [
   './',
   './index.html',