Adom Video — Hydrogen-webview video player

{
  "schema_version": 1,
  "type": "app",
  "slug": "adom-video",
  "title": "Adom Video — Hydrogen-webview video player",
  "brief": "Frame-accurate video player for Adom containers. Plays .webm/.mp4 with native HTML5 controls + custom toolbar. Path rows click-to-reveal in VS Code Explorer; extract/trim outputs auto-reveal too. CLI-",
  "version": "0.1.4",
  "tags": [],
  "license": "MIT",
  "discovery_triggers": [
    "play video",
    "open video",
    "video player",
    "view recording",
    "watch clip",
    "scrub video",
    "frame by frame",
    "extract frame",
    "trim video",
    "gallery of videos",
    "view webm",
    "view mp4",
    "screen recording playback",
    "demo recording playback",
    "scrub through frames",
    "A-B loop",
    "pixel zoom video"
  ],
  "discovery_pitch": "Hydrogen-webview video player with frame-accurate scrub, A-B loop, pixel zoom, gallery thumbnails, and frame-extract / trim — every action CLI- and HTTP-drivable so Claude can seek and extract frames without simulating clicks.",
  "sample_prompts": [
    {
      "label": "Play a recording",
      "prompt": "Open /tmp/recording.webm in adom-video so I can scrub through it"
    },
    {
      "label": "Gallery",
      "prompt": "Open my /tmp/videolib folder in adom-video gallery view"
    },
    {
      "label": "Extract a frame",
      "prompt": "Use adom-video to extract the frame at t=2.0s from /tmp/recording.webm"
    },
    {
      "label": "Trim a clip",
      "prompt": "Use adom-video to trim /tmp/recording.webm from 1.0s to 5.0s"
    },
    {
      "label": "Drive the open player",
      "prompt": "Seek the open adom-video player to t=12.5s and pause it"
    },
    {
      "label": "Probe a file",
      "prompt": "Run adom-video probe on /tmp/recording.webm and show me the codec and FPS"
    }
  ],
  "install": {
    "binary_name": "adom-video",
    "install_dir": "",
    "install_hint": "",
    "version_cmd": ""
  },
  "readme": "# adom-video\n\nHydrogen-webview video player. Plays `.webm` / `.mp4` from disk with frame-accurate scrub, A-B loop, pixel zoom up to 8×, gallery thumbnails, and frame-extract / trim.\n\nCLI- and HTTP-drivable so Claude can `seek`, `pause`, `extract-frame`, and `trim` without simulating clicks.\n\n## Demo\n\n![Player + native controls + custom toolbar](apps/adom-video/hero.png)\n\nWatch the 6-section feature tour: [final.webm](apps/adom-video/final.webm)\n\nThe tour covers:\n\n1. **Player + native controls + custom toolbar** — a clip plays with the full HTML5 controls bar (timeline, volume, speed menu, fullscreen, picture-in-picture) AND the custom toolbar for everything the native bar doesn't give you.\n2. **Folder gallery** — every clip auto-probed for codec, resolution, frame count, recorded-at time parsed from the filename.\n3. **Scrub + A-B loop** — frame-step with `,` `.`, set markers with `I` `O`, instant loop fires.\n4. **Pixel zoom + pan** — zoom up to 8× with pixel-perfect rendering, drag to pan.\n5. **Extract frame → reveal in VS Code** — files land next to the source clip in `extracts/` and auto-reveal in the VS Code Explorer.\n6. **CLI + HTTP** — every action exposed as a CLI subcommand and an HTTP endpoint.\n\n## Why this exists\n\n`adom-desktop` produces screen and tab recordings as WebM. Until this tool, every demo round-tripped through the desktop (\"send the file home, open it manually, scrub manually, screenshot a frame manually\"). `adom-video play <file>` opens a tab next to VS Code, plays in a loop, and exposes every action as a CLI/HTTP call.\n\n## Quick use\n\n```bash\nadom-video play /tmp/recording.webm        # one-clip player\nadom-video play /tmp/recordings/           # gallery for the directory\nadom-video gallery /tmp/recordings/        # explicit gallery view\nadom-video probe /tmp/recording.webm       # ffprobe → JSON\nadom-video extract-frame v.webm 3.5 -o frame.png\nadom-video trim v.webm 1.0 5.0 -o clip.webm\n```\n\nExtracts and trims land in `<clip-folder>/extracts/<stem>-frame-<MMmSSsMMM>.png` and `<clip-folder>/trims/<stem>-trim-<in>-<out>.<ext>` — sortable filenames, sane location, auto-revealed in the VS Code Explorer sidebar (sidebar is forced visible too).\n\n## Drive an open player from outside (port auto-discovered via `/tmp/adom-video.port`)\n\n```bash\nadom-video seek 12.5      # jump to t=12.5s in the open tab\nadom-video pause\nadom-video resume\nadom-video set-rate 0.5   # half speed\nadom-video status         # current state JSON\nadom-video stop           # close tab + shut down server\n```\n\n## HTTP API\n\n| Method · Path | Purpose |\n|---|---|\n| `GET  /api/library` | List clips with metadata + filename hints (`rec-desktop-*`, `rec-tab-*`) |\n| `GET  /api/state` | Current player state (file, currentTime, paused, rate, in/out points, zoom) |\n| `POST /api/seek` `{t}` | Jump to time |\n| `POST /api/pause` `{}` · `POST /api/resume` `{}` | |\n| `POST /api/rate` `{rate}` | 0.25 → 4.0 |\n| `POST /api/zoom` `{zoom}` | 1.0 → 8.0 |\n| `POST /api/loop` `{t_in, t_out}` | Set A-B loop range |\n| `POST /api/load` `{path}` | Load a different clip into the open player |\n| `POST /api/extract-frame` `{path, t, out?}` | Write PNG, auto-reveal, return path |\n| `POST /api/trim` `{path, t_in, t_out, output?}` | Stream-copy webm/mp4, auto-reveal |\n| `POST /api/reveal` `{path}` | Reveal any path in the VS Code Explorer (forces sidebar visible) |\n| `GET  /api/console` | Recent JS console output (forwarded from the UI) |\n| `GET  /api/thumb?path=&t=&w=` | JPEG thumbnail (cached) |\n\n## Keyboard shortcuts\n\n| Key | Action |\n|---|---|\n| Space / K | Play / pause |\n| J / L | Slow down / speed up (0.25× → 4×) |\n| ← / → | −5s / +5s · Shift = ±1s · Alt = ±0.1s |\n| , / . | Previous / next frame (uses fps from probe) |\n| 0–9 | Jump to 0%, 10% … 90% |\n| I / O | Set A / B loop point · Shift+I/O = clear |\n| + / − | Zoom in/out (1× → 8×) · 0 = reset · drag to pan when zoomed |\n| F | Fullscreen |\n| M | Mute |\n| G | Toggle gallery view |\n| ? | Show shortcut help |\n\n## Filename hints\n\nRecordings produced by `adom-desktop` are auto-detected:\n\n- `rec-desktop-<unix-ms>.webm` → tagged `desktop`, recorded-at parsed from filename\n- `rec-tab-<session>-<tab>-<unix-ms>.webm` → tagged `tab`\n\nThe Inspector panel surfaces this plus codec / dimensions / FPS / frame count / duration / bit rate / file size / encoder / **clickable Folder + Path rows** that reveal in the VS Code Explorer.\n\n## How the FPS is computed\n\nChrome MediaRecorder writes `r_frame_rate=1000/1` and `avg_frame_rate=1000/1` as placeholder values — both useless. `adom-video probe` falls back to `ffprobe -count_packets` and divides by duration when the reported FPS is implausible (>120 fps). For typical desktop screen recordings this gives the real capture rate (15–30 fps).\n\n## Architecture\n\n- Rust + `tiny_http`. Single static binary, ~1.6 MB.\n- HTTP byte-range support — required for `<video>` element seek (the native scrubber works because of this).\n- ffprobe + ffmpeg must be on PATH.\n- Server writes `/tmp/adom-video.port` so subcommands find a running instance.\n- Always opens on a **non-VS-Code** Hydrogen pane — never covers Claude Code chat.\n- Container webview URL uses `$VSCODE_PROXY_URI` substitution (no `localhost:` baked in).\n- HTML uses `<base href=\"./\">` so relative URLs work in the proxied iframe.\n- Reveal-in-VS-Code via `adom-vscode reveal` + `adom-vscode sidebar show` (sidebar forced visible so the highlighted entry is in view).\n\n## Brand\n\nAdom dark + teal. Familjen Grotesk (headlines), Satoshi (body), JetBrains Mono (timecode + paths). Monochrome white SVG icons. No emoji.\n\n## License\n\nAGPL-3.0-or-later.\n",
  "author": {
    "name": "Kyle Bergstedt",
    "email": "[email protected]"
  },
  "visibility": {
    "public": true
  },
  "hero": null,
  "metadata": {},
  "created_at": "2026-05-28T05:29:18.652Z",
  "updated_at": "2026-05-28T05:29:18.652Z",
  "skills": []
}