New TTS backend: Kokoro FastAPI (82M) — OpenAI-compatible, 11 built-in voices, only shows when server is reachable (~300 MB CPU, ~0.1× RTF). New STT backends in Transcribe dropdown: faster-whisper (CTranslate2 GPU, ~70× RT, 1.5 GB VRAM), whisper.cpp (CPU/CUDA, ~8–15× RT, ~1 GB RAM), Groq Whisper (fastest cloud, free 2 000 req/day, key shared with Groq LLM). Backend help panels now show ⚡ speed · ⏰ latency · ⭐ quality · 💾 RAM metric chips for all TTS and STT backends. Active Docker Stack cards also get per-container metric chips. AI Backends section: "Use as STT" / "Use as TTS" one-click buttons on faster-whisper, whisper.cpp, and Kokoro cards apply URLs to Settings without leaving the page. Groq Whisper card notes the shared key path. Settings: Kokoro URL in TTS cluster; faster-whisper URL, whisper.cpp URL, Groq API key in STT cluster; quick-fill buttons for all local STT engines. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
276 lines
16 KiB
HTML
276 lines
16 KiB
HTML
<div class="section-head">
|
|
<span class="section-icon">⚙</span>
|
|
<div class="section-title">
|
|
<h2>Settings</h2>
|
|
<p>Configure backend URLs, API keys, voice folders, and playback preferences.</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="tab-content" id="tab-settings">
|
|
<div class="card" id="settings-box">
|
|
<div class="settings-title-row">
|
|
<div>
|
|
<h2>Settings</h2>
|
|
<p class="card-subtitle">Configure the service URLs you actually use first. Advanced payloads, folders, and keys are tucked away below.</p>
|
|
</div>
|
|
<div class="settings-status-pill">Local stack</div>
|
|
</div>
|
|
|
|
<div class="setup-intro settings-checklist" id="settings-first-run-note">
|
|
<strong>Quick setup</strong>
|
|
<span>1. Check core TTS URLs.</span>
|
|
<span>2. Point STT at Whisper, Parakeet, or the NVIDIA router.</span>
|
|
<span>3. Save settings.</span>
|
|
</div>
|
|
|
|
<section class="settings-section settings-section-primary">
|
|
<div class="settings-section-head">
|
|
<div>
|
|
<h3>Core connections</h3>
|
|
<p>These are the endpoints you change most often. Qwen3 TTS, NVIDIA TTS, and STT are grouped separately.</p>
|
|
</div>
|
|
</div>
|
|
<div class="settings-cluster-grid">
|
|
<div class="settings-cluster">
|
|
<div class="settings-cluster-head">
|
|
<strong>TTS Text to Speech</strong>
|
|
<span>Qwen3 engines: clone, design, custom, streaming · Kokoro FastAPI</span>
|
|
</div>
|
|
<div class="settings-grid compact">
|
|
<div class="s-field">
|
|
<label>Voice Clone/Base URL <span style="font-weight:400">(WAV voices)</span></label>
|
|
<input type="text" id="s-tts-url" placeholder="http://host.docker.internal:8020">
|
|
<span class="s-hint">Uploaded/cloned WAV voices. Expected: <code>POST /v1/audio/speech</code>.</span>
|
|
</div>
|
|
<div class="s-field">
|
|
<label>Voice Design URL <span style="font-weight:400">(instruction voices)</span></label>
|
|
<input type="text" id="s-voice-design-url" placeholder="http://host.docker.internal:8021">
|
|
<span class="s-hint">Prompt-designed voices and <code>vd_...</code> virtual voices.</span>
|
|
</div>
|
|
<div class="s-field">
|
|
<label>CustomVoice URL</label>
|
|
<input type="text" id="s-customvoice-url" placeholder="http://host.docker.internal:8022">
|
|
<span class="s-hint">Style over configured speakers such as Ryan, Vivian, Serena.</span>
|
|
</div>
|
|
<div class="s-field">
|
|
<label>Streaming URL</label>
|
|
<input type="text" id="s-tts-stream-url" placeholder="http://host.docker.internal:8023">
|
|
<span class="s-hint">Progressive low-latency WAV playback.</span>
|
|
</div>
|
|
<div class="s-field">
|
|
<label>Kokoro FastAPI URL <span style="font-weight:400">(82M · CPU-friendly)</span></label>
|
|
<input type="text" id="s-kokoro-url" placeholder="http://host.docker.internal:8880/v1">
|
|
<span class="s-hint">OpenAI-compatible TTS. Built-in voices: af_bella, bf_emma, am_adam… ~300 MB RAM · ~0.1× CPU RTF.</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="settings-cluster">
|
|
<div class="settings-cluster-head">
|
|
<strong>NVIDIA speech stack</strong>
|
|
<span>router, Magpie TTS, Parakeet ASR, clone NIM</span>
|
|
</div>
|
|
<div class="settings-grid compact">
|
|
<div class="s-field">
|
|
<label>NVIDIA router URL <span style="font-weight:400">(TTS + STT)</span></label>
|
|
<input type="text" id="s-nvidia-router-url" placeholder="http://host.docker.internal:8090">
|
|
<span class="s-hint">OpenAI-compatible base URL for the NVIDIA speech router.</span>
|
|
</div>
|
|
<div class="s-field">
|
|
<label>NVIDIA Magpie TTS URL</label>
|
|
<input type="text" id="s-nvidia-tts-url" placeholder="http://host.docker.internal:8091">
|
|
<span class="s-hint">Direct Magpie endpoint. Fixed speakers, not WAV cloning.</span>
|
|
</div>
|
|
<div class="s-field">
|
|
<label>NVIDIA Parakeet ASR URL</label>
|
|
<input type="text" id="s-nvidia-asr-url" placeholder="http://host.docker.internal:8092">
|
|
<span class="s-hint">Direct Parakeet endpoint for transcription.</span>
|
|
</div>
|
|
<div class="s-field">
|
|
<label>NVIDIA Zeroshot NIM URL</label>
|
|
<input type="text" id="s-nvidia-zeroshot-url" placeholder="http://host.docker.internal:8093">
|
|
<span class="s-hint">Magpie Zeroshot clone endpoint with <code>audio_prompt</code>.</span>
|
|
</div>
|
|
<div class="s-field">
|
|
<label>NVIDIA Flow NIM URL</label>
|
|
<input type="text" id="s-nvidia-flow-url" placeholder="http://host.docker.internal:8094">
|
|
<span class="s-hint">Magpie Flow clone endpoint with <code>audio_prompt</code> and transcript.</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="settings-cluster settings-cluster-stt">
|
|
<div class="settings-cluster-head">
|
|
<strong>STT Speech to Text</strong>
|
|
<span>Whisper, faster-whisper, whisper.cpp, Groq, Parakeet, NVIDIA router</span>
|
|
</div>
|
|
<div class="settings-grid compact stt-settings-grid">
|
|
<div class="s-field stt-url-field">
|
|
<label>Configured Whisper/STT URL</label>
|
|
<input type="text" id="s-whisper-url" placeholder="http://host.docker.internal:8010">
|
|
<span class="s-hint">Default recognition endpoint. Expected: <code>POST /v1/audio/transcriptions</code>.</span>
|
|
<div class="btn-row settings-mini-actions">
|
|
<button class="btn-secondary" id="s-use-parakeet-asr" type="button">Use Parakeet</button>
|
|
<button class="btn-secondary" id="s-use-nvidia-router" type="button">Use router</button>
|
|
<button class="btn-secondary" id="s-use-faster-whisper" type="button">Use faster-whisper</button>
|
|
<button class="btn-secondary" id="s-use-whisper-cpp" type="button">Use whisper.cpp</button>
|
|
</div>
|
|
</div>
|
|
<div class="s-field">
|
|
<label>faster-whisper-server URL <span style="font-weight:400">(CTranslate2 GPU)</span></label>
|
|
<input type="text" id="s-faster-whisper-url" placeholder="http://host.docker.internal:8000">
|
|
<span class="s-hint">GPU-accelerated Whisper via CTranslate2. ~70× RT · 1.5 GB VRAM · <code>POST /v1/audio/transcriptions</code>.</span>
|
|
</div>
|
|
<div class="s-field">
|
|
<label>whisper.cpp URL <span style="font-weight:400">(CPU/CUDA)</span></label>
|
|
<input type="text" id="s-whisper-cpp-url" placeholder="http://host.docker.internal:8080">
|
|
<span class="s-hint">Lightweight C++ Whisper server. ~8–15× RT CPU · ~1 GB RAM · <code>POST /v1/audio/transcriptions</code>.</span>
|
|
</div>
|
|
<div class="s-field">
|
|
<label>Groq API key <span style="font-weight:400">(Groq Whisper & LLM)</span></label>
|
|
<div class="s-key-row">
|
|
<input type="password" id="s-groq-api-key" placeholder="gsk_…" autocomplete="off">
|
|
<button type="button" class="s-eye-btn" data-target="s-groq-api-key">👁</button>
|
|
</div>
|
|
<span class="s-hint">Used for Groq Whisper STT (whisper-large-v3-turbo) and Groq LLM. Free: 2 000 req/day. Fastest cloud transcription.</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="settings-section">
|
|
<div class="settings-section-head">
|
|
<div>
|
|
<h3>Playback behavior</h3>
|
|
<p>Small behavior switches for previews and OpenAI-compatible TTS calls.</p>
|
|
</div>
|
|
</div>
|
|
<div class="settings-grid settings-behavior-grid">
|
|
<div class="s-field">
|
|
<label>TTS preview playback</label>
|
|
<select id="s-tts-stream-mode">
|
|
<option value="auto">Stream when available, then fall back</option>
|
|
<option value="streaming">Streaming only</option>
|
|
<option value="buffered">Buffered WAV only</option>
|
|
</select>
|
|
<span class="s-hint">Buffered keeps Save WAV available. Streaming starts sooner.</span>
|
|
</div>
|
|
<div class="s-field">
|
|
<label>OpenAI-compatible request style</label>
|
|
<select id="s-tts-backend">
|
|
<option value="openai">Qwen3-TTS / OpenAI</option>
|
|
<option value="localai">LocalAI (/tts)</option>
|
|
<option value="pocket">Pocket-TTS</option>
|
|
<option value="nvidia_magpie">NVIDIA Magpie / OpenAI</option>
|
|
</select>
|
|
<span class="s-hint">Controls payload shape for the normal TTS API URL.</span>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<details class="settings-details">
|
|
<summary>
|
|
<span>Advanced request payloads</span>
|
|
<small>JSON extras sent to each backend</small>
|
|
</summary>
|
|
<div class="settings-grid three settings-param-grid">
|
|
<div class="s-field">
|
|
<label>Voice Clone/Base params</label>
|
|
<textarea id="s-tts-extra-voice-clone" spellcheck="false" placeholder='{"temperature":0.1,"top_p":0.8,"seed":0}'></textarea>
|
|
<span class="s-hint">Extra fields for the 8020 WAV voice clone/base model.</span>
|
|
</div>
|
|
<div class="s-field">
|
|
<label>Streaming params</label>
|
|
<textarea id="s-tts-extra-streaming" spellcheck="false" placeholder='{"temperature":0.1,"top_p":0.8,"seed":0}'></textarea>
|
|
<span class="s-hint">Extra fields for the 8023 streaming model.</span>
|
|
</div>
|
|
<div class="s-field">
|
|
<label>CustomVoice params</label>
|
|
<textarea id="s-tts-extra-customvoice" spellcheck="false" placeholder='{"temperature":0.1,"top_p":0.8,"seed":0}'></textarea>
|
|
<span class="s-hint">Extra fields for the CustomVoice backend.</span>
|
|
</div>
|
|
<div class="s-field">
|
|
<label>Voice Design params</label>
|
|
<textarea id="s-tts-extra-voice-design" spellcheck="false" placeholder='{"temperature":0.1,"top_p":0.8,"seed":0}'></textarea>
|
|
<span class="s-hint">Extra fields for Voice Design and virtual <code>vd_...</code> voices.</span>
|
|
</div>
|
|
<div class="s-field">
|
|
<label>NVIDIA Magpie params</label>
|
|
<textarea id="s-tts-extra-nvidia-magpie" spellcheck="false" placeholder="{}"></textarea>
|
|
<span class="s-hint">Usually empty. Magpie accepts fixed speaker voices such as sofia, aria, jason, leo, and john.</span>
|
|
</div>
|
|
<div class="s-field">
|
|
<label>NVIDIA Zeroshot params</label>
|
|
<textarea id="s-tts-extra-nvidia-zeroshot" spellcheck="false" placeholder='{"zero_shot_quality":20}'></textarea>
|
|
<span class="s-hint">Optional multipart fields. The app supplies <code>text</code>, <code>language</code>, and <code>audio_prompt</code>.</span>
|
|
</div>
|
|
<div class="s-field">
|
|
<label>NVIDIA Flow params</label>
|
|
<textarea id="s-tts-extra-nvidia-flow" spellcheck="false" placeholder="{}"></textarea>
|
|
<span class="s-hint">Optional multipart fields. The app also sends the saved reference transcript.</span>
|
|
</div>
|
|
<div class="s-field">
|
|
<label>Kokoro FastAPI params</label>
|
|
<textarea id="s-tts-extra-kokoro" spellcheck="false" placeholder="{}"></textarea>
|
|
<span class="s-hint">Extra JSON fields for the Kokoro backend. Usually empty — voice is selected from the voice dropdown.</span>
|
|
</div>
|
|
</div>
|
|
</details>
|
|
|
|
<details class="settings-details">
|
|
<summary>
|
|
<span>Voice folders</span>
|
|
<small>container paths and Portainer volume mounts</small>
|
|
</summary>
|
|
<div class="settings-grid">
|
|
<div class="s-field">
|
|
<label>Voice scan directory</label>
|
|
<input type="text" id="s-voices-scan-dir" placeholder="/voices">
|
|
<span class="s-hint">Contains <code>active_voices</code>, <code>hidden_voices</code>, sounds, and metadata.</span>
|
|
</div>
|
|
<div class="s-field">
|
|
<label>Active voices directory</label>
|
|
<input type="text" id="s-output-dir" placeholder="/voices/active_voices">
|
|
<span class="s-hint">New cloned/exported voices are saved here.</span>
|
|
</div>
|
|
</div>
|
|
</details>
|
|
|
|
<details class="settings-details">
|
|
<summary>
|
|
<span>API keys</span>
|
|
<small>usually empty for local containers</small>
|
|
</summary>
|
|
<div class="settings-grid three">
|
|
<div class="s-field">
|
|
<label>TTS API key <span style="font-weight:400">(optional)</span></label>
|
|
<div class="s-key-row">
|
|
<input type="password" id="s-tts-key" placeholder="dummy, sk-local, or leave empty" autocomplete="off">
|
|
<button type="button" class="s-eye-btn" data-target="s-tts-key">👁</button>
|
|
</div>
|
|
</div>
|
|
<div class="s-field">
|
|
<label>Voice Design API key <span style="font-weight:400">(optional)</span></label>
|
|
<div class="s-key-row">
|
|
<input type="password" id="s-vd-key" placeholder="dummy, sk-local, or leave empty" autocomplete="off">
|
|
<button type="button" class="s-eye-btn" data-target="s-vd-key">👁</button>
|
|
</div>
|
|
</div>
|
|
<div class="s-field">
|
|
<label>Whisper API key <span style="font-weight:400">(optional)</span></label>
|
|
<div class="s-key-row">
|
|
<input type="password" id="s-whisper-key" placeholder="dummy, sk-local, or leave empty" autocomplete="off">
|
|
<button type="button" class="s-eye-btn" data-target="s-whisper-key">👁</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</details>
|
|
|
|
<div class="btn-row settings-actions">
|
|
<button class="btn-primary" id="s-save-btn">Save settings</button>
|
|
<button class="btn-secondary" id="s-close-btn">Reload settings</button>
|
|
</div>
|
|
</div>
|
|
</div><!-- /tab-settings -->
|