mARTin-B78
6808db3c59
- Rename "LLMs" section to "Engines" with brain icon - Add three sub-pages (Language Models / Speech to Text / Text to Speech) following the same nav-tree pattern as Settings and My Voices - Rewrite s-llms.html: three s-engines-page divs, docker container grids (dc-grid-tts, dc-grid-stt), VibeVoice card in TTS section, static cloud API cards per category - Add navEnginesCat() and applyEnginesPage() to nav.js; engines tree open/close in showSection() - Remove obsolete initLlmCatTabs IIFE; fix dc-refresh-btn from ID to class-based querySelectorAll - Make integration cards in Connect Apps collapsible (collapsed by default) with favicon/icon prepended to h3 - Unify all Engines card grids to minmax(380px, 1fr) so local, docker, and cloud cards are the same width - Add s-engines-page CSS (display:none / is-active:flex) Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
80 lines
6.3 KiB
HTML
80 lines
6.3 KiB
HTML
<div class="section-head">
|
|
<span class="section-icon"><span class="mdi mdi-api"></span></span>
|
|
<div class="section-title">
|
|
<h2>Connect Your Apps</h2>
|
|
<p>Copy ready-made configuration snippets for SillyTavern, Open WebUI, Home Assistant, MCP agents, 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" data-favicon="https://www.google.com/s2/favicons?domain=sillytavern.app&sz=16">
|
|
<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" data-favicon="https://www.google.com/s2/favicons?domain=openwebui.com&sz=16">
|
|
<h3>Open WebUI</h3>
|
|
<p>Enable TTS in Open WebUI under <strong>Settings → Audio</strong>. Set API base URL to this app's proxy and pick any active voice name. STT also works via the same proxy.</p>
|
|
<pre><code id="snippet-open-webui"></code></pre>
|
|
<button class="btn-secondary copy-snippet" data-snippet="snippet-open-webui">Copy Open WebUI config</button>
|
|
</div>
|
|
<div class="integration-card" data-favicon="https://www.google.com/s2/favicons?domain=home-assistant.io&sz=16">
|
|
<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" data-icon="mdi mdi-console-line">
|
|
<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" data-icon="mdi mdi-palette-outline">
|
|
<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 integration-card-wide" data-favicon="https://www.google.com/s2/favicons?domain=anthropic.com&sz=16">
|
|
<h3><span class="mdi mdi-robot-outline"></span> MCP — Native built-in server</h3>
|
|
<p>The app ships a built-in MCP server at <code>/mcp</code> (JSON-RPC 2.0, Streamable HTTP). No external script or extra packages needed. Tools: <strong>speak</strong>, <strong>transcribe</strong>, <strong>list_captures</strong>, <strong>list_profiles</strong>.</p>
|
|
<pre><code id="snippet-mcp-claude-cmd"></code></pre>
|
|
<div class="btn-row" style="gap:8px;flex-wrap:wrap">
|
|
<button class="btn-secondary copy-snippet" data-snippet="snippet-mcp-claude-cmd">Copy Claude Code one-liner</button>
|
|
<button class="btn-secondary copy-snippet" data-snippet="snippet-mcp-claude-config">Copy JSON config</button>
|
|
</div>
|
|
<pre style="margin-top:10px"><code id="snippet-mcp-claude-config"></code></pre>
|
|
</div>
|
|
<div class="integration-card" data-icon="mdi mdi-bullhorn-outline">
|
|
<h3><span class="mdi mdi-bullhorn-outline"></span> /speak — direct REST</h3>
|
|
<p>POST text to <code>/speak</code> from any script, agent, or app. Voice resolves from explicit param → per-client binding → default voice. Optional persona LLM rewrite.</p>
|
|
<pre><code id="snippet-speak"></code></pre>
|
|
<button class="btn-secondary copy-snippet" data-snippet="snippet-speak">Copy /speak example</button>
|
|
</div>
|
|
<div class="integration-card" data-icon="mdi mdi-waveform">
|
|
<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 -->
|