Add replay mode

Author: johnsamuelwrites

.github/workflows/deploy.yml

@@ -63,8 +63,11 @@ jobs:
           python tests/french_core_smoke.py
           node tests/core_smoke.js
           node tests/generated_browser_module_smoke.js
+          node tests/generated_parity_smoke.mjs
+          node tests/browser_generated_flow_smoke.mjs
           node tests/packed_runtime_smoke.mjs
           node tests/static_site_smoke.js
+          node tests/rendering_smoke.js
 
       - name: Verifier la structure GitHub Pages
         run: |

.github/workflows/monitor-multilingual.yml

@@ -78,11 +78,15 @@ jobs:
           node --check public/app.mjs
           node --check public/generated/automate_packed_runtime.mjs
           node --check public/generated/automate_packed/host_shim.mjs
+          node --check public/generated/automate_universel/browser_module.mjs
 
       - name: Valider le moteur et le WASM
         run: |
           python tests/french_core_smoke.py
           node tests/core_smoke.js
+          node tests/generated_browser_module_smoke.js
+          node tests/generated_parity_smoke.mjs
+          node tests/browser_generated_flow_smoke.mjs
           node tests/packed_runtime_smoke.mjs
           node tests/static_site_smoke.js
 

docs/architecture.md

@@ -13,11 +13,21 @@ The intended stable boundary is the configuration object. The UI should not know
 
 The browser layer is intentionally narrow: one module reads and writes form controls, delegates configuration assembly, evolution, canonical rule-table generation, genetic evaluation, and perturbation mutations to the core bridge, renders the resulting universe, and wires a static preset gallery. Presentation-only concerns such as tab systems, mirrored form state, and client-side gallery choreography are not part of the long-term architecture.
 
+`scripts/build_wasm_bundle.py` now generates a browser-native rich module from the canonical French source:
+
+```text
+public/generated/automate_universel/browser_module.mjs
+```
+
+`public/app.mjs` loads that module into `window.AutomaginariumUniversVivant` before the UI starts. `public/automate-core.js` is therefore a generated-first compatibility bridge: it forwards rich JSON behavior to the generated `.multi` module when present, keeps JavaScript fallbacks for local/dev compatibility, and still calls the packed WASM numeric ABI for narrow scalar helpers.
+
+The Exporter panel is also the first user-facing payoff for the living-universe manifest: it shows the generated semantic-core JSON/source and offers a Replay mini-canvas driven by the current universe timeline.
+
 Advanced tools such as the genetic workbench and perturbation toolkit are now lazy browser features. They are loaded only when their panels are opened, so the baseline application path stays focused on the core Multilingual configuration and rendering loop.
 
 Canonical JSON-array rule keys use forms such as `"[0,1,0]"`, rather than concatenated keys such as `"010"`. The browser adapter still accepts older Cellcosmos-style keys as a compatibility fallback.
 
-The packed Multilingual/WASM bridge keeps the full French core as the canonical configuration and evolution model, while `src/automate_packed_wasm.multi` exposes a narrow numeric ABI for browser calls. The browser prefers `window.AutomaginariumPacked` when available and falls back to JavaScript only where rich JSON orchestration is still needed.
+The packed Multilingual/WASM bridge keeps the full French core as the canonical configuration and evolution model, while `src/automate_packed_wasm.multi` exposes a narrow numeric ABI for browser calls. The browser prefers `window.AutomaginariumPacked` for numeric primitives and `window.AutomaginariumUniversVivant` for rich configuration/universe behavior before falling back to JavaScript compatibility code.
 
 Rule-table generation follows the same pattern: canonical helpers live in `src/automate_universel.multi`, narrow deterministic numeric helpers live in `src/automate_packed_wasm.multi`, and `public/automate-core.js` exposes the browser bridge so `public/app.mjs` does not duplicate the rule logic, form-to-config assembly, or configuration summaries.
 

docs/packed-runtime.md

