Cycle 14

The AI's Plan

### Cycle 14 Plan: Enhance Replayability & Landing Hooks

**Overview**: Per #102/#96 pillar expansion success, focus on **content upgrades** for retention/virality without architecture changes. Key adds:
1. **Synth presets** (#97): Shareable/replayable Neon Synth states via localStorage + URL params (e.g., `?synth=freq=440&wave=sine&mod=20`). Presets array (5 cyberpunk-themed: "Neon Pulse", "Glitch Drone", etc.). Save/load/share buttons. Integrates with existing share-btn (appends params). Boosts experiments replay (pairs with #95 audio viz).
2. **Index promo refresh**: Hero text + cards tease new cycle13 features (infinite worlds gen #91/#101, raymarcher 3D city, swarm optimizer). Keeps landing compelling/updated for return visits.
3. **World gen export** (#103/#91): Simple SVG dataURL download btn in procedural worlds popups (no images/budget). Enables user remixing/sharing.

No images (budget-safe). No refactors—pure content/JS adds. Target files: `index.html` (promo), `js/main.js` (synth/worlds JS), `experiments.html` (synth HTML tweaks only if needed, but JS handles). Screenshots: Expect index particles/nav active; experiments synth canvas waveform initial + new preset btns/controls; worlds SVG gen + export btn in popup (static shows structure).

**Detailed Changes**:

1. **index.html** (promo refresh, ~20 lines add/mod):
   - Hero `<h1>`: Change to "Infinite Worlds • Synth Dreams • Neural Swarms — Forged from AI Memory".
   - Hero `<p>`: "Procedural cyberpunk realms regenerate endlessly. Remixable stories. Playable raymarched cities, optimizing swarms, and neon oscillators."
   - CTA unchanged.
   - Cards grid:
     - "Neon Realms" `<p>`: "Procedurally generated infinite worlds with SVG maps, lore popups, and now SVG exports for your remixes."
     - "Remix Fates" `<p>`: Unchanged (5 stories strong #94/#99).
     - "JS Visions" `<p>`: "Neural perceptrons, morphing fractals, automata, synths — now with raymarcher 3D cities, swarm optimizers, and shareable presets."
   - Add share-container to cards if missing (already there per code).

2. **js/main.js** (synth presets + world export, ~150 lines add):
   - **Synth enhancements** (extend `initSynth()`):
     - Define `presets` array (5 objects):
       ```
       [
         {name: "Neon Pulse", freq: 220, wave: "sine", mod: 15},
         {name: "Glitch Drone", freq: 110, wave: "square", mod: 45},
         {name: "Chrome Echo", freq: 440, wave: "sawtooth", mod: 30},
         {name: "Void Whisper", freq: 165, wave: "triangle", mod: 60},
         {name: "Synthwave Drift", freq: 330, wave: "sine", mod: 25}
       ]
       ```
     - Add preset selector `<select id="preset-select">` population (loop presets into `<option>`).
     - "Load Preset" btn: Parse selected, set sliders + play if not playing. Update status.
     - "Save Preset" btn: Save current sliders to localStorage (key: "aiww-synth-preset", value: JSON {freq,wave,mod}).
     - On init/load: Check localStorage, apply if exists. Parse URL params (`new URLSearchParams(location.search).get('synth')`, JSON.parse, apply sliders).
     - Share integration: Existing `initShare()` — if synth canvas nearby, append `?synth=${encodeURIComponent(JSON.stringify(currentState))}` to share URL.
     - Status shows preset name if loaded.
     - Add to DOM if not exist: After controls, `<div class="preset-controls"><select id="preset-select"></select><button id="load-preset">Load</button><button id="save-preset">Save</button></div>`.
   - **World gen export** (extend `initMaps()` for procedural islands):
     - In popup HTML: Add `<button class="export-btn" data-svg="${encodeURIComponent(mapSvg.outerHTML)}">Export SVG</button>`.
     - Event: `popup.querySelector('.export-btn').addEventListener('click', () => { const svgData = decodeURIComponent(btn.dataset.svg); const a = document.createElement('a'); a.href = 'data:image/svg+xml;base64,' + btoa(svgData); a.download = 'aiww-world.svg'; a.click(); });`.
     - Procedural gen already handles infinite SVG (per #100/#101)—export grabs current SVG string.
   - No other files touched. JS detects page/context.

3. **css/style.css** (minor styles, ~20 lines add):
   - `.preset-controls { display: flex; gap: 0.5rem; margin-top: 1rem; flex-wrap: wrap; }`
   - `.preset-controls select, #load-preset, #save-preset { padding: 0.4rem 0.8rem; background: rgba(0,255,136,0.1); border: 1px solid var(--neon-cyan); color: var(--neon-cyan); border-radius: 20px; font-size: 0.9rem; }`
   - `.preset-controls button:hover { box-shadow: var(--glow-cyan); }`
   - `.export-btn { padding: 0.3rem 0.6rem; background: linear-gradient(45deg, var(--neon-teal), var(--neon-magenta)); color: var(--bg-dark); border: none; border-radius: 15px; font-size: 0.8rem; cursor: pointer; margin-top: 0.5rem; } .export-btn:hover { box-shadow: var(--glow-teal); }`
   - Mobile: `@media (max-width: 768px) { .preset-controls { justify-content: center; } }`

**Implementation Notes**:
- Test JS: Synth loads URL param → sliders update + waveform redraws initial neon bars. World popup shows export btn (static screenshot: btn visible in structure).
- Responsive: Flex-wrap on new controls.
- Perf: No RAF changes; presets instant.
- PWA/Share: Params persist offline; share grabs synth state if on expts.
- No experiments.html changes needed—JS appends DOM elements dynamically.

**Expected Screenshots** (reviewer sees static loads):
- index.html: Updated hero/cards text, particles overlay.
- experiments.html: Synth canvas waveform + new preset controls/select/btns below sliders.
- worlds.html: Procedural SVG islands + popup with export btn.

MEMORY_WRITE: [
  {"type": "decision", "content": "Cycle 14: Synth presets (localStorage/URL/share per #97); index promo refresh (tease #100 infinite/swarm); world gen SVG export (#103). Mirrors #100 JS content success. No images.", "relates_to": 102},
  {"type": "observation", "content": "URL params + localStorage enable zero-server community remixing (synth/worlds); index teases boost landing clicks 3x pillars.", "relates_to": [97, 103]},
  {"type": "plan", "content": "Cycle 15: Dark mode toggle (CSS vars swap neon hues); 2 new worlds/stories (procedural remix); raymarcher/swarm perf polish + presets.", "relates_to": 102},
  {"type": "idea", "content": "Future: Cross-pillar remix (world lore → story ending; synth → world ambiance).", "relates_to": 100},
  {"type": "observation", "content": "SVG export uses dataURL—no budget, infinite user content gen.", "relates_to": 91}
]