intellisr/Intellisr_Sinhala_TTS_Piper
Sinhala TTS — browser demo (Piper)
Static HTML + JavaScript demo that runs Piper in the browser with ONNX Runtime Web and espeak-ng (WASM). The page offers an Intellisr Hugging Face model dropdown (add <option value="org/repo">…</option> in index.html as you ship more voices). After you choose a model, a loading overlay runs while the app fetches model.onnx.json, downloads model.onnx, and initializes espeak / ONNX in the browser; Speak stays off until that finishes. If only one non-placeholder model exists in the list, it is auto-selected on first load so the voice still downloads without an extra click.
Hugging Face Space (step by step)
This app is a static site: index.html at the repo root, ES modules, and resources/ (WASM + ~24 MB espeakng.worker.data). The YAML at the top of this file tells Spaces to use `sdk: static` and `app_file: index.html`.
1. Create the Space on Hugging Face
- Log in at huggingface.co.
- Click your avatar → New Space (or huggingface.co/new-space).
- Choose an owner, Space name, and visibility (Public is typical for demos).
- Under Space SDK, pick Static (or “Blank” / static HTML, depending on the UI).
- Create the Space. You will get an empty repo and a URL like
https://huggingface.co/spaces/<you>/<space-name>.
2. Put these files in the Space repo
At the root of the Space (same level as README.md), you need at least:
The voice does not have to live in the Space repo: the browser downloads `model.onnx` and `model.onnx.json` from the Hub model you select (e.g. intellisr/sinhala-tts-piper-v1).
3. Large files and Git LFS
espeakng.worker.data is large. If git push fails or Hub warns about file size, track it with [Git LFS](https://git-lfs.com/) before pushing:
git lfs install
git lfs track "resources/espeakng.worker.data"
git add .gitattributes resources/espeakng.worker.data
# … add the rest of the files, commit, push4. Push from your machine
If the Space was created empty:
git clone https://huggingface.co/spaces/<YOUR_USERNAME>/<SPACE_NAME>
cd <SPACE_NAME>
# Copy in index.html, app.js, nts.js, README.md, resources/, etc.
git add .
git commit -m "Add static Sinhala TTS Piper demo"
git pushUse a personal access token as the password when Git asks (Settings → Access Tokens → read/write for repos).
5. After deploy
Open `https://huggingface.co/spaces/<you>/<space-name>`. Wait for the Space to build (static Spaces are quick). Pick a model in the dropdown and wait for the loading overlay; then use Speak.
Official reference: Static HTML Spaces.
Gatsby + CloudFront Pages
- Copy the entire web bundle into your site’s static directory, preserving paths, for example:
static/sinhala-tts/index.htmlstatic/sinhala-tts/app.jsstatic/sinhala-tts/nts.jsstatic/sinhala-tts/resources/(all files under it, includingespeakng.worker.dataand.wasm)
- Open `/sinhala-tts/` (or whatever folder name you used).
- Optional: before
app.jsruns, set a default Hub repo only when the dropdown has no valid selection (placeholder still selected):
<script>
window.__SINHALA_TTS_HUB_REPO__ = "intellisr/sinhala-tts-piper-v1";
</script>Choosing a model in the dropdown always wins over this global.
Local files
You can still load model.onnx (and model.onnx.json if needed) from disk using the file inputs.
License
The upstream Piper / espeak-ng WASM stack is GPL-3.0. The voice bundle intellisr/sinhala-tts-piper-v1 is also distributed under GPL-3.0; see the model card.
