Spaces:
Sleeping
Sleeping
File size: 1,614 Bytes
8d0498c | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 | <!doctype html>
<html lang="en">
<head>
<meta charset="utf-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1"/>
<title>Video Template Builder (FFmpeg)</title>
<link rel="stylesheet" href="/static/styles.css"/>
</head>
<body>
<header>
<h1>Video Template Builder</h1>
<p class="sub">Create/edit templates (JSON) → Render via API.</p>
</header>
<main class="grid">
<section class="panel">
<h2>Templates</h2>
<div class="row">
<button id="refresh">Refresh</button>
<button id="new">New</button>
</div>
<ul id="list" class="list"></ul>
</section>
<section class="panel">
<h2>Editor</h2>
<div class="row">
<input id="tplId" placeholder="template id (e.g. my_tpl)" />
<button id="save">Save</button>
</div>
<textarea id="json" spellcheck="false"></textarea>
<p class="hint">Tip: Use <code>{name}</code> placeholder in text.value and pass it during render.</p>
</section>
<section class="panel">
<h2>Render</h2>
<div class="row">
<input id="name" placeholder="name variable" value="Marne"/>
<button id="render">Render</button>
</div>
<div id="renderStatus" class="status"></div>
<video id="player" controls></video>
<p class="hint">Renders are CPU-only and can take a bit on free tier.</p>
</section>
</main>
<footer>
<span>Endpoints: <code>/api/templates</code>, <code>/api/render</code>, <code>/api/jobs/<id></code></span>
</footer>
<script src="/static/main.js"></script>
</body>
</html>
|