Artrajz commited on
Commit
881cc0a
1 Parent(s): 92fbafd

Upload 2 files

Browse files
Files changed (2) hide show
  1. app.py +4 -1
  2. templates/index.html +106 -52
app.py CHANGED
@@ -52,7 +52,10 @@ def require_api_key(func):
52
 
53
  @app.route('/', methods=["GET", "POST"])
54
  def index():
55
- return render_template("index.html")
 
 
 
56
 
57
 
58
  @app.route('/voice/speakers', methods=["GET", "POST"])
 
52
 
53
  @app.route('/', methods=["GET", "POST"])
54
  def index():
55
+ kwargs = {
56
+ "speakers": tts.voice_speakers
57
+ }
58
+ return render_template("index.html", **kwargs)
59
 
60
 
61
  @app.route('/voice/speakers', methods=["GET", "POST"])
templates/index.html CHANGED
@@ -4,12 +4,8 @@
4
  <meta charset="UTF-8" />
5
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
6
  <title>vits-simple-api</title>
7
- <link
8
- href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/css/bootstrap.min.css"
9
- rel="stylesheet"
10
- integrity="sha384-GLhlTQ8iRABdZLl6O3oVMWSktQOp6b7In1Zl3/Jr59b6EGGoI1aFkw7cmDA6j6gD"
11
- crossorigin="anonymous"
12
- />
13
  </head>
14
  <body>
15
  <main style="margin: 0 auto; width: 1024px">
@@ -17,42 +13,97 @@
17
  <a href="https://github.com/Artrajz/vits-simple-api" target="_blank" style="text-decoration: none; color: black"> vits-simple-api </a>
18
  </h1>
19
 
20
- <p>
21
- 文档:
22
  <a href="https://github.com/Artrajz/vits-simple-api" target="_blank" style="text-decoration: none; color: black"> https://github.com/Artrajz/vits-simple-api </a>
23
- </p>
24
- <p>
25
- 返回speakers(json)
26
- <a href="https://artrajz-vits-simple-api.hf.space/voice/speakers" style="text-decoration: none; color: black">
27
  https://artrajz-vits-simple-api.hf.space/voice/speakers
28
  </a>
29
- </p>
30
- <p>
31
- 简单调用api
32
  <a id="dynamicLink" href="https://artrajz-vits-simple-api.hf.space/voice/vits?text=你好,こんにちは&id=164" style="text-decoration: none; color: black">
33
  https://artrajz-vits-simple-api.hf.space/voice/vits?text=你好,こんにちは&id=164
34
  </a>
35
- </p>
36
 
37
- <div style="display: flex; justify-content: center; align-items: center">
38
- <label style="margin: 0 5px">text</label>
39
- <input type="text" id="inputText" oninput="updateLink()" value="你好,こんにちは" style="width: 300px" />
40
- <label style="margin: 0 5px">id</label>
41
- <input type="text" id="inputId" oninput="updateLink()" value="164" style="width: 100px" />
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
42
  </div>
43
- <!-- <div>format<input type="text" id="inputFormat" oninput="updateLink()" value="" /></div>
44
- <div>lang<input type="text" id="inputLang" oninput="updateLink()" value="" /></div>
45
- <div>length<input type="text" id="inputLength" oninput="updateLink()" value="" /></div>
46
- <div>noise<input type="text" id="inputNoise" oninput="updateLink()" value="" /></div>
47
- <div>noisew<input type="text" id="inputNoisew" oninput="updateLink()" value="" /></div>
48
- <div>max<input type="text" id="inputMax" oninput="updateLink()" value="" /></div> -->
49
- <div style="display: flex; justify-content: center; align-items: center; height: 80px; margin-top: 20px; margin-bottom: 20px; border: 1px solid rgb(229 231 235)">
50
  <button type="button" class="btn btn-outline-secondary" id="getAudio" style="margin-right: 10px">播放器生成</button>
51
  <audio id="audioPlayer" controls>
52
  <source src="" type="audio/mp3" />
53
  Your browser does not support the audio element.
54
  </audio>