@@ -19,6 +19,7 @@ Generated artifacts are written to:
 ```text
 public/generated/automate_packed/
 public/generated/automate_universel.py
+public/generated/automate_universel/browser_module.mjs
 ```
 
 These generated files are intentionally ignored by Git and regenerated by GitHub Actions before deployment. The committed runtime loader is:
@@ -27,14 +28,14 @@ These generated files are intentionally ignored by Git and regenerated by GitHub
 public/generated/automate_packed_runtime.mjs
 ```
 
-The browser loads `public/generated/automate_packed_runtime.mjs`, which instantiates `module.wasm` and installs `window.AutomaginariumPacked`. `public/automate-core.js` then calls generated Multilingual/WASM exports for narrow numeric primitives such as Wolfram and totalistic outputs, while retaining JavaScript fallback behavior for rich JSON table orchestration.
+The browser loads `public/generated/automate_packed_runtime.mjs`, which instantiates `module.wasm` and installs `window.AutomaginariumPacked`. It also loads `public/generated/automate_universel/browser_module.mjs` into `window.AutomaginariumUniversVivant`. `public/automate-core.js` calls the rich generated module first for JSON-compatible behavior such as configuration summaries, universe generation, perturbations, genetic evaluation, and semantic-core export, then falls back to JavaScript compatibility code when the generated module is unavailable.
 
 Regenerate artifacts with:
 
 ```powershell
 .\scripts\build-packed-runtime.ps1
 ```
 
-Current limitation: the full JSON/dictionary/list-rich core compiles to generated Python but does not yet produce a browser WASM bundle with the current Multilingual WAT backend. The narrow ABI module is the deliberate bridge until richer data lowering is available.
+Current limitation: the rich core is generated as browser-native JavaScript rather than a browser WASM bundle. The narrow ABI module remains the WASM bridge for scalar numeric helpers until richer WAT data lowering is available.
 
-The generated rich core is exercised by `tests/french_core_smoke.py`, so CI verifies behavior that comes directly from `src/automate_universel.multi`.
+The generated rich core is exercised by `tests/french_core_smoke.py`, `tests/generated_browser_module_smoke.js`, `tests/generated_parity_smoke.mjs`, and `tests/browser_generated_flow_smoke.mjs`, so CI can verify behavior that comes directly from `src/automate_universel.multi` and that the served app points at the generated browser module.

docs/release-checklist.md

@@ -8,12 +8,19 @@ Before publishing a release:
    .\scripts\build-packed-runtime.ps1
    ```
 
+   `requirements-build.txt` currently installs `multilingualprogramming[wasm]`
+   from the multilingual `main` branch because the published PyPI 0.8.0 wheel
+   does not include `build-browser-module`. After the next multilingual release,
+   repin this to the released version and rerun this checklist.
+
 2. Run all local tests.
 
    ```powershell
    python tests\french_core_smoke.py
    node tests\core_smoke.js
    node tests\generated_browser_module_smoke.js
+   node tests\generated_parity_smoke.mjs
+   node tests\browser_generated_flow_smoke.mjs
    node tests\packed_runtime_smoke.mjs
    node tests\static_site_smoke.js
    ```
@@ -32,8 +39,10 @@ Before publishing a release:
    - all presets load
    - Wolfram/random/symmetric/totalistic generation works
    - JSON import/export works
+   - Exporter panel semantic-core JSON/source works with the generated module loaded
+   - Replay controls in the Exporter panel step and play the current universe
    - PNG export works
-   - browser console has no missing `module.wasm` or preset JSON errors
+   - browser console has no failed dynamic import, missing `module.wasm`, or preset JSON errors
 
 6. Push to GitHub and verify Actions.
 
