Convert voice persona lab to static Space

README.md

@@ -3,9 +3,7 @@ title: ADI Voice Persona Lab
 emoji: 🎛️
 colorFrom: gray
 colorTo: green
-sdk: gradio
-sdk_version: 6.19.0
-python_version: '3.12'
-app_file: app.py
+sdk: static
+app_file: index.html
 pinned: false
 ---

app.py

@@ -1,162 +0,0 @@
-import asyncio
-import re
-import tempfile
-import zipfile
-from pathlib import Path
-
-import edge_tts
-import gradio as gr
-
-
-PERSONAS = {
-    "ADI calm": {
-        "prefix": "Here is the calm version.",
-        "style": "steady, concise, and reassuring",
-    },
-    "Technical mentor": {
-        "prefix": "Here is the technical mentor version.",
-        "style": "precise, capable, and lightly explanatory",
-    },
-    "Operator mode": {
-        "prefix": "Here is the operator mode version.",
-        "style": "brief, action-oriented, and status-aware",
-    },
-    "Warm companion": {
-        "prefix": "Here is the warm companion version.",
-        "style": "friendly, grounded, and conversational",
-    },
-    "Launch demo": {
-        "prefix": "Here is the launch demo version.",
-        "style": "polished, confident, and presentation-ready",
-    },
-}
-
-VOICE_CHOICES = [
-    "en-US-AriaNeural",
-    "en-US-JennyNeural",
-    "en-US-GuyNeural",
-    "en-US-DavisNeural",
-    "en-US-AvaNeural",
-    "en-GB-SoniaNeural",
-    "en-GB-RyanNeural",
-]
-
-
-def clean(text):
-    return re.sub(r"\s+", " ", (text or "").strip())
-
-
-def rewrite_for_persona(text, persona, brevity):
-    base = clean(text)
-    if not base:
-        raise gr.Error("Add text for ADI to speak first.")
-
-    style = PERSONAS[persona]["style"]
-    prefix = PERSONAS[persona]["prefix"]
-    sentences = re.split(r"(?<=[.!?])\s+", base)
-    sentences = [sentence for sentence in sentences if sentence]
-
-    if brevity == "short":
-        body = " ".join(sentences[:2])
-    elif brevity == "expanded":
-        body = base
-        body += f" The intended delivery is {style}, with enough detail to feel useful."
-    else:
-        body = base
-
-    if persona == "Operator mode":
-        body = f"Status: ready. {body} Next step: tell me what you want to run."
-    elif persona == "Technical mentor":
-        body = f"{body} The key idea is to make the next action obvious."
-    elif persona == "Warm companion":
-        body = f"{body} I can stay with you while we tune it."
-    elif persona == "Launch demo":
-        body = f"{body} This is ready to show as a live ADI capability."
-
-    return f"{prefix} {body}"
-
-
-async def synthesize_one(text, voice, rate, pitch):
-    output = Path(tempfile.NamedTemporaryFile(suffix=".mp3", delete=False).name)
-    communicate = edge_tts.Communicate(text, voice, rate=rate, pitch=pitch)
-    await communicate.save(str(output))
-    return str(output)
-
-
-def synthesize(text, persona, voice, rate, pitch, brevity):
-    script = rewrite_for_persona(text, persona, brevity)
-    audio_path = asyncio.run(synthesize_one(script, voice, rate, pitch))
-    return script, audio_path
-
-
-def compare(text, voice_a, persona_a, voice_b, persona_b, voice_c, persona_c, rate, pitch, brevity):
-    script_a, audio_a = synthesize(text, persona_a, voice_a, rate, pitch, brevity)
-    script_b, audio_b = synthesize(text, persona_b, voice_b, rate, pitch, brevity)
-    script_c, audio_c = synthesize(text, persona_c, voice_c, rate, pitch, brevity)
-
-    zip_path = Path(tempfile.NamedTemporaryFile(suffix=".zip", delete=False).name)
-    with zipfile.ZipFile(zip_path, "w", zipfile.ZIP_DEFLATED) as bundle:
-        for idx, (script, audio) in enumerate(((script_a, audio_a), (script_b, audio_b), (script_c, audio_c)), 1):
-            bundle.write(audio, f"adi_voice_take_{idx}.mp3")
-            bundle.writestr(f"adi_voice_take_{idx}.txt", script)
-
-    return script_a, audio_a, script_b, audio_b, script_c, audio_c, str(zip_path)
-
-
-with gr.Blocks(title="ADI Voice Persona Lab", fill_width=True) as demo:
-    gr.Markdown("# ADI Voice Persona Lab")
-    source = gr.Textbox(
-        label="Base ADI response",
-        lines=6,
-        value=(
-            "Hello, I am ADI. I can help inspect models, compare prompts, generate training data, "
-            "and turn your ideas into working demos on Hugging Face Spaces."
-        ),
-    )
-
-    with gr.Row():
-        rate = gr.Dropdown(
-            choices=["-20%", "-10%", "+0%", "+10%", "+20%"],
-            value="+0%",
-            label="Rate",
-        )
-        pitch = gr.Dropdown(
-            choices=["-10Hz", "+0Hz", "+10Hz", "+20Hz"],
-            value="+0Hz",
-            label="Pitch",
-        )
-        brevity = gr.Radio(
-            choices=["short", "normal", "expanded"],
-            value="normal",
-            label="Script length",
-        )
-
-    with gr.Row():
-        with gr.Column():
-            persona_a = gr.Dropdown(list(PERSONAS), value="ADI calm", label="Persona A")
-            voice_a = gr.Dropdown(VOICE_CHOICES, value="en-US-AriaNeural", label="Voice A")
-            script_a = gr.Textbox(label="Script A", lines=7)
-            audio_a = gr.Audio(label="Audio A", type="filepath")
-        with gr.Column():
-            persona_b = gr.Dropdown(list(PERSONAS), value="Technical mentor", label="Persona B")
-            voice_b = gr.Dropdown(VOICE_CHOICES, value="en-US-GuyNeural", label="Voice B")
-            script_b = gr.Textbox(label="Script B", lines=7)
-            audio_b = gr.Audio(label="Audio B", type="filepath")
-        with gr.Column():
-            persona_c = gr.Dropdown(list(PERSONAS), value="Launch demo", label="Persona C")
-            voice_c = gr.Dropdown(VOICE_CHOICES, value="en-US-AvaNeural", label="Voice C")
-            script_c = gr.Textbox(label="Script C", lines=7)
-            audio_c = gr.Audio(label="Audio C", type="filepath")
-
-    run = gr.Button("Generate Takes", variant="primary")
-    bundle = gr.File(label="Download all takes")
-
-    run.click(
-        compare,
-        inputs=[source, voice_a, persona_a, voice_b, persona_b, voice_c, persona_c, rate, pitch, brevity],
-        outputs=[script_a, audio_a, script_b, audio_b, script_c, audio_c, bundle],
-    )
-
-
-if __name__ == "__main__":
-    demo.launch()

