`README.md`

36 lines
# graphics.agentabrams.com — Agent Abrams Graphics

Static graphics hub: left panel lists every graphic (file-browser style, `*.aa` names),
right panel runs the selected graphic in an iframe. Zero dependencies, zero build step.
Mirrors the `games.agentabrams.com` pattern.

Live target: https://graphics.agentabrams.com (Kamatera, `/var/www/graphics.agentabrams.com`, nginx static)

## Adding a graphic

1. Drop a self-contained graphic at `graphics/<id>/index.html` (must run standalone in an iframe).
2. Add an entry to `graphics.json`:

```json
{ "id": "<id>", "file": "<Name>.aa", "title": "...", "desc": "...", "path": "graphics/<id>/", "added": "YYYY-MM-DD" }
```

3. Deploy (Steve-gated): `deploy/deploy.sh`

The hub auto-selects the last-viewed graphic (localStorage) and supports `#<id>` deep links.
The `.aa` filename is a display label in the manifest; the iframe always loads `index.html`.

## Graphics

| File | What | Source |
|---|---|---|
| `Spirograph.aa` | Animated hypotrochoid plotter — R/r/d sliders, live rainbow color cycling, presets, glow, gear schematic, save-PNG, hi-DPI, keyboard shortcuts | Model Arena challenge (Free-Roster · Spirograph), improved from the Claude Opus starting artifact |
| `LivingFractalTree.aa` | Recursive tree that grows on load and sways in simulated wind, with seasonal foliage (spring blossoms → summer greens → autumn fall → winter snow), branch-depth + wind sliders, manual/auto season control, and a ground leaf pile | Model Arena challenge (Custom · Living Fractal Tree), built from the Grok 4.5 starting artifact |
| `FlowField.aa` | Generative flow-field — thousands of particles follow a seeded Perlin noise field painting harmonious colored trails. Mouse steers the flow (drag = stronger swirl, Tab = repel), arrow keys pan the field, Space reseeds palette+field, S saves PNG. Color-batched draw, hi-DPI, resize-preserving. | Model Arena challenge (Custom · Generative Art Canvas), rebuilt from the Qwen3 14B starting artifact |

## Tests

```sh
node tests/e2e.mjs   # headless: manifest render, iframe graphic renders, deep links
```