55
  </div>
 
 
56
 
57
  <h2>所有模型均为网络搜集,感谢模型原作者的付出!</h2>
58
  <p>
@@ -93,36 +144,39 @@
93
  </p>
94
  </main>
95
 
 
 
 
96
  <script>
97
  function getLink() {
98
  var text = document.getElementById("inputText").value;
99
  var id = document.getElementById("inputId").value;
100
- // var format = document.getElementById("inputFormat").value;
101
- // var lang = document.getElementById("inputLang").value;
102
- // var length = document.getElementById("inputLength").value;
103
- // var noise = document.getElementById("inputNoise").value;
104
- // var noisew = document.getElementById("inputNoisew").value;
105
- // var max = document.getElementById("inputMax").value;
106
 
107
  var url = "https://artrajz-vits-simple-api.hf.space/voice/vits?text=" + text + "&id=" + id;
108
- // if (format != "") {
109
- // url += "&format=" + format;
110
- // }
111
- // if (lang != "") {
112
- // url += "&lang=" + lang;
113
- // }
114
- // if (length != "") {
115
- // url += "&length=" + length;
116
- // }
117
- // if (noise != "") {
118
- // url += "&noise=" + noise;
119
- // }
120
- // if (noisew != "") {
121
- // url += "&noisew=" + noisew;
122
- // }
123
- // if (max != "") {
124
- // url += "&max=" + max;
125
- // }
126
  return url;
127
  }
128
 
 
4
  <meta charset="UTF-8" />
5
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
6
  <title>vits-simple-api</title>
7
+
8
+ <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.6.2/dist/css/bootstrap.min.css" />
 
 
 
 
9
  </head>
10
  <body>
11
  <main style="margin: 0 auto; width: 1024px">
 
13
  <a href="https://github.com/Artrajz/vits-simple-api" target="_blank" style="text-decoration: none; color: black"> vits-simple-api </a>
14
  </h1>
15
 
16
+ <div>
17
+ <label>文档:</label>
18
  <a href="https://github.com/Artrajz/vits-simple-api" target="_blank" style="text-decoration: none; color: black"> https://github.com/Artrajz/vits-simple-api </a>
19
+ </div>
20
+ <div>
21
+ <label>返回speakers(json):</label>
22
+ <a href="https://artrajz-vits-simple-api.hf.space/voice/speakers" target="_blank" style="text-decoration: none; color: black">
23
  https://artrajz-vits-simple-api.hf.space/voice/speakers
24
  </a>
25
+ </div>
26
+ <div>
27
+ <label>简单调用api:</label>
28
  <a id="dynamicLink" href="https://artrajz-vits-simple-api.hf.space/voice/vits?text=你好,こんにちは&id=164" style="text-decoration: none; color: black">
29
  https://artrajz-vits-simple-api.hf.space/voice/vits?text=你好,こんにちは&id=164
30
  </a>
31
+ </div>
32
 