index.html

@@ -0,0 +1,120 @@
+<!doctype html>
+<html lang="en">
+<head>
+  <meta charset="utf-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1" />
+  <title>ADI Voice Persona Lab</title>
+  <style>
+    :root { color-scheme: dark; --bg:#080b10; --panel:#151922; --line:#303745; --text:#f5f7fb; --muted:#aab2c0; --accent:#12b981; --orange:#f97316; }
+    * { box-sizing:border-box; }
+    body { margin:0; font:15px/1.45 system-ui, -apple-system, Segoe UI, sans-serif; background:var(--bg); color:var(--text); }
+    main { max-width:1180px; margin:0 auto; padding:28px 18px 40px; }
+    h1 { margin:0 0 18px; font-size:30px; }
+    textarea, select { width:100%; border:1px solid var(--line); border-radius:8px; background:#0d1118; color:var(--text); padding:12px; font:inherit; }
+    textarea { min-height:130px; resize:vertical; }
+    label { display:block; margin:0 0 8px; font-weight:800; }
+    .panel { background:var(--panel); border:1px solid var(--line); border-radius:8px; padding:16px; margin-bottom:16px; }
+    .grid { display:grid; grid-template-columns:repeat(3, minmax(240px, 1fr)); gap:14px; }
+    .row { display:grid; grid-template-columns:repeat(3, minmax(160px, 1fr)); gap:12px; }
+    button { min-height:42px; border:0; border-radius:8px; padding:0 16px; font-weight:900; cursor:pointer; color:#100701; background:var(--orange); }
+    .take { display:flex; flex-direction:column; gap:10px; }
+    .script { min-height:150px; color:#d8ffe9; }
+    .muted { color:var(--muted); }
+    @media (max-width:900px) { .grid, .row { grid-template-columns:1fr; } }
+  </style>
+</head>
+<body>
+<main>
+  <h1>ADI Voice Persona Lab</h1>
+  <section class="panel">
+    <label for="base">Base ADI response</label>
+    <textarea id="base">Hello, I am ADI. I can help inspect models, compare prompts, generate training data, and turn your ideas into working demos on Hugging Face Spaces.</textarea>
+    <div class="row" style="margin-top:14px">
+      <div><label for="length">Script length</label><select id="length"><option>short</option><option selected>normal</option><option>expanded</option></select></div>
+      <div><label for="rate">Rate</label><select id="rate"><option value="0.85">slower</option><option value="1" selected>normal</option><option value="1.15">faster</option></select></div>
+      <div><label>&nbsp;</label><button id="generate">Generate Takes</button></div>
+    </div>
+    <p class="muted">Uses your browser's built-in speech voices, so it does not consume Hugging Face CPU quota.</p>
+  </section>
+  <section class="grid">
+    <div class="panel take">
+      <label>Persona A</label><select class="persona"><option>ADI calm</option><option>Technical mentor</option><option>Operator mode</option><option>Warm companion</option><option>Launch demo</option></select>
+      <label>Voice A</label><select class="voice"></select>
+      <textarea class="script"></textarea>
+      <button class="speak">Speak A</button>
+    </div>
+    <div class="panel take">
+      <label>Persona B</label><select class="persona"><option>Technical mentor</option><option>ADI calm</option><option>Operator mode</option><option>Warm companion</option><option>Launch demo</option></select>
+      <label>Voice B</label><select class="voice"></select>
+      <textarea class="script"></textarea>
+      <button class="speak">Speak B</button>
+    </div>
+    <div class="panel take">
+      <label>Persona C</label><select class="persona"><option>Launch demo</option><option>ADI calm</option><option>Technical mentor</option><option>Operator mode</option><option>Warm companion</option></select>
+      <label>Voice C</label><select class="voice"></select>
+      <textarea class="script"></textarea>
+      <button class="speak">Speak C</button>
+    </div>
+  </section>
+</main>
+<script>
+const personaStyles = {
+  "ADI calm": ["Here is the calm version.", "steady, concise, and reassuring"],
+  "Technical mentor": ["Here is the technical mentor version.", "precise, capable, and lightly explanatory"],
+  "Operator mode": ["Status: ready.", "brief, action-oriented, and status-aware"],
+  "Warm companion": ["Here is the warm companion version.", "friendly, grounded, and conversational"],
+  "Launch demo": ["Here is the launch demo version.", "polished, confident, and presentation-ready"]
+};
+const clean = text => (text || "").trim().replace(/\s+/g, " ");
+function rewrite(text, persona, length) {
+  const [prefix, style] = personaStyles[persona];
+  let body = clean(text);
+  const sentences = body.split(/(?<=[.!?])\s+/).filter(Boolean);
+  if (length === "short") body = sentences.slice(0, 2).join(" ");
+  if (length === "expanded") body += ` The intended delivery is ${style}, with enough detail to feel useful.`;
+  if (persona === "Operator mode") body = `${prefix} ${body} Next step: tell me what you want to run.`;
+  else if (persona === "Technical mentor") body = `${prefix} ${body} The key idea is to make the next action obvious.`;
+  else if (persona === "Warm companion") body = `${prefix} ${body} I can stay with you while we tune it.`;
+  else if (persona === "Launch demo") body = `${prefix} ${body} This is ready to show as a live ADI capability.`;
+  else body = `${prefix} ${body}`;
+  return body;
+}
+function loadVoices() {
+  const voices = speechSynthesis.getVoices();
+  document.querySelectorAll(".voice").forEach((select, idx) => {
+    const chosen = select.value;
+    select.innerHTML = "";
+    voices.forEach((voice, i) => {
+      const option = document.createElement("option");
+      option.value = i;
+      option.textContent = `${voice.name} (${voice.lang})`;
+      select.appendChild(option);
+    });
+    if (chosen) select.value = chosen;
+    else select.selectedIndex = Math.min(idx, Math.max(voices.length - 1, 0));
+  });
+}
+function generate() {
+  const text = document.querySelector("#base").value;
+  const length = document.querySelector("#length").value;
+  document.querySelectorAll(".take").forEach(take => {
+    take.querySelector(".script").value = rewrite(text, take.querySelector(".persona").value, length);
+  });
+}
+function speak(take) {
+  speechSynthesis.cancel();
+  const utterance = new SpeechSynthesisUtterance(take.querySelector(".script").value);
+  const voices = speechSynthesis.getVoices();
+  const voice = voices[Number(take.querySelector(".voice").value)];
+  if (voice) utterance.voice = voice;
+  utterance.rate = Number(document.querySelector("#rate").value);
+  speechSynthesis.speak(utterance);
+}
+document.querySelector("#generate").addEventListener("click", generate);
+document.querySelectorAll(".speak").forEach(button => button.addEventListener("click", e => speak(e.target.closest(".take"))));
+speechSynthesis.onvoiceschanged = loadVoices;
+loadVoices();
+generate();
+</script>
+</body>
+</html>

requirements.txt

@@ -1,2 +0,0 @@
-gradio==6.19.0
-edge-tts==7.2.8