Spaces:

ntdservices
/

text-to-speech

Sleeping

App Files Files Community

ntdservices commited on Aug 11, 2025

Commit

de447d7

verified ·

1 Parent(s): 0ef4d10

Upload 4 files

Browse files

Files changed (4) hide show

Dockerfile.txt +24 -0
app.py +77 -0
requirements.txt +3 -0
templates/index.html +224 -0

Dockerfile.txt ADDED Viewed

	@@ -0,0 +1,24 @@

+# Lightweight base image
+FROM python:3.10-slim
+# System setup
+ENV PYTHONDONTWRITEBYTECODE=1 \
+    PYTHONUNBUFFERED=1 \
+    PIP_NO_CACHE_DIR=1
+# Create app dir
+WORKDIR /app
+# Install Python deps early for better layer caching
+COPY requirements.txt /app/
+RUN pip install -r requirements.txt
+# Copy app source
+COPY . /app
+# Expose Flask port (matches app.py: 7860)
+EXPOSE 7860
+# Run with Gunicorn in production
+# -w: workers (tweak for your CPU); -k sync is fine here
+CMD ["gunicorn", "-w", "2", "-k", "gthread", "-t", "120", "-b", "0.0.0.0:7860", "app:app"]

app.py ADDED Viewed

	@@ -0,0 +1,77 @@

+import os
+import uuid
+import shutil
+from flask import Flask, request, jsonify, render_template
+from gradio_client import Client
+app = Flask(__name__)
+app.secret_key = os.urandom(24)
+# Where we’ll drop generated mp3s for the browser to fetch
+os.makedirs("static", exist_ok=True)
+# Point to your HF Space (leave as-is if this is already working for you)
+TTS_SPACE_URL = "https://altafo-free-tts-unlimted-words.hf.space/"
+client = Client(TTS_SPACE_URL)
+@app.route("/")
+def index():
+    # expects templates/index.html
+    return render_template("index.html")
+@app.route("/api/ping")
+def ping():
+    return "pong", 200
+@app.route("/tts", methods=["POST"])
+def tts():
+    """
+    JSON body:
+      { "text": "...", "voice": "en-US-AriaNeural - en-US (Female)", "rate": 0, "pitch": 0 }
+    Returns:
+      { "url": "/static/<uuid>.mp3" }
+    """
+    data = request.get_json(force=True) or {}
+    text_input = (data.get("text") or "").strip()
+    if not text_input:
+        return jsonify({"error": "No text provided"}), 400
+    voice = (data.get("voice") or "en-US-AriaNeural - en-US (Female)").strip()
+    try:
+        rate = int(data.get("rate", 0))
+    except Exception:
+        rate = 0
+    try:
+        pitch = int(data.get("pitch", 0))
+    except Exception:
+        pitch = 0
+    # Clamp to safe ranges
+    rate = max(-50, min(50, rate))
+    pitch = max(-20, min(20, pitch))
+    try:
+        # Call the Space
+        result = client.predict(
+            text_input,
+            voice,
+            rate,
+            pitch,
+            api_name="/tts_interface"
+        )
+        temp_path = result[0]
+        if not temp_path or not os.path.exists(temp_path):
+            return jsonify({"error": "TTS failed"}), 500
+        out_name = f"{uuid.uuid4().hex}.mp3"
+        out_path = os.path.join("static", out_name)
+        shutil.copy(temp_path, out_path)
+        return jsonify({"url": f"/static/{out_name}"})
+    except Exception as e:
+        return jsonify({"error": f"TTS request failed: {e}"}), 500
+if __name__ == "__main__":
+    print("🔊 TTS Flask server running on http://0.0.0.0:7860")
+    app.run(host="0.0.0.0", port=7860)

requirements.txt ADDED Viewed

	@@ -0,0 +1,3 @@

+flask==3.0.3
+gunicorn==21.2.0
+gradio_client==1.3.0

templates/index.html ADDED Viewed

	@@ -0,0 +1,224 @@

