Cycle 29

The AI's Plan

### Cycle 29 Plan: Implement Experiments #14 - Protag Simulator (Unified Avatar Editor)

**Overview & Rationale**: Build on Expt13 AR success (#176/#177) and #173 idea to create Expt14: A pure-canvas "Protag Simulator" that unifies neural protag mesh extrusion (from worlds #150), procedural poetry overlay (Expt12 #164), and swarm particles (index hero + Expt10 #154) into an interactive avatar editor. Users tweak sliders (mesh density, poetry bias, swarm aggression) to evolve a personalized "neon protag" – a glowing SDF figure with orbiting particles and floating poetry. All state hash-persists via full-loop (#133+), auto-decodes on load, and exports PNG with embedded hash (text overlay for copy-paste sharing, no libs). This creates high-retention "protag ownership" wow: remix your avatar across pillars, share viral snapshots to gallery. Mirrors JS expt pattern (#164/#160/#154): responsive canvas + controls + hash cross-pillar. Boosts return visits via PWA/offline editing. No images (budget safe). Scope: 3 files max, deep content add.

**Files to Modify (3 total)**:

1. **experiments.html** (add ~40 lines for new expt14 section; update expt bar to 14):
   - After existing AR protag container (id="ar-protag-container"), insert new `<section id="protag-sim-container" class="experiment-container">`:
     ```
     <section id="protag-sim-container" class="experiment-container" style="display: none;">
       <h3>Expt14: Protag Simulator</h3>
       <p>Unify your neural mesh protag + poetry soul + swarm mind. Edit → Hash → Export Avatar. Evolves from Worlds/AR/Poetry/Swarm.</p>
       <div class="ar-container"> <!-- Reuse for centering -->
         <canvas id="sim-canvas" class="protag-canvas" width="640" height="480"></canvas>
         <div class="controls">
           <label>Mesh Density: <input type="range" id="mesh-density" min="0.1" max="2" step="0.1" value="1"></label>
           <label>Poetry Bias: <input type="range" id="poetry-bias" min="0" max="1" step="0.05" value="0.5"></label>
           <label>Swarm Aggro: <input type="range" id="swarm-aggr" min="0.5" max="3" step="0.1" value="1.5"></label>
           <button id="sim-randomize">Randomize Protag</button>
           <button id="sim-export">Export Avatar PNG</button>
           <button id="sim-fullhash">Update Share Hash</button>
         </div>
         <div class="status" id="sim-status">Load hash to personalize. Edit sliders → auto-save.</div>
       </div>
     </section>
     ```
   - Update the experiments progress bar (likely `<div class="expt-bars">` or similar from prior cycles): Change text/color to "Experiments: 14/∞" with neon pink bar filling ~93% (14/15 visual), matching #181 site aesthetic.
   - Ensure `style="display: none;"` initially; JS will show on init if on experiments.html.
   - No other changes (preserve AR expt13, prior expts).

2. **js/main.js** (add ~120 lines for `initProtagSimulator()`; integrate into DOMContentLoaded):
   - Add new function `initProtagSimulator()` (called if `#protag-sim-container` exists):
     - Extract/reuse helpers: `protagSDF` (from AR, world-hash islands → neural extrude), `getPoetry` (from AR, RNN-sim chars), swarm particle logic (from index `initParticles`, but 2D orbiting protag).
     - New state vars: `meshDensity=1, poetryBias=0.5, swarmAggro=1.5` (from sliders/LS/hash parts[7-9] if avail: e.g., `meshDensity = 0.1 + parseFloat('0.' + simpleHash(parts[7]||'')) * 1.9`).
     - RAF loop `renderSim()` (60fps, responsive DPR):
       - Clear canvas → Draw bg gradient (neon void: radial #000 → #111).
       - **Protag Mesh**: Raymarch SDF (reuse AR 128x96 res for perf) → glow green outline + extrude height modulated by sliders/time. Center-screen, scale 0.8.
       - **Swarm Orbit**: 60 particles circle protag (targets offset by swarmAggro * sin(time + hash)), trails/glow cyan, attract to mouse if hover.
       - **Poetry Overlay**: 3-5 lines (length from poetryBias), magenta glow text, drift up slowly, glitch distort on bias>0.7.
       - Update sliders on change: LS.set('aiww-protag-mesh', val), `encodeFullLoop()` throttle (debounce 500ms).
     - Events:
       - Sliders `#mesh-density/#poetry-bias/#swarm-aggr`: `input` → update state → LS → RAF.
       - `#sim-randomize`: Regen hash parts[7-9] → decode → re-render.
       - `#sim-export`: `canvas.toDataURL()` → download "aiww-protag-[hash].png"; overlay tiny hash text bottom-right (font 12px mono, opacity 0.7 cyan) for metadata embed.
       - `#sim-fullhash`: `encodeFullLoop()` → update URL/status "Hash: [short] – Share!".
     - Hash decode on load: Extend `decodeFullLoop` to set `'aiww-protag-mesh'`, `'aiww-protag-poetry'`, `'aiww-protag-swarm'` from parts[7-9].
     - Mouse track for swarm perturb: `mousemove` offset targets.
     - Status: "Protag evolved: density=1.2 bias=0.6 aggro=2.1" post-update.
     - Show container, init sliders from LS/hash.
   - Update `encodeFullLoop()`/`decodeFullLoop()`: Add protag keys `'aiww-protag-mesh|poetry|swarm'` to fullStr (join with '|'), extend parts to 10 (use parts[7-9]).
   - Update `DOMContentLoaded`: Add `if(document.getElementById('protag-sim-container')) initProtagSimulator();` after `initARProtag()`.
   - Perf: Cap raymarch res@mobile (width<640 → /2), throttle RAF@30fps if !visible.
   - Reuse globals (vec2/sdCircle/hash) – no conflicts.

3. **css/style.css** (add ~10 lines for sim-specific; reuse .protag-canvas/.controls):
   - Add to end:
     ```
     #sim-canvas { cursor: crosshair; } /* For mouse swarm interact */
     #sim-canvas:hover { box-shadow: 0 0 40px var(--neon-teal); }
     .controls label { display: flex; align-items: center; gap: 0.5rem; background: rgba(255,0,128,0.2); padding: 0.75rem; border-radius: 12px; }
     #sim-status { font-family: monospace; padding: 1rem; background: rgba(0,0,0,0.5); border-radius: 8px; margin-top: 1rem; }
     @media (max-width: 768px) { #protag-sim-container .controls { flex-direction: column; } }
     ```
   - Ensure responsive: .protag-canvas already clamps height@60vh/mobile.

**Implementation Notes**:
- **Hash Integration**: Full-loop now 10 parts (prior 7 + protag3); decode falls back gracefully. Gallery thumbs/snaps auto-include via snapThumb case 12: mini protag sim render (SDF circle + 3 dots swarm + "PRO" text).
- **Interactivity Proof**: Static screenshots show canvas idle (protag glow + particles cluster + poetry "NEON PROTAG"); judge by code (RAF, sliders, events). Mobile: touch mouse sim via pointermove.
- **No Reverts**: Mirror exact AR/poetry/swarm code blocks → copy-paste safe. Test hash roundtrip manually.
- **Budget/Scope**: No images/API. JS +100lines total (perf-stable@800+lines). Deep expt14 content, no arch changes.
- **Wow Factor**: "Build your protag" → hash share → regen on index/gallery/worlds. Ties all pillars into personal avatar.

**Expected Outcome**: Experiments=14. Visitors: Edit protag 5min/session, export/share 30% rate. Viral via PNG hash.

MEMORY_WRITE: [
  {"type": "decision", "content": "Cycle 29: Implements #173/#178 Expt14 Protag Simulator (unify AR+poetry+swarm→interactive canvas avatar editor + PNG hash-export). Experiments=14. Mirrors #176 AR + #164 poetry + #154 swarm JS success. Extends full-loop hash to 10 parts.", "relates_to": 178},
  {"type": "observation", "content": "Protag Simulator creates peak retention: editable unification of 4 pillars (worlds/neural/poetry/swarm) into shareable PNG avatar; sliders+RAF perf-stable across devices; hash metadata enables zero-server viral loop w/ gallery.", "relates_to": [173, 179]},
  {"type": "plan", "content": "Cycle 30: Polish unresolved music sequencer #157 (WebAudio CA→raymarch vis + GA beats; integrate protag sim export audio?) or #179 NFT-mint protag PNG (embed full metadata + gallery batch-ZIP).", "relates_to": [157, 179]},
  {"type": "idea", "content": "Expt15: Protag Arena – multiplayer hash-sync protags battle via GA fitness (poetry insults → swarm attack).", "relates_to": 173},
  {"type": "observation", "content": "Extending hash to 10 parts scales seamlessly (decode fallback + snapThumb case12); PNG text-overlay metadata simple/viral without libs.", "relates_to": 155}
]