@@ -50,4 +59,4 @@ Before publishing a release:
    git status --short --ignored
    ```
 
-   `public/generated/automate_packed/` and `public/generated/automate_universel.py` should remain ignored locally.
+   `public/generated/automate_packed/`, `public/generated/automate_universel.py`, and `public/generated/automate_universel/` should remain ignored locally.

public/app.mjs

@@ -18,7 +18,7 @@ const PRESETS = [
   { id: "symboles-jardin", label: "Symboles jardin" },
 ];
 
-const state = { config: null, universe: null, lastValidConfig: null };
+const state = { config: null, universe: null, manifest: null, lastValidConfig: null };
 const presetCache = new Map();
 const canvas = document.querySelector("#universe");
 const ctx = canvas.getContext("2d");
@@ -32,6 +32,12 @@ const universeLiveSummary = document.querySelector("#universe-live-summary");
 const transitionLiveSummary = document.querySelector("#transition-live-summary");
 const processLiveSummary = document.querySelector("#process-live-summary");
 const processJsonView = document.querySelector("#process-json");
+const replayCanvas = document.querySelector("#replay-canvas");
+const replayCtx = replayCanvas?.getContext("2d");
+const replayStatus = document.querySelector("#replay-status");
+const replayPlayButton = document.querySelector("#replay-play");
+const replayStepButton = document.querySelector("#replay-step");
+const replayResetButton = document.querySelector("#replay-reset");
 const syncIndicatorDot = document.querySelector("#sync-indicator-dot");
 const syncIndicatorText = document.querySelector("#sync-indicator-text");
 const heroSyncDot = document.querySelector("#hero-sync-dot");
@@ -79,6 +85,8 @@ const liveControlEntries = [
   [controls.ruleNumber, "input"],
 ];
 let liveApplyTimer = null;
+let replayTimer = null;
+let replayGeneration = 0;
 const featureModules = {
   genetic: null,
   perturb: null,
@@ -531,9 +539,64 @@ function render() {
   }
 }
 
+function manifestInitialRow(manifest) {
+  const loci = manifest?.state?.loci;
+  if (!Array.isArray(loci)) return null;
+  return loci
+    .slice()
+    .sort((left, right) => Number(left.locus?.[0] || 0) - Number(right.locus?.[0] || 0))
+    .map((locus) => locus.state?.symbol);
+}
+
+function drawUniverseRow(targetCtx, targetCanvas, universe, rowIndex, manifest = null) {
+  if (!targetCtx || !targetCanvas || !universe) return;
+  const { configuration, lignes, sorties } = universe;
+  const row = rowIndex === 0 ? (manifestInitialRow(manifest) || lignes?.[rowIndex] || []) : (lignes?.[rowIndex] || []);
+  const rowSorties = sorties?.[rowIndex] || [];
+  const width = Math.max(1, row.length);
+  const cellWidth = targetCanvas.width / width;
+  targetCtx.fillStyle = canvasBackgroundFor(configuration);
+  targetCtx.fillRect(0, 0, targetCanvas.width, targetCanvas.height);
+  row.forEach((value, x) => {
+    const channels = rowSorties[x];
+    const visualValue = channels && channels.length > 1 ? channels[1] : value;
+    const bgValue = configuration.alphabet_sortie?.[0] ?? configuration.alphabet_entree[0];
+    if (!configuration.rendu.afficher_zero && String(visualValue) === String(bgValue)) return;
+    targetCtx.fillStyle = colorFor(value, configuration, channels, x, rowIndex, width, lignes.length);
+    targetCtx.fillRect(Math.floor(x * cellWidth), 0, Math.ceil(cellWidth), targetCanvas.height);
+  });
+}
+
+function updateReplayStatus() {
+  if (!replayStatus || !state.universe?.lignes) return;
+  const steps = state.manifest?.schedule?.steps ?? Math.max(0, state.universe.lignes.length - 1);
+  replayStatus.textContent = `Generation ${Math.min(replayGeneration + 1, state.universe.lignes.length)} / ${steps + 1}`;
+}
+
+function renderReplay() {
+  if (!replayCanvas || !state.universe?.lignes?.length) return;
+  replayGeneration = Math.max(0, Math.min(replayGeneration, state.universe.lignes.length - 1));
+  drawUniverseRow(replayCtx, replayCanvas, state.universe, replayGeneration, state.manifest);
+  updateReplayStatus();
+}
+
+function stopReplay() {
+  if (replayTimer) window.clearInterval(replayTimer);
+  replayTimer = null;
+  if (replayPlayButton) replayPlayButton.textContent = "Lire";
+}
+
+function stepReplay() {
+  if (!state.universe?.lignes?.length) return;
+  replayGeneration = (replayGeneration + 1) % state.universe.lignes.length;
+  renderReplay();
+}
+
 function describe(config) {
   const description = window.AutomaginariumCore.describeConfiguration(config);
   const semanticSummary = window.AutomaginariumCore.resumerUniversVivant(config);
+  const manifest = window.AutomaginariumCore.construireUniversVivant(config);
+  state.manifest = manifest;
   title.textContent = description.title;
   meta.textContent = description.metaText;
   tableView.innerHTML = description.ruleTableHtml;
@@ -549,7 +612,7 @@ function describe(config) {
     processLiveSummary.innerHTML = `<span class="live-summary-label">Comportement</span><strong>${semanticSummary.rule} | ${semanticSummary.topology} | ${semanticSummary.schedule}</strong>`;
   }
   if (processJsonView) {
-    processJsonView.value = JSON.stringify(window.AutomaginariumCore.construireUniversVivant(config), null, 2);
+    processJsonView.value = JSON.stringify(manifest, null, 2);
   }
 }
 
@@ -627,6 +690,9 @@ function applyConfig(config, { source = "Configuration" } = {}) {
     }
     updateHudRule();
     render();
+    replayGeneration = 0;
+    stopReplay();
+    renderReplay();
     setSyncState("ok", `${source} chargee`);
     return true;
   } catch (error) {
@@ -737,6 +803,23 @@ function applyRandomRule() {
 
 document.querySelector("#random-rule").addEventListener("click", applyRandomRule);
 document.querySelector("#random-rule-canvas").addEventListener("click", applyRandomRule);
+replayPlayButton?.addEventListener("click", () => {
+  if (replayTimer) {
+    stopReplay();
+    return;
+  }
+  replayPlayButton.textContent = "Pause";
+  replayTimer = window.setInterval(stepReplay, 180);
+});
+replayStepButton?.addEventListener("click", () => {
+  stopReplay();
+  stepReplay();
+});
+replayResetButton?.addEventListener("click", () => {
+  stopReplay();
+  replayGeneration = 0;
+  renderReplay();
+});
 document.querySelector("#apply-json").addEventListener("click", () => {
   try {
     applyConfig(JSON.parse(controls.json.value), { source: "JSON" });

public/automate-core.js

@@ -1,10 +1,11 @@
 /*
  * Automaginarium browser bridge.
  *
- * This adapter forwards calls to the compiled French Multilingual core.
- * All domain logic (cellular automata, rules, generation) is canonical in
- * src/automate_universel.multi. These functions are temporary fallbacks/mirrors
- * until the Multilingual→WASM compilation pipeline is live.
+ * This adapter forwards calls to the generated French Multilingual browser
+ * module when it is available. All domain logic (cellular automata, rules,
+ * generation) is canonical in src/automate_universel.multi. The JavaScript
+ * implementations below are compatibility fallbacks for local/dev paths where
+ * generated artifacts have not been built yet.
  *
  * JavaScript serves only: canvas rendering, DOM, interface events.
  * All cellular automata logic belongs in src/.
@@ -36,7 +37,7 @@ function callPacked(name, args, fallback) {
 
 // ============================================================================
 // TEMPORARY: These functions are duplicated from src/automate_universel.multi.
-// They are fallbacks until the ML is compiled to WASM/JS.
+// Generated browser JS is preferred; these stay as compatibility fallbacks.
 // DO NOT ADD NEW LOGIC HERE. Update src/automate_universel.multi instead.
 // ============================================================================
 
@@ -300,12 +301,18 @@ function randomOutput(configuration, seed, neighborhoodIndex) {
 }
 
 function tableAleatoire(configurationBrute, seed = Date.now() >>> 0) {
+  if (window.AutomaginariumUniversVivant?.table_aleatoire) {
+    return window.AutomaginariumUniversVivant.table_aleatoire(configurationBrute, seed);
+  }
   const configuration = normaliserConfiguration(configurationBrute);
   const keys = toutesClesVoisinage(configuration.alphabet_entree, configuration.taille_voisinage);
   return Object.fromEntries(keys.map((key, index) => [key, randomOutput(configuration, seed, index)]));
 }
 
 function tableSymetrique(configurationBrute, seed = Date.now() >>> 0) {
+  if (window.AutomaginariumUniversVivant?.table_symetrique) {
+    return window.AutomaginariumUniversVivant.table_symetrique(configurationBrute, seed);
+  }
   const configuration = normaliserConfiguration(configurationBrute);
   const table = {};
   const keys = toutesClesVoisinage(configuration.alphabet_entree, configuration.taille_voisinage);
@@ -650,11 +657,20 @@ function metriquesUnivers(univers) {
   const lignes = univers?.lignes || [];
   const configuration = univers?.configuration || {};
   const valeurVide = configuration.alphabet_entree ? configuration.alphabet_entree[0] : 0;
-  const totalCells = lignes.reduce((sum, ligne) => sum + ligne.length, 0);
-  const liveCells = lignes.flat().filter((value) => celluleVivante(value, valeurVide)).length;
-  const densite = totalCells > 0 ? liveCells / totalCells : 0;
-  const entropie = densite > 0 && densite < 1 ? -(densite * Math.log2(densite) + (1 - densite) * Math.log2(1 - densite)) : 0;
+  const toutesValeurs = lignes.flat().map(String);
+  const totalCells = Math.max(1, toutesValeurs.length);
+  const comptes = new Map();
+  toutesValeurs.forEach((value) => {
+    comptes.set(value, (comptes.get(value) || 0) + 1);
+  });
+  const entropie = [...comptes.values()].reduce((sum, count) => {
+    const probability = count / totalCells;
+    return probability > 0 ? sum - (probability * Math.log2(probability)) : sum;
+  }, 0);
   const densitesParGeneration = lignes.map((ligne) => calculerDensiteLigne(ligne, valeurVide));
+  const densite = densitesParGeneration.length > 0
+    ? densitesParGeneration.reduce((sum, value) => sum + value, 0) / densitesParGeneration.length
+    : 0;
   const compacites = lignes.map((ligne) => calculerCompaciteLigne(ligne, valeurVide));
   const symetries = lignes.map(calculerSymetrieLigne);
   const compacite = compacites.length > 0 ? compacites.reduce((sum, value) => sum + value, 0) / compacites.length : 0;
@@ -701,7 +717,7 @@ function evaluerFitness(univers, poidsObj = {}) {
     "fitness_ponderee_scalaire",
     [fSym, fDen, fSta, oscillation, fCmp, fCro, ...poids],
     (fSym * poids[0] + fDen * poids[1] + fSta * poids[2] + oscillation * poids[3] + fCmp * poids[4] + fCro * poids[5]) /
-      poids.reduce((a, b) => a + b, 1),
+      Math.max(1, poids.reduce((a, b) => a + b, 0)),
   );
   const configuration = univers?.configuration || {};
   const scoresParCanal = Array.from(

public/index.html

@@ -278,6 +278,21 @@ <h2>Exporter le comportement</h2>
                 <span class="live-summary-label">Comportement</span>
                 <strong>Univers exportable en attente</strong>
               </div>
+              <div class="replay-panel" aria-label="Rejouer cet univers">
+                <div class="panel-heading inline-heading compact-heading">
+                  <div>
+                    <p class="eyebrow">Replay</p>
+                    <h3>Rejouer cet univers</h3>
+                  </div>
+                  <p id="replay-status" class="meta">Generation 1 / 1</p>
+                </div>
+                <canvas id="replay-canvas" width="300" height="90" aria-label="Replay de l'univers courant"></canvas>
+                <div class="button-row replay-controls">
+                  <button id="replay-play" type="button">Lire</button>
+                  <button id="replay-step" type="button">Pas</button>
+                  <button id="replay-reset" type="button">Revenir</button>
+                </div>
+              </div>
               <textarea id="process-json" spellcheck="false" readonly aria-label="Données exportables de l'univers vivant"></textarea>
             </div>
           </div>