Hugging Face's logo

Spaces:
Akjava
/
matcha-tts-onnx-benchmarks
Running

App Files Community
Akjava commited on
Commit
3eeee98
•
1 Parent(s): db61e17

Update index.html

Browse files
Files changed (1) hide show
  1. index.html +123 -17
index.html CHANGED
@@ -1,19 +1,125 @@
1
  <!doctype html>
2
- <html>
3
- <head>
4
- <meta charset="utf-8" />
5
- <meta name="viewport" content="width=device-width" />
6
- <title>My static Space</title>
7
- <link rel="stylesheet" href="style.css" />
8
- </head>
9
- <body>
10
- <div class="card">
11
- <h1>Welcome to your static Space!</h1>
12
- <p>You can modify this app directly by editing <i>index.html</i> in the Files and versions tab.</p>
13
- <p>
14
- Also don't forget to check the
15
- <a href="https://huggingface.co/docs/hub/spaces" target="_blank">Spaces documentation</a>.
16
- </p>
17
- </div>
18
- </body>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
19
  </html>
 
1
  <!doctype html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta name="viewport" content="width=device-width" />
5
+ <link rel="stylesheet" href="style.css" />
6
+ <meta charset="UTF-8">
7
+ <title>Match-TTS Onnx En001-English</title>
8
+ </head>
9
+ <body>
10
+ <h1>Match-TTS Onnx En001-English(Faster GPU Version)</h1>
11
+ <div>this example using Quantized version(lowquality and slow) because of Github Page 100MB limitation</div>
12
+ <p><a href = "https://huggingface.co/Akjava/matcha_tts_common_voice_01_en_001">common_voice_01_en_001</a> - my trained model.you can create too!</p>
13
+ <br>
14
+ <script src="https://cdn.jsdelivr.net/npm/onnxruntime-web/dist/ort.webgpu.min.js" ></script>
15
+
16
+
17
+ <script type="module">
18
+ import { MatchaTTSRaw } from "./js-esm/matcha_tts_raw.js";
19
+ import { webWavPlay } from "./js-esm/web_wav_play.js";
20
+ import { arpa_to_ipa } from "./js-esm/arpa_to_ipa.js";
21
+ import { loadCmudict } from "./js-esm/cmudict_loader.js";
22
+ import { env,textToArpa} from "./js-esm/text_to_arpa.js";
23
+
24
+ env.allowLocalModels = true;
25
+ env.localModelPath = "./models/";
26
+ env.backends.onnx.logLevel = "fatal";
27
+
28
+ let matcha_tts_raw
29
+ let cmudict ={}
30
+ let speaking = false
31
+ async function main() {
32
+ if (speaking){
33
+ console.log("speaking return")
34
+ }
35
+ speaking = true
36
+ console.log("main called")
37
+ if(!matcha_tts_raw){
38
+ matcha_tts_raw = new MatchaTTSRaw()
39
+ console.time("load model");
40
+ await matcha_tts_raw.load_model('./models/matcha-tts/en001_ep6399_univ_simplify_q8.onnx',{ executionProviders: ['webgpu','wasm'] });
41
+
42
+ console.timeEnd("load model");
43
+
44
+ let cmudictReady = loadCmudict(cmudict,'./dictionaries/cmudict-0.7b')
45
+ await cmudictReady
46
+
47
+ }else{
48
+ console.log("session exist skip load model")
49
+ }
50
+ const text = document.getElementById('textInput').value
51
+ const arpa_text = await textToArpa(cmudict,text)
52
+ const ipa_text = arpa_to_ipa(arpa_text).replace(/\s/g, "");
53
+ console.log(ipa_text)
54
+
55
+ const spks = 0
56
+ const speed = document.getElementById('speed').value
57
+ const tempature = document.getElementById('temperature').value
58
+
59
+ console.time("infer");
60
+ const result = await matcha_tts_raw.infer(ipa_text, tempature, speed,spks);
61
+ console.timeEnd("infer");
62
+ if (result!=null){
63
+ webWavPlay(result)
64
+
65
+ }
66
+
67
+ speaking = false
68
+ }
69
+ function update_range(){
70
+ const value = document.getElementById('spks').value
71
+ let formattedNumber = value.toString().padStart(3, '0');
72
+ document.getElementById('spks_label').textContent = formattedNumber
73
+ }
74
+ function update_range2(){
75
+ const value = document.getElementById('temperature').value
76
+ //let formattedNumber = value.toString().padStart(3, '0');
77
+ document.getElementById('tempature_label').textContent = value//formattedNumber
78
+ }
79
+ function update_range3(){
80
+ const value = document.getElementById('speed').value
81
+ //let formattedNumber = value.toString().padStart(3, '0');
82
+ document.getElementById('speed_label').textContent = value//sformattedNumber
83
+ }
84
+
85
+ window.onload = async function(){
86
+ document.getElementById('textInput').onchange = main;
87
+ document.getElementById('myButton').onclick = main;
88
+
89
+ document.getElementById('temperature').onchange = update_range2
90
+ document.getElementById('speed').onchange = update_range3
91
+ }
92
+
93
+
94
+ </script>
95
+
96
+ <input type="text" id="textInput" value ="Hello." placeholder="Enter some text here...">
97
+
98
+ <button id="myButton">Text To Speak</button><br>
99
+
100
+
101
+ <label for ="temperature" style="width: 110px;display: inline-block;">Temperature</label>
102
+ <input type="range" id="temperature" min="0" max="1.0" value="0.5" step="0.1"/>
103
+ <label for ="temperature" id="tempature_label">0.5</label><br>
104
+
105
+ <label for ="speed" style="width: 110px;display: inline-block;">Speed</label>
106
+ <input type="range" id="speed" min="0.1" max="2.0" value="1.0" step="0.1"/>
107
+ <label for ="speed" id="speed_label">1.0</label>
108
+ <br>
109
+ <br>
110
+ <div id="footer">
111
+ <b>Credits</b><br>
112
+ <a href="https://github.com/akjava/Matcha-TTS-Japanese" style="font-size: 9px" target="link">Matcha-TTS-Japanese</a> |
113
+ <a href = "http://www.udialogue.org/download/cstr-vctk-corpus.html" style="font-size: 9px" target="link">CSTR VCTK Corpus</a> |
114
+ <a href = "https://github.com/cmusphinx/cmudict" style="font-size: 9px" target="link">CMUDict</a> |
115
+ <a href = "https://huggingface.co/docs/transformers.js/index" style="font-size: 9px" target="link">Transformer.js</a> |
116
+ <a href = "https://huggingface.co/cisco-ai/mini-bart-g2p" style="font-size: 9px" target="link">mini-bart-g2p</a> |
117
+ <a href = "https://onnxruntime.ai/docs/get-started/with-javascript/web.html" style="font-size: 9px" target="link">ONNXRuntime-Web</a> |
118
+ <a href = "https://github.com/akjava/English-To-IPA-Collections" style="font-size: 9px" target="link">English-To-IPA-Collections</a> |
119
+ <a href ="https://huggingface.co/papers/2309.03199" style="font-size: 9px" target="link">Matcha-TTS Paper</a>
120
+ </div>
121
+
122
+
123
+
124
+ </body>
125
  </html>