+<!DOCTYPE html>
+<html lang="en">
+<head>
+<meta name="viewport" content="width=device-width, initial-scale=1.0" />
+<meta charset="UTF-8" />
+<title>Anchor Dashboard — Text → Audio</title>
+<style>
+:root{
+  --bg:#0b1220;--bg-soft:#10192e;--card:#121b31;--card-2:#0f1730;
+  --text:#e6edf7;--muted:#9fb0cf;--accent:#3a8dde;--accent-2:#6ea8ff;
+  --ring:rgba(58,141,222,.35);--radius:16px;--shadow:0 10px 30px rgba(2,8,23,.35);
+}
+*{box-sizing:border-box}
+html,body{height:100%}
+body{
+  margin:0;font-family:ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Apple Color Emoji","Segoe UI Emoji";
+  color:var(--text);
+  background: radial-gradient(1200px 700px at 10% -10%, #1a2d55 0%, transparent 60%),
+              radial-gradient(1200px 800px at 110% 10%, #1b164e 0%, transparent 50%),
+              var(--bg);
+  padding:0 0 48px;
+}
+.app-header{position:sticky;top:0;z-index:5;backdrop-filter:blur(10px);
+  background:linear-gradient(180deg, rgba(16,25,46,.9), rgba(16,25,46,.6));
+  border-bottom:1px solid rgba(255,255,255,.06);padding:16px 24px;}
+.app-header h1{margin:0;font-size:18px;font-weight:600;letter-spacing:.3px;color:#dfe9ff}
+.container{max-width:1000px;margin:24px auto 0;padding:0 20px;display:grid;gap:16px}
+.card{background:linear-gradient(180deg,var(--card),var(--card-2));
+  border:1px solid rgba(255,255,255,.06);border-radius:var(--radius);box-shadow:var(--shadow)}
+.panel{padding:16px}
+.section-title{padding:14px 16px;margin:0;border-bottom:1px solid rgba(255,255,255,.06);
+  color:#dce7ff;font-weight:600;letter-spacing:.2px}
+button,.btn{
+  appearance:none;border:1px solid rgba(255,255,255,.08);
+  background:linear-gradient(180deg,#1b2645,#16213d);color:var(--text);
+  padding:10px 16px;border-radius:12px;cursor:pointer;
+  transition:transform .08s ease, box-shadow .2s ease, border-color .2s ease;
+  box-shadow:0 4px 12px rgba(0,0,0,.25);font-weight:600
+}
+button:hover{transform:translateY(-1px);border-color:var(--accent);box-shadow:0 8px 20px rgba(58,141,222,.25)}
+label{color:var(--muted);font-size:14px}
+select,input[type="file"],textarea{
+  background:#0f1730;color:var(--text);border:1px solid rgba(255,255,255,.08);
+  border-radius:12px;padding:10px 12px
+}
+select:focus,input[type="file"]:focus,textarea:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 4px var(--ring)}
+textarea{width:100%;min-height:220px;resize:vertical}
+.row{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
+.dropzone{border:2px dashed rgba(255,255,255,.15);border-radius:14px;padding:18px;text-align:center;color:var(--muted);
+  background:linear-gradient(180deg,#101a35,#0e1530);cursor:pointer}
+.dropzone.is-dragover{background:linear-gradient(180deg,#0f2a55,#142a5a);border-color:var(--accent);color:#e2ecff}
+.helper{font-size:.9em;color:#9fb0cf;margin:8px 0 0}
+#apiStatus{color:#9fb0cf;margin:10px 0}
+#downloadLink{display:none;margin-left:12px;text-decoration:none;color:white}
+#downloadLink:hover{text-decoration:underline}
+</style>
+</head>
+<body>
+<header class="app-header">
+  <h1>Anchor Dashboard — Text to Speech</h1>
+</header>
+<div class="container">
+  <section class="card panel">
+    <h3 class="section-title">Your Text</h3>
+    <div class="row" style="justify-content:space-between">
+      <div style="flex:1 1 100%">
+        <textarea id="textInput" placeholder="Paste or type text here…"></textarea>
+        <p class="helper">Tip: you can also drop a <b>.txt</b> file below and we’ll load it here.</p>
+      </div>
+    </div>
+    <div id="dropZone" class="dropzone" style="margin-top:12px">
+      Drop a .txt file here or click to choose
+      <div style="margin-top:6px;font-size:.95em;color:#e2ecff;display:none" id="dzFile"></div>
+    </div>
+    <input id="txtFile" type="file" accept=".txt,text/plain" style="display:none" />
+    <h3 class="section-title" style="margin-top:16px">AI Playback</h3>
+    <div class="row" style="margin-top:8px">
+      <label>
+        Voice:
+        <select id="voiceSelect">
+          <option>en-US-AvaNeural - en-US (Female)</option>
+          <option>en-US-AndrewNeural - en-US (Male)</option>
+          <option>en-US-EmmaNeural - en-US (Female)</option>
+          <option>en-US-BrianNeural - en-US (Male)</option>
+          <option>en-US-EmmaMultilingualNeural - en-US (Female)</option>
+          <option>en-US-EricNeural - en-US (Male)</option>
+          <option>en-US-GuyNeural - en-US (Male)</option>
+          <option>en-US-JennyNeural - en-US (Female)</option>
+          <option>en-US-MichelleNeural - en-US (Female)</option>
+          <option>en-US-RogerNeural - en-US (Male)</option>
+          <option>en-US-SteffanNeural - en-US (Male)</option>
+          <option>en-US-AnaNeural - en-US (Female)</option>
+          <option>en-US-AndrewMultilingualNeural - en-US (Male)</option>
+          <option>en-US-AriaNeural - en-US (Female)</option>
+          <option>en-US-AvaMultilingualNeural - en-US (Female)</option>
+          <option>en-US-BrianMultilingualNeural - en-US (Male)</option>
+          <option>en-US-ChristopherNeural - en-US (Male)</option>
+        </select>
+      </label>
+      <label>
+        Speech Rate (%):
+        <select id="rateSelect"></select>
+      </label>
+      <label>
+        Pitch (Hz):
+        <select id="pitchSelect"></select>
+      </label>
+      <button id="generateBtn">Generate Audio</button>
+      <a id="downloadLink" href="#" download="tts.mp3">Download audio</a>
+    </div>
+    <div id="apiStatus"></div>
+    <div id="audioPlayerContainer"></div>
+  </section>
+</div>
+<script>
+/* --------- rate & pitch options ---------- */
+(function initRatePitch(){
+  const rateSel  = document.getElementById("rateSelect");
+  const pitchSel = document.getElementById("pitchSelect");
+  for (let v = -50; v <= 50; v += 1){
+    const opt = document.createElement("option");
+    opt.value = String(v);
+    opt.textContent = v > 0 ? `+${v}` : String(v);
+    if (v === 0) opt.selected = true;
+    rateSel.appendChild(opt);
+  }
+  for (let v = -20; v <= 20; v += 1){
+    const opt = document.createElement("option");
+    opt.value = String(v);
+    opt.textContent = v > 0 ? `+${v}` : String(v);
+    if (v === 0) opt.selected = true;
+    pitchSel.appendChild(opt);
+  }
+})();
+/* --------- TTS trigger ---------- */
+async function runTTS(){
+  const textEl   = document.getElementById("textInput");
+  const status   = document.getElementById("apiStatus");
+  const player   = document.getElementById("audioPlayerContainer");
+  const dl       = document.getElementById("downloadLink");
+  const text     = (textEl.value || "").trim();
+  const voice    = document.getElementById("voiceSelect").value;
+  const rate     = parseInt(document.getElementById("rateSelect").value || "0", 10);
+  const pitch    = parseInt(document.getElementById("pitchSelect").value || "0", 10);
+  if (!text){
+    alert("Please enter or load some text first.");
+    return;
+  }
+  status.textContent = "Generating audio…";
+  player.innerHTML = "";
+  dl.style.display = "none";
+  try{
+    const res  = await fetch("/tts", {
+      method:"POST",
+      headers: {"Content-Type":"application/json"},
+      body: JSON.stringify({ text, voice, rate, pitch })
+    });
+    const data = await res.json();
+    if (!res.ok){
+      throw new Error(data?.error || "TTS failed");
+    }
+    const url = data.url;
+    player.innerHTML = `<audio controls style="width:100%"><source src="${url}" type="audio/mpeg"></audio>`;
+    dl.href = url;
+    dl.style.display = "inline-block";
+    status.textContent = "Done.";
+  }catch(err){
+    console.error(err);
+    status.textContent = "";
+    alert("TTS failed: " + err.message);
+  }
+}
+document.getElementById("generateBtn").addEventListener("click", runTTS);
+/* --------- Dropzone for .txt ---------- */
+const dz = document.getElementById("dropZone");
+const dzFile = document.getElementById("dzFile");
+const fileInput = document.getElementById("txtFile");
+["dragenter","dragover","dragleave","drop"].forEach(evt =>
+  document.addEventListener(evt, e => { e.preventDefault(); e.stopPropagation(); })
+);
+["dragenter","dragover"].forEach(evt =>
+  dz.addEventListener(evt, () => dz.classList.add("is-dragover"))
+);
+["dragleave","drop"].forEach(evt =>
+  dz.addEventListener(evt, () => dz.classList.remove("is-dragover"))
+);
+dz.addEventListener("click", () => fileInput.click());
+function loadTxtFile(file){
+  if (!file) return;
+  const ok = file.type === "text/plain" || file.name.toLowerCase().endsWith(".txt");
+  if (!ok){ alert("Please choose a .txt file."); return; }
+  const reader = new FileReader();
+  reader.onload = () => {
+    document.getElementById("textInput").value = reader.result || "";
+    dzFile.style.display = "block";
+    dzFile.textContent = file.name + " — loaded.";
+  };
+  reader.readAsText(file);
+}
+dz.addEventListener("drop", e => loadTxtFile(e.dataTransfer?.files?.[0]));
+fileInput.addEventListener("change", e => loadTxtFile(e.target.files?.[0]));
+</script>
+</body>
+</html>