tts-voice-creator-clone-and.../static/sections/s-connect.html
mARTin-B78 90cc7b7eb1 AI Backends: local service connect/disconnect, Docker container management, 0.0.0.0 probe fix
- Add initLlmsSection() IIFE to app.js: copy buttons, API key persistence with eye toggle
  and saved badge, local service URL persistence, Connect/Disconnect toggle with server-side
  probe via /api/probe-url (avoids CORS), card turns green on success / red on failure
- Substitute 0.0.0.0 → host.docker.internal before probing (0.0.0.0 not routable from Docker)
- Add /api/local-containers, /api/probe-url, start/stop/restart endpoints to server.py
- Rewrite AI Backends section into Local / Online API categories with Docker stack grid,
  local service cards (LLM/STT/TTS) with icons and editable URL inputs, online cloud API cards
- Add bind mounts for static/ and server.py so changes take effect without image rebuild
- Add dc-grid, llm-local-grid CSS with uniform minmax(310px,1fr) card layout
- Fix VOICE_HOST_DIR default via .env so voice folders survive container recreation

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
2026-05-26 22:35:42 +02:00

64 lines
4.4 KiB
HTML

<div class="section-head">
<span class="section-icon">&#128279;</span>
<div class="section-title">
<h2>Connect Your Apps</h2>
<p>Copy ready-made configuration snippets for SillyTavern, Open WebUI, Home Assistant, and more.</p>
</div>
</div>
<div class="tab-content" id="tab-integrations">
<div class="card">
<h2>Use voices in other apps</h2>
<p class="card-subtitle">The editor creates and manages the voice files. External apps should connect to the Creator proxy or a reachable TTS backend, then use one of the active voice names.</p>
<div class="integration-toolbar">
<button class="btn-primary" id="show-api-btn" type="button">show api</button>
<button class="btn-secondary" id="integration-refresh-btn">Refresh examples</button>
<button class="btn-secondary" id="copy-active-voices-btn-integrations">Copy active voices</button>
<span id="integration-url-label" class="note"></span>
</div>
</div>
<div class="integration-grid">
<div class="integration-card">
<h3>SillyTavern</h3>
<p>Use an OpenAI-compatible TTS provider. Paste one active voice into the voice field, or paste the comma-separated list where SillyTavern accepts custom voices.</p>
<pre><code id="snippet-sillytavern"></code></pre>
<button class="btn-secondary copy-snippet" data-snippet="snippet-sillytavern">Copy SillyTavern sample</button>
</div>
<div class="integration-card">
<h3>Open WebUI</h3>
<p>Configure TTS as OpenAI-compatible audio. Use the creator proxy if you want Routing rules such as incoming voice <code>default</code> mapped by language.</p>
<pre><code id="snippet-open-webui"></code></pre>
<button class="btn-secondary copy-snippet" data-snippet="snippet-open-webui">Copy Open WebUI sample</button>
</div>
<div class="integration-card">
<h3>Home Assistant</h3>
<p>Use this as a REST example for automations or scripts that call the TTS backend. Save the returned audio somewhere Home Assistant can play from.</p>
<pre><code id="snippet-home-assistant"></code></pre>
<button class="btn-secondary copy-snippet" data-snippet="snippet-home-assistant">Copy Home Assistant sample</button>
</div>
<div class="integration-card">
<h3>Generic curl test</h3>
<p>Quick terminal test for the voice list and speech endpoint after restarting the TTS container.</p>
<pre><code id="snippet-curl"></code></pre>
<button class="btn-secondary copy-snippet" data-snippet="snippet-curl">Copy curl sample</button>
</div>
<div class="integration-card">
<h3>VoiceDesign virtual voices</h3>
<p>Use saved Voice Design prompt presets without exporting WAVs. Point the external app at this creator app as an OpenAI-compatible TTS proxy and select a <code>vd_...</code> voice.</p>
<pre><code id="snippet-voice-design-proxy"></code></pre>
<button class="btn-secondary copy-snippet" data-snippet="snippet-voice-design-proxy">Copy virtual voice sample</button>
</div>
<div class="integration-card">
<h3>Streaming TTS</h3>
<p>Use this when the target app can play audio progressively. For routed streaming, keep response format WAV and avoid before/after route sounds, otherwise the proxy must buffer before playback.</p>
<pre><code id="snippet-streaming-howto"></code></pre>
<button class="btn-secondary copy-snippet" data-snippet="snippet-streaming-howto">Copy streaming how-to</button>
</div>
</div>
<div class="card">
<h2>Important after voice changes</h2>
<p class="card-subtitle">After enabling, hiding, adding, renaming, cropping, or normalising voices, restart the Qwen3-TTS container so its engine scans the updated <code>active_voices</code> folder. Then refresh the model or voice list in the target app.</p>
<p class="note">Virtual VoiceDesign voices are different: they use saved prompt presets through this app's proxy and do not need a WAV export or TTS-container rescan. They do need the <code>faster-qwen3-tts-voicedesign</code> container reachable from Settings.</p>
</div>
</div><!-- /tab-integrations -->