33
+ <!-- <div style="display: flex; justify-content: center; align-items: center"> -->
34
+ <div>
35
+ <form>
36
+ <div class="form-group">
37
+ <label>text</label>
38
+ <textarea class="form-control" id="inputText" rows="3" oninput="updateLink()">你好,こんにちは</textarea>
39
+ </div>
40
+ <div class="form-group">
41
+ <label>id</label>
42
+
43
+ <select class="form-control" id="inputId" oninput="updateLink()">
44
+ <option value="164"></option>
45
+ {% for speaker in speakers["VITS"] %}
46
+ {% if speaker["id"] == 164 %}
47
+ <option value="{{speaker["id"]}}" selected>{{speaker["id"]}} | {{speaker["name"]}} | {{speaker["lang"]}}</option>
48
+ {% else %}
49
+ <option value="{{speaker["id"]}}">{{speaker["id"]}} | {{speaker["name"]}} | {{speaker["lang"]}}</option>
50
+ {% endif %}
51
+ {% endfor %}
52
+ </select>
53
+ </div>
54
+ </form>
55
+ </div>
56
+ <p>
57
+ <button class="btn btn-primary" type="button" data-toggle="collapse" data-target="#collapseExample" aria-expanded="false" aria-controls="collapseExample">
58
+ Advanced
59
+ </button>
60
+ </p>
61
+ <div class="collapse" id="collapseExample">
62
+ <div class="card card-body">
63
+ <form>
64
+ <div class="form-group">
65
+ <label>format</label>
66
+ <select class="form-control" id="inputFormat" oninput="updateLink()">
67
+ <option></option>
68
+ <option>wav</option>
69
+ <option>mp3</option>
70
+ <option>ogg</option>
71
+ <option>silk</option>
72
+ </select>
73
+ </div>
74
+ <div class="form-group">
75
+ <label>lang</label>
76
+ <input type="text" class="form-control" id="inputLang" oninput="updateLink()" value="" placeholder="auto" />
77
+ </div>
78
+ <div class="form-group">
79
+ <label>length</label>
80
+ <input type="text" class="form-control" id="inputLength" oninput="updateLink()" value="" placeholder="1" />
81
+ </div>
82
+ <div class="form-group">
83
+ <label>noise</label>
84
+ <input type="text" class="form-control" id="inputNoise" oninput="updateLink()" value="" placeholder="0.33" />
85
+ </div>
86
+ <div class="form-group">
87
+ <label>noisew</label>
88
+ <input type="text" class="form-control" id="inputNoisew" oninput="updateLink()" value="" placeholder="0.4" />
89
+ </div>
90
+ <div class="form-group">
91
+ <label>max</label>
92
+ <input type="text" class="form-control" id="inputMax" oninput="updateLink()" value="" placeholder="50" />
93
+ </div>
94
+ </form>
95
+ </div>
96
  </div>
97
+
98
+ <div style="display: flex; justify-content: center; align-items: center; height: 80px; margin-top: 20px; margin-bottom: 20px; border: 1px solid rgba(0,0,0,.125); border-radius: 0.25rem;">
 
 
 
 
 
99
  <button type="button" class="btn btn-outline-secondary" id="getAudio" style="margin-right: 10px">播放器生成</button>
100
  <audio id="audioPlayer" controls>
101
  <source src="" type="audio/mp3" />
102
  Your browser does not support the audio element.
103
  </audio>
104
  </div>
105
+ <div>自动识别语言:可识别的语言根据不同speaker而不同,方言无法自动识别</div>
106
+ <br />
107
 
108
  <h2>所有模型均为网络搜集,感谢模型原作者的付出!</h2>
109
  <p>
 
144
  </p>
145
  </main>
146
 
147
+ <script src="https://cdn.jsdelivr.net/npm/jquery@3.5.1/dist/jquery.slim.min.js"></script>
148
+ <script src="https://cdn.jsdelivr.net/npm/bootstrap@4.6.2/dist/js/bootstrap.bundle.min.js"></script>
149
+
150
  <script>
151
  function getLink() {
152
  var text = document.getElementById("inputText").value;
153
  var id = document.getElementById("inputId").value;
154
+ var format = document.getElementById("inputFormat").value;
155
+ var lang = document.getElementById("inputLang").value;
156
+ var length = document.getElementById("inputLength").value;
157
+ var noise = document.getElementById("inputNoise").value;
158
+ var noisew = document.getElementById("inputNoisew").value;
159
+ var max = document.getElementById("inputMax").value;
160
 
161
  var url = "https://artrajz-vits-simple-api.hf.space/voice/vits?text=" + text + "&id=" + id;
162
+ if (format != "") {
163
+ url += "&format=" + format;
164
+ }
165
+ if (lang != "") {
166
+ url += "&lang=" + lang;
167
+ }
168
+ if (length != "") {
169
+ url += "&length=" + length;
170
+ }
171
+ if (noise != "") {
172
+ url += "&noise=" + noise;
173
+ }
174
+ if (noisew != "") {
175
+ url += "&noisew=" + noisew;
176
+ }
177
+ if (max != "") {
178
+ url += "&max=" + max;
179
+ }
180
  return url;
181
  }
182