[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"project-92754":3},{"id":4,"name":5,"fullName":6,"owner":7,"repo":5,"description":8,"homepage":9,"htmlUrl":10,"language":11,"languages":10,"totalLinesOfCode":10,"stars":12,"forks":13,"watchers":14,"openIssues":15,"contributorsCount":16,"subscribersCount":16,"size":16,"stars1d":16,"stars7d":16,"stars30d":17,"stars90d":16,"forks30d":16,"starsTrendScore":16,"compositeScore":18,"rankGlobal":10,"rankLanguage":10,"license":19,"archived":20,"fork":20,"defaultBranch":21,"hasWiki":20,"hasPages":20,"topics":22,"createdAt":10,"pushedAt":10,"updatedAt":35,"readmeContent":36,"aiSummary":37,"trendingCount":16,"starSnapshotCount":16,"syncStatus":38,"lastSyncTime":39,"discoverSource":40},92754,"FableCut","ronak-create\u002FFableCut","ronak-create","Zero-dependency browser video editor that AI agents can drive — JSON timeline, MCP + REST, live-reloading UI","",null,"JavaScript",345,24,157,1,0,188,54.19,"MIT License",false,"main",[23,24,25,26,27,28,29,30,31,32,33,34],"ai-agent","canvas","claude","ffmpeg","javascript","llm","mcp","nle","reels","video-editing","video-editor","zero-dependency","2026-07-22 04:02:07","# FableCut\n\n**A browser video editor that AI agents can drive.**\n\nhttps:\u002F\u002Fgithub.com\u002Fuser-attachments\u002Fassets\u002F2430b854-168b-4a9a-af2e-489e5efa7543\n\nFableCut is a Premiere-style non-linear video editor that runs entirely in your\nbrowser — and exposes its whole timeline as one JSON document. Edit it by hand,\nfrom the UI, or let an AI agent (Claude Code, Claude Desktop, or anything that\nspeaks MCP\u002FREST) cut your video for you while you watch the timeline update\nlive.\n\nZero npm dependencies. One `node server.js`. That's it.\n\n![FableCut editor](docs\u002Fscreenshot.png)\n\n## Why it's interesting\n\nMost \"AI video\" tools hide the edit behind an API. FableCut flips that: the\n**project file is the interface**. `project.json` describes media, clips,\ntracks, effects, keyframes and transitions — any process that can write JSON\ncan edit video, and the open browser UI hot-reloads within ~150 ms via\nserver-sent events. A human and an agent can work on the same timeline at the\nsame time.\n\n## Features\n\n**Editing**\n- 4 video tracks + 3 audio tracks, drag\u002Ftrim\u002Fsplit\u002Fsnap, undo\u002Fredo\n- **Timeline multi-select** — rubber-band marquee (drag on empty track area),\n  \u003Ckbd>Ctrl\u002FCmd\u002FShift+click\u003C\u002Fkbd> to add\u002Fremove clips, \u003Ckbd>Ctrl+A\u003C\u002Fkbd> to\n  select all, \u003Ckbd>Esc\u003C\u002Fkbd> to deselect. Drag any selected clip to move the\n  whole group; \u003Ckbd>Delete\u003C\u002Fkbd> removes all selected; \u003Ckbd>S\u003C\u002Fkbd> splits all\n  selected at the playhead. Inspector shows an \"N clips selected\" banner.\n- Beat & cue markers (tap \u003Ckbd>M\u003C\u002Fkbd> on the beat during playback) with edge snapping\n- Real decoded audio waveforms on clips\n- Canvas aspect presets (16:9, 9:16 reels, 4:5, 1:1) + safe-area guides\n\n**Look**\n- 12 one-click filter presets (cinematic, teal-orange, noir, vintage, cyberpunk…)\n- **Adjustment layers** — one clip grades everything below it, Premiere-style\n- Full grade controls: brightness\u002Fcontrast\u002Fsaturation\u002Fhue, **temperature & tint**,\n  blur, grayscale\u002Fsepia\u002Finvert, **vignette**, animated **film grain**\n- Blend modes (screen, multiply, overlay…), fit modes (contain\u002Fcover\u002Fstretch),\n  per-edge cropping, corner radius, flip H\u002FV\n- **Chroma key** (green screen) with tolerance\u002Fsoftness + spill suppression\n- **AI background removal** (person cut-out, in-browser via MediaPipe)\n\n**Motion**\n- Keyframe animation on ~25 properties with easing\n- **Speed ramps** — keyframe `speed` and the engine time-remaps video *and* the\n  export audio mix (the fast-into-slow-mo reel move)\n- **Camera shake** and **RGB-split\u002Fchromatic aberration**, both animatable\n- 17 transitions: fades, slides, wipes (4 directions), zoom, iris, spin, blur,\n  whip-pan, **glitch**, **pop**\n\n**Text**\n- Kinetic captions: typewriter, word-pop, word-slide, karaoke, **letter-pop**,\n  **wave**, **bounce**, **shake**\n- **Neon glow** for that TikTok caption look\n- Font editor: system fonts, drop-in custom fonts (`library\u002Ffonts\u002F`), and **any\n  Google Font by name** — loaded automatically\n- Gradient fills, outline, background pills, letter-spacing, line-height,\n  weights, italic, uppercase, alignment, soft shadows\n\n**Animated SVG clips**\n- A first-class `svg` clip kind: CSS-`@keyframes`-animated SVGs render\n  **frame-accurately** in preview and export (the compositor freezes the\n  animation at any time). Agents can author their own vector overlays —\n  lower-thirds, confetti, sparkles — as plain `.svg` files. Starters included.\n\n**Remake a reference video**\n- Give it a reference edit (a reel you like) and get back an **edit blueprint**:\n  shot boundaries, music beats + BPM, a loudness curve, per-shot energy, the\n  drop — plus the reference's **music track extracted** into your media, ready\n  to rebuild the same idea with your own footage. Zero extra dependencies\n  (ffmpeg does the decoding; onset\u002Ftempo detection is plain Node).\n  `node analyze.js ref.mp4`, `POST \u002Fapi\u002Fanalyze`, or the\n  `fablecut_analyze_reference` MCP tool.\n\n**Asset library**\n- `library\u002F` folders surface as tabs in the UI: **Elements** (overlay art),\n  **Sound FX**, **SVG** — drop files in, the open editor refreshes live\n\n**Export**\n- Fast export: browser renders every frame + an offline audio mix, ffmpeg\n  encodes a frame-accurate CRF-18 MP4 (keeps rendering if you switch tabs)\n- Realtime MediaRecorder fallback when ffmpeg isn't available\n\n## Quick start\n\n```bash\ngit clone https:\u002F\u002Fgithub.com\u002Fronak-create\u002FFableCut.git\ncd FableCut\nnode server.js        # → http:\u002F\u002Flocalhost:7777\n```\n\nRequirements: **Node 18+** and a Chromium-based browser. **ffmpeg on PATH** is\noptional but recommended (fast export + upload remuxing). AI background\nremoval fetches its model from a CDN on first use.\n\nDrop media into the window (or `.\u002Fmedia\u002F`), drag clips onto the timeline, edit,\nexport.\n\n## Driving it with an AI agent\n\nEverything an agent needs is in **[CLAUDE.md](CLAUDE.md)** — the complete\nschema, semantics and recipes. Point any capable model at that file and it can\noperate the editor end to end.\n\nThree equivalent control surfaces:\n\n1. **MCP** (best for Claude Code \u002F Claude Desktop) — register the bundled\n   zero-dependency MCP server once:\n   ```bash\n   claude mcp add -s user fablecut -- node \"\u003Cpath-to>\u002Ffablecut\u002Fmcp-server.js\"\n   ```\n   Tools: `fablecut_status` (auto-starts the editor), `fablecut_docs`,\n   `fablecut_get_project`, `fablecut_set_project`, `fablecut_patch_project`,\n   `fablecut_import_media`, `fablecut_analyze_reference`.\n\n   The surface is **token-efficient by design**: agents patch the timeline with\n   small ops (`fablecut_patch_project`) instead of round-tripping the whole\n   document, read a compact one-line-per-clip summary\n   (`fablecut_get_project {compact:true}`), and fetch only the manual sections\n   they need (`fablecut_docs {section:\"props\"}`).\n2. **The file** — read `project.json`, modify, bump `revision`, write. The UI\n   live-reloads.\n3. **REST** — `GET\u002FPUT \u002Fapi\u002Fproject`, `POST \u002Fapi\u002Fupload`, `GET \u002Fapi\u002Flibrary`,\n   SSE at `\u002Fapi\u002Fevents`. See CLAUDE.md for the full list.\n\nExample: ask Claude Code *\"cut these six clips to the beat markers, add a\nteal-orange grade, put a word-pop caption on top and a whoosh on every cut\"* —\nand watch the timeline rebuild itself.\n\nOr hand it a reference: *\"here's a reel I like — analyze it and remake it with\nmy clips, same music\"*. The agent calls `fablecut_analyze_reference`, gets the\nblueprint (cuts, beats, BPM, energy, drop, extracted music), and rebuilds the\nstructure shot-for-shot with your footage.\n\n**Conflict-safe concurrent editing**: the UI, the MCP tools, and direct\n`project.json` writes all agree on a `revision` counter. If you edit a clip in\nthe UI while an agent is mid-task, the agent's next write is rejected (409 from\nthe REST API \u002F a conflict error from `fablecut_set_project`) instead of\nsilently overwriting your change. The UI similarly detects when an agent write\nsupersedes a not-yet-saved local tweak and tells you with a toast instead of\ndropping it silently.\n\n## Project layout\n\n```\nserver.js        zero-dependency HTTP server: static hosting, REST API, SSE,\n                 ffmpeg export pipeline\napp.js           the editor: timeline UI, compositor, keyframes, text engine,\n                 SVG rasterizer, chroma key, exporters\nindex.html       single-page UI\nstyle.css        dark editor theme\nmcp-server.js    stdio MCP server exposing the editor to AI agents\nanalyze.js       reference-video analyzer: shots, beats\u002FBPM, energy, drop,\n                 music extraction (module + CLI)\nCLAUDE.md        the agent manual (schema + recipes) — also served by fablecut_docs\nproject.json     your timeline (created on first run; gitignored)\nmedia\u002F           project footage (gitignored)\nanalysis\u002F        cached edit blueprints from \u002Fapi\u002Fanalyze (gitignored)\nlibrary\u002F         default assets: elements\u002F sfx\u002F svg\u002F fonts\u002F\nexports\u002F         finished renders (gitignored)\n```\n\n## Authoring animated SVG overlays\n\nSVGs animate with plain CSS `@keyframes`. One convention: never hardcode\n`animation-delay` — set `--d: 0.4s` instead, and the compositor drives time by\npausing all animations and rebasing their delays. Full rules + a skeleton in\n[CLAUDE.md](CLAUDE.md#authoring-animated-svgs-the-svg-clip-kind); working\nexamples in [`library\u002Fsvg\u002F`](library\u002Fsvg\u002F).\n\n## Notes\n\n- The repo ships with **20 Google Fonts** (`library\u002Ffonts\u002F`, OFL — see\n  `LICENSES.md` there) and a set of self-authored SVG overlays and animated\n  elements (`library\u002Felements\u002F`, `library\u002Fsvg\u002F`, MIT like the rest of the repo).\n- `library\u002Fsfx\u002F` is yours to fill (gitignored): sound-effect sites typically\n  don't allow redistributing their files in a public repo, so FableCut doesn't —\n  `library\u002Fsfx\u002FREADME.md` lists good free sources.\n- Export runs in the browser because the compositor *is* the browser; agents\n  ask you to click Export (or render directly with ffmpeg from `media\u002F`).\n\n## License\n\n[MIT](LICENSE)\n","FableCut 是一款零依赖的浏览器端非线性视频编辑器，专为 AI 代理驱动而设计。它将完整编辑时序抽象为可读写的 JSON 项目文件（project.json），支持 MCP 协议与 REST API，结合服务端事件实现 UI 实时热更新（约150ms）。核心功能包括多轨道剪辑、AI 背景去除（MediaPipe）、色键抠像、关键帧动画、速度变速、动态转场与文字动效等，全部运行于浏览器内。适用于需人机协同编辑、AI 自动化剪辑（如短视频批量生成）、教育演示或轻量级原型验证等场景。",2,"2026-07-10 02:30:22","CREATED_QUERY"]