mirror of
https://github.com/steveseguin/caption-local.git
synced 2026-10-10 10:09:31 +00:00
58 lines
5.1 KiB
HTML
58 lines
5.1 KiB
HTML
<!doctype html>
|
||
<html lang="en"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1">
|
||
<title>Local captions</title><link rel="stylesheet" href="/static/capture.css"></head><body>
|
||
<a class="skip-link" href="#captureControls">Skip to caption controls</a>
|
||
<header><h1>Local captions</h1>
|
||
<nav aria-label="Setup help"><a href="https://github.com/steveseguin/caption-local/blob/main/docs/SELF-HOSTING.md" rel="noreferrer">How it works</a><a href="https://github.com/steveseguin/caption-local/blob/main/docs/GETTING-STARTED.md" rel="noreferrer">Install and start</a><a href="https://github.com/steveseguin/caption-local/blob/main/docs/README.md" rel="noreferrer">All guides & help</a></nav>
|
||
<p>Speech is processed by your Caption Local service. Choose your audio input, start captions, then Stop and download your transcript.</p></header>
|
||
<main>
|
||
<form id="auth" hidden>
|
||
<label>Service access token<input id="accessToken" type="password" autocomplete="off" spellcheck="false"></label>
|
||
<small>Use the token supplied by the server operator. It stays in this tab and is not sent to caption.ninja.</small>
|
||
<button type="submit">Connect to service</button>
|
||
</form>
|
||
<p id="capabilities" role="status">Checking model…</p>
|
||
|
||
<section class="panel" aria-labelledby="audioTitle">
|
||
<h2 id="audioTitle">Choose your audio and output</h2>
|
||
<div class="fields">
|
||
<label>Microphone<select id="microphone"><option value="">System default</option></select></label>
|
||
<label>Spoken language<select id="language"><option value="en">English</option></select></label>
|
||
<label>Microphone sensitivity<select id="sensitivity"><option value="0.0008">Quiet speech</option><option value="0.002" selected>Normal</option><option value="0.006">Noisy room</option></select></label>
|
||
<label>Caption interval<select id="captionInterval"><option value="3">3 seconds — earlier</option><option value="6" selected>6 seconds — balanced</option><option value="9">9 seconds — more context</option></select></label>
|
||
<label>Caption output<select id="mode"><option value="transcribe">Spoken-language captions</option><option value="translate">English translation</option><option value="both">Original + English</option></select></label>
|
||
</div>
|
||
<p class="hint">Start with six-second captions. Shorter intervals can reduce accuracy and capacity. English translation means speech translated into English.</p>
|
||
</section>
|
||
<section class="panel" id="captureControls" aria-labelledby="captionsTitle" tabindex="-1">
|
||
<h2 id="captionsTitle">Capture and save</h2>
|
||
<div class="actions">
|
||
<button id="start" disabled>Start captions</button> <button id="stop" disabled>Stop</button>
|
||
<button id="retry" hidden>Retry pending audio</button> <button id="discard" hidden>Discard pending audio</button>
|
||
</div>
|
||
<p id="status" role="status">Ready</p><p id="error" role="alert"></p>
|
||
<label>Microphone level<meter id="meter" min="0" max="0.1" value="0"></meter></label>
|
||
<div id="captions" role="log" aria-live="polite" aria-label="Live captions"></div>
|
||
<button id="download">Download transcript</button>
|
||
|
||
<p class="hint">Stop and let pending audio finish before downloading. Audio is not saved; closing the tab can lose pending audio and unsaved text.</p>
|
||
</section>
|
||
<details><summary>Send captions to caption.ninja</summary>
|
||
<p>Optional: caption text will travel through the selected relay (caption.ninja’s public relay by default). Audio stays on the inference host. Paste the editor’s <strong>private automatic-caption room</strong> below. The editor reviews these captions before publishing to its separate public room.</p>
|
||
<label>Text to send<select id="relayOutput"><option value="transcript">Original transcription</option><option value="translation">English translation</option></select></label>
|
||
<details><summary>Use a private relay</summary>
|
||
<label>Relay address<input id="relayAddress" type="url" value="wss://api.caption.ninja:443" spellcheck="false"></label>
|
||
<label>Caption website address<input id="captionSite" type="url" value="https://caption.ninja/" spellcheck="false"></label>
|
||
<label>Room publishing token<input id="relayToken" type="password" autocomplete="off" spellcheck="false"></label>
|
||
<label>Editor output room<input id="reviewRoom" value="output" autocomplete="off" maxlength="128"></label>
|
||
<p>A private relay needs its own room token, separate from the inference service token. The editor needs the source viewing token and output publishing token. Links carry the relay address, never tokens. Turn sharing off before changing these settings.</p>
|
||
</details>
|
||
<label>Source room<input id="room" autocomplete="off" maxlength="128"></label>
|
||
<label><input id="share" type="checkbox"> Send caption text to caption.ninja</label>
|
||
<p id="relay" role="status">Sharing off</p><a id="editorLink" hidden target="_blank" rel="noopener noreferrer">Open caption editor</a>
|
||
</details>
|
||
<p><a href="/capture-local.html">Connection settings and capture diagnostics</a></p>
|
||
</main>
|
||
<script src="/static/relay-config.js"></script><script src="/static/private-relay-client.js"></script><script src="/static/ws-publisher.js"></script><script src="/static/audio-buffer.js"></script><script src="/static/app.js"></script>
|
||
</body></html>
|