Upload folder using huggingface_hub

static/css/radio.css

@@ -1583,6 +1583,76 @@ body {
 }
 .notes-list li.just-added { animation: note-flash 1.1s ease-out; }
 
+/* ===================================================================
+   Endgame mission HUD (fragment hunt in the secret band)
+   =================================================================== */
+.mission-hud {
+  display: flex;
+  flex-direction: column;
+  gap: 7px;
+  width: 100%;
+  max-width: 620px;
+  margin: 0 auto;
+  padding: 9px 16px;
+  border: 1px solid rgba(255, 246, 216, 0.4);
+  border-radius: 9px;
+  background: rgba(8, 14, 6, 0.72);
+  box-shadow: 0 0 26px rgba(255, 246, 216, 0.12), inset 0 0 18px rgba(0, 0, 0, 0.5);
+  animation: mission-glow 2.6s ease-in-out infinite;
+}
+
+.mission-hud.hidden { display: none; }
+
+@keyframes mission-glow {
+  0%, 100% { box-shadow: 0 0 18px rgba(255, 246, 216, 0.1), inset 0 0 18px rgba(0, 0, 0, 0.5); }
+  50% { box-shadow: 0 0 34px rgba(255, 246, 216, 0.22), inset 0 0 18px rgba(0, 0, 0, 0.5); }
+}
+
+.mission-hud-text {
+  font-size: 0.82rem;
+  letter-spacing: 0.08em;
+  text-align: center;
+  color: #fff6d8;
+  text-shadow: 0 0 10px rgba(255, 246, 216, 0.4);
+}
+
+.mission-hud-track {
+  height: 9px;
+  border-radius: 5px;
+  background: rgba(0, 0, 0, 0.55);
+  border: 1px solid rgba(255, 246, 216, 0.2);
+  overflow: hidden;
+}
+
+.mission-hud-fill {
+  height: 100%;
+  width: 0%;
+  background: linear-gradient(90deg, #8a7a3a, #fff6d8);
+  box-shadow: 0 0 10px rgba(255, 246, 216, 0.6);
+  transition: width 0.12s linear;
+}
+
+.mission-hud-pips {
+  display: flex;
+  justify-content: center;
+  gap: 9px;
+}
+
+.mission-hud-pips span {
+  width: 11px;
+  height: 11px;
+  border-radius: 50%;
+  border: 1px solid rgba(255, 246, 216, 0.45);
+  background: rgba(255, 246, 216, 0.06);
+  transition: background 0.25s, box-shadow 0.25s;
+}
+
+.mission-hud-pips span.on {
+  background: #fff6d8;
+  border-color: #fff6d8;
+  box-shadow: 0 0 10px rgba(255, 246, 216, 0.8);
+}
+
 /* ===================================================================
    Responsive
    =================================================================== */
@@ -1658,7 +1728,8 @@ body {
   }
   .guide-btn::after,
   .intercept.urgent,
-  .notes-list li.just-added {
+  .notes-list li.just-added,
+  .mission-hud {
     animation: none;
   }
   .noise-canvas,

static/js/radio.js

@@ -66,6 +66,10 @@ const notesScratchLabelEl = document.getElementById("notes-scratch-label");
 const notesFoundEl = document.getElementById("notes-found");
 const notesCipherEl = document.getElementById("notes-cipher");
 const notesScratch = document.getElementById("notes-scratch");
+const missionHud = document.getElementById("mission-hud");
+const missionHudText = document.getElementById("mission-hud-text");
+const missionHudFill = document.getElementById("mission-hud-fill");
+const missionHudPips = document.getElementById("mission-hud-pips");
 
 // =====================================================================
 // i18n: the listener picks a language (affects UI + model broadcasts)
@@ -110,9 +114,12 @@ const I18N = {
     numberHint:
       "Escucha el Morse · escribe la secuencia de números en la consola para entrar",
     cipherBroken: "— CIFRADO ROTO — la banda 108-112 MHz existe ahora —",
-    unlockHint: (code) => `código ${code} aceptado · el dial creció · busca los fragmentos`,
+    unlockHint: (code) => `código ${code} aceptado · el dial creció a 108–112 MHz · reúne los 5 fragmentos`,
     downloading: (name, pct) => `↓ ${name} — ${pct}% · sostén el dial`,
-    received: (name, a, b) => `✓ ${name} recibido (${a}/${b})`,
+    received: (name, a, b) => `✓ ${name} recuperado (${a}/${b})`,
+    bandLabel: (c, total) => `EL ÚLTIMO MENSAJE — ${c}/${total} fragmentos`,
+    recoverHint: "banda secreta 108–112 · sintoniza un fragmento y sostén el dial para recuperarlo",
+    fragmentsLabel: "FRAGMENTOS",
     finaleTitle: "— EL ÚLTIMO MENSAJE —",
     finaleEnd: "— fin de todas las transmisiones · gracias por escuchar —",
     intro:
@@ -162,9 +169,12 @@ const I18N = {
     numberHint:
       "Listen to the Morse · type the number sequence into the console to break in",
     cipherBroken: "— CIPHER BROKEN — the 108-112 MHz band exists now —",
-    unlockHint: (code) => `code ${code} accepted · the dial grew · find the fragments`,
+    unlockHint: (code) => `code ${code} accepted · the dial grew to 108–112 MHz · recover all 5 fragments`,
     downloading: (name, pct) => `↓ ${name} — ${pct}% · hold the dial steady`,
-    received: (name, a, b) => `✓ ${name} received (${a}/${b})`,
+    received: (name, a, b) => `✓ ${name} recovered (${a}/${b})`,
+    bandLabel: (c, total) => `THE LAST MESSAGE — ${c}/${total} fragments`,
+    recoverHint: "secret band 108–112 · tune a fragment and hold the dial steady to recover it",
+    fragmentsLabel: "FRAGMENTS",
     finaleTitle: "— THE LAST MESSAGE —",
     finaleEnd: "— end of all transmissions · thank you for listening —",
     intro:
@@ -214,9 +224,12 @@ const I18N = {
     numberHint:
       "Écoute le morse · tape la séquence de nombres dans la console pour entrer",
     cipherBroken: "— CHIFFREMENT BRISÉ — la bande 108-112 MHz existe maintenant —",
-    unlockHint: (code) => `code ${code} accepté · le cadran a grandi · trouvez les fragments`,
+    unlockHint: (code) => `code ${code} accepté · le cadran s'étend à 108–112 MHz · récupère les 5 fragments`,
     downloading: (name, pct) => `↓ ${name} — ${pct}% · tenez le cadran`,
-    received: (name, a, b) => `✓ ${name} reçu (${a}/${b})`,
+    received: (name, a, b) => `✓ ${name} récupéré (${a}/${b})`,
+    bandLabel: (c, total) => `LE DERNIER MESSAGE — ${c}/${total} fragments`,
+    recoverHint: "bande secrète 108–112 · accroche un fragment et tiens le cadran pour le récupérer",
+    fragmentsLabel: "FRAGMENTS",
     finaleTitle: "— LE DERNIER MESSAGE —",
     finaleEnd: "— fin de toutes les transmissions · merci d'avoir écouté —",
     intro:
@@ -614,8 +627,15 @@ async function restoreProgress() {
       unlockCode = saved.code;
       collectedFragments = new Set(saved.collected || []);
       const ok = await loadHiddenBand(unlockCode);
-      if (ok) expandBand(false);
-      else unlockCode = null;
+      if (ok) {
+        expandBand(false);
+        // re-populate the field log so the cipher/progress survive a refresh
+        logCipherSeq(MORSE_SEQUENCE);
+        logCipherCode(unlockCode);
+        renderNotes();
+      } else {
+        unlockCode = null;
+      }
     }
   } catch (_) {
     /* corrupted state: ignored */
@@ -1345,26 +1365,30 @@ function animate(now) {
       inertiaActive = false;
       freqVel = 0;
       frequency = Math.round(frequency * 10) / 10;
-  updateDialUI();
-      tuneNow();
+      updateDialUI();
+      scheduleTune();
     } else {
       updateDialUI();
     }
   }
 
-  // hidden band: the world powers down and the dial drifts on its own
-  if (
-    unlockCode &&
-    !finaleStarted &&
-    !isDragging &&
-    !inertiaActive &&
-    frequency >= BASE_FREQ_MAX
-  ) {
-    driftVel += (Math.random() - 0.5) * 0.012;
-    driftVel = Math.max(-0.05, Math.min(0.05, driftVel));
-    frequency = Math.min(freqMax, Math.max(FREQ_MIN, frequency + driftVel * dt));
-    updateDialUI();
+  // hidden band: the world is powering down, so the dial slips gently when you
+  // let go — but the download advances whether you hold it by hand or let it
+  // ride, so the minigame is actually winnable.
+  if (unlockCode && !finaleStarted && frequency >= BASE_FREQ_MAX) {
+    if (!isDragging && !knobDragging && !inertiaActive) {
+      driftVel += (Math.random() - 0.5) * 0.006;
+      driftVel = Math.max(-0.02, Math.min(0.02, driftVel)); // gentle slip
+      frequency = Math.min(freqMax, Math.max(FREQ_MIN, frequency + driftVel * dt));
+      updateDialUI();
+    }
     updateDownload(dt);
+    // safety: if every fragment is already recovered (e.g. after a refresh),
+    // deliver the last message instead of leaving the player stuck at 5/5
+    const tot = totalFragments();
+    if (tot > 0 && collectedFragments.size >= tot) startFinale();
+  } else {
+    updateMissionHud(false);
   }
 
   // under-damped needle spring (overshoot while settling)
@@ -1468,7 +1492,7 @@ function onPointerUp(evt) {
   } else {
     freqVel = 0;
     setFrequency(frequency); // rounds to 0.1
-    tuneNow();
+    scheduleTune();
   }
 }
 
@@ -1491,7 +1515,7 @@ function snapToStation(direction) {
   if (!candidates.length) return;
   const target = direction > 0 ? Math.min(...candidates) : Math.max(...candidates);
   setFrequency(target);
-  tuneNow();
+  scheduleTune();
 }
 
 function onKeyDown(evt) {
@@ -1571,7 +1595,7 @@ function onKnobUp(evt) {
   } else {
     freqVel = 0;
     setFrequency(frequency);
-    tuneNow();
+    scheduleTune();
   }
 }
 
@@ -1591,7 +1615,7 @@ function onDoubleClick() {
   if (freq === null) return;
   cancelIntro();
   setFrequency(freq);
-  tuneNow();
+  scheduleTune();
 }
 
 // =====================================================================
@@ -1608,20 +1632,17 @@ async function ensureClient() {
 }
 
 function cancelTune() {
+  // Bumping the generation makes every in-flight for-await loop break, which
+  // closes its stream client-side; the server self-terminates the superseded
+  // generation via its own epoch. We deliberately do NOT call job.cancel():
+  // gr.Server has no cancel route, so it just spams 404s and can wedge the
+  // client after enough rapid retunes (the other half of "text stops coming").
   tuneGeneration += 1;
-  const job = currentJob;
   currentJob = null;
-  if (!job) return;
-  try {
-    if (typeof job.done === "function" && job.done()) return;
-    job.cancel();
-  } catch (_) {
-    // cancel on an already finished job → 422; ignore
-  }
 }
 
 async function tuneNow() {
-  if (introActive) return;
+  if (introActive || finaleStarted) return; // never interrupt the last message
   const strength = signalStrength(frequency);
   const locked = strength >= 0.95;
   const stationFreq = stationFrequency(frequency);
@@ -2019,18 +2040,21 @@ function updateDownload(dt) {
   const sf = stationFrequency(frequency);
   const meta = stationMeta(sf);
   const strength = signalStrength(frequency);
+  const total = totalFragments();
+  const got = collectedFragments.size;
 
   if (
     meta?.fragment &&
     sf !== null &&
     !collectedFragments.has(sf.toFixed(1)) &&
-    strength >= 0.5
+    strength >= 0.45
   ) {
     if (downloadTarget !== sf) {
       downloadTarget = sf;
       downloadProgress = 0;
     }
-    downloadProgress = Math.min(1, downloadProgress + dt / 7);
+    downloadProgress = Math.min(1, downloadProgress + dt / 5); // ~5s to recover
+    updateMissionHud(true, got, total, downloadProgress, stationDisplayName(meta));
     if (hint) {
       hint.textContent = t().downloading(
         stationDisplayName(meta),
@@ -2041,23 +2065,45 @@ function updateDownload(dt) {
       collectedFragments.add(sf.toFixed(1));
       persistProgress();
       playJingle(meta.voice);
+      logStation(sf, stationDisplayName(meta), "fragment"); // recorded in the field log
       downloadTarget = null;
       downloadProgress = 0;
-      const total = totalFragments();
-      if (hint) {
-        hint.textContent = t().received(
-          stationDisplayName(meta),
-          collectedFragments.size,
-          total
-        );
-      }
-      if (total > 0 && collectedFragments.size >= total) {
-        setTimeout(startFinale, 1600);
-      }
+      const newGot = collectedFragments.size;
+      if (hint) hint.textContent = t().received(stationDisplayName(meta), newGot, total);
+      renderNotes(true);
+      updateMissionHud(true, newGot, total, 0, null);
+      if (total > 0 && newGot >= total) setTimeout(startFinale, 1600);
     }
-  } else if (downloadTarget !== null) {
-    downloadProgress = Math.max(0, downloadProgress - dt * 0.3);
-    if (downloadProgress === 0) downloadTarget = null;
+  } else {
+    if (downloadTarget !== null) {
+      // forgiving decay: a brief slip off the fragment doesn't wipe progress
+      downloadProgress = Math.max(0, downloadProgress - dt * 0.12);
+      if (downloadProgress === 0) downloadTarget = null;
+    }
+    updateMissionHud(true, got, total, downloadProgress, null);
+  }
+}
+
+// On-screen objective + progress for the fragment hunt (so the endgame is clear)
+function updateMissionHud(show, got = 0, total = 0, progress = 0, name = null) {
+  if (!missionHud) return;
+  if (!show || total <= 0) {
+    missionHud.classList.add("hidden");
+    return;
+  }
+  missionHud.classList.remove("hidden");
+  if (missionHudText) {
+    missionHudText.textContent = name
+      ? `${t().bandLabel(got, total)} · ↓ ${name} ${Math.round(progress * 100)}%`
+      : `${t().bandLabel(got, total)} · ${t().recoverHint}`;
+  }
+  if (missionHudFill) missionHudFill.style.width = `${Math.round(progress * 100)}%`;
+  if (missionHudPips) {
+    if (missionHudPips.children.length !== total) {
+      missionHudPips.textContent = "";
+      for (let i = 0; i < total; i++) missionHudPips.appendChild(document.createElement("span"));
+    }
+    [...missionHudPips.children].forEach((p, i) => p.classList.toggle("on", i < got));
   }
 }
 
@@ -2272,6 +2318,12 @@ function renderNotes(flashLast) {
           `<span class="nc-code">${escapeHtml(cipherCode)}</span>`;
         notesCipherEl.appendChild(d);
       }
+      const fragTotal = totalFragments();
+      if (fragTotal > 0) {
+        const d = document.createElement("div");
+        d.textContent = `${t().fragmentsLabel}: ${collectedFragments.size}/${fragTotal}`;
+        notesCipherEl.appendChild(d);
+      }
     }
   }
 }