update sdk

README.md

@@ -4,7 +4,7 @@ emoji: 😊🎙️
 colorFrom: red
 colorTo: pink
 sdk: gradio
-sdk_version: 3.3.1
+sdk_version: 3.4
 app_file: app.py
 pinned: false
 license: mit

app.py

@@ -198,14 +198,11 @@ if __name__ == '__main__':
                                             f"![cover](file/{cover_path})\n\n"
                                             f"lang: {lang}")
                                 tts_input1 = gr.TextArea(label="Text (60 words limitation)", value=example,
-                                                         elem_id="tts-input")
+                                                         elem_id=f"tts-input{i}")
                                 tts_input2 = gr.Dropdown(label="Speaker", choices=speakers,
                                                          type="index", value=speakers[0])
                                 tts_input3 = gr.Slider(label="Speed", value=1, minimum=0.5, maximum=2, step=0.1)
-                                advanced_button = gr.Button("Advanced options", elem_id="advanced-btn")
-                                advanced_options = gr.Column()
-                                advanced_options.elem_id = "advanced-options"
-                                with advanced_options:
+                                with gr.Accordion(label="Advanced Options", open=False):
                                     phoneme_input = gr.Checkbox(value=False, label="Phoneme input")
                                     to_phoneme_btn = gr.Button("Covert text to phoneme")
                                     phoneme_list = gr.Dataset(label="Phoneme list", components=[tts_input1],
@@ -214,24 +211,16 @@ if __name__ == '__main__':
                                 tts_submit = gr.Button("Generate", variant="primary")
                                 tts_output1 = gr.Textbox(label="Output Message")
                                 tts_output2 = gr.Audio(label="Output Audio")
-                                advanced_button.click(None, [], [], _js="""
-                                () => {
-                                    let options = document.querySelector("body > gradio-app");
-                                    if (options.shadowRoot != null)
-                                        options = options.shadowRoot;
-                                    options = options.querySelector("#advanced-options");
-                                    options.style.display = ["none", ""].includes(options.style.display) ? "flex" : "none";
-                                }""")
                                 tts_submit.click(tts_fn, [tts_input1, tts_input2, tts_input3, phoneme_input],
                                                  [tts_output1, tts_output2])
                                 to_phoneme_btn.click(to_phoneme_fn, [tts_input1], [tts_input1])
                                 phoneme_list.click(None, [phoneme_list, phoneme_list_json], [],
-                                                   _js="""
-                                (i,phonemes) => {
+                                                   _js=f"""
+                                (i,phonemes) => {{
                                     let text_input = document.querySelector("body > gradio-app");
                                     if (text_input.shadowRoot != null)
                                         text_input = text_input.shadowRoot;
-                                    text_input = text_input.querySelector("#tts-input").querySelector("textarea");
+                                    text_input = text_input.querySelector("#tts-input{i}").querySelector("textarea");
                                     let startPos = text_input.selectionStart;
                                     let endPos = text_input.selectionEnd;
                                     let oldTxt = text_input.value;
@@ -241,7 +230,7 @@ if __name__ == '__main__':
                                     text_input.selectionStart = startPos + phonemes[i].length;
                                     text_input.selectionEnd = startPos + phonemes[i].length;
                                     text_input.blur()
-                                }""")
+                                }}""")
 
             with gr.TabItem("Voice Conversion"):
                 with gr.Tabs():