changes

app.py

@@ -39,45 +39,6 @@ def text2audio(text, negative_prompt, duration, guidance_scale, random_seed, n_c
 
 
 css = """
-        a {
-            color: inherit;
-            text-decoration: underline;
-        }
-        .gradio-container {
-            max-width: 730px !important;
-        }
-        .container {
-            margin: auto;
-            padding-top: 1.5rem;
-        }
-        #gallery>div>.h-full {
-            min-height: 20rem;
-        }
-        .details:hover {
-            text-decoration: underline;
-        }
-        #advanced-btn {
-            font-size: .7rem !important;
-            line-height: 19px;
-            margin-top: 12px;
-            margin-bottom: 12px;
-            padding: 2px 8px;
-            border-radius: 14px !important;
-        }
-        #advanced-options {
-            margin-bottom: 20px;
-        }
-        .acknowledgments h4{
-            margin: 1.25em 0 .25em 0;
-            font-weight: bold;
-            font-size: 115%;
-        }
-        #container-advanced-btns{
-            display: flex;
-            flex-wrap: wrap;
-            justify-content: space-between;
-            align-items: center;
-        }
 """
 iface = gr.Blocks(css=css)
 
@@ -101,15 +62,10 @@ with iface:
             </div>
         """
     )
-    gr.HTML(
-        """
-        <p>This is the demo for AudioLDM 2, powered by 🧨 Diffusers. Demo uses the checkpoint <a
+    gr.HTML("""This is the demo for AudioLDM 2, powered by 🧨 Diffusers. Demo uses the checkpoint <a
         href="https://huggingface.co/cvssp/audioldm2"> AudioLDM 2 base</a>. For faster inference without waiting in
-        queue, you may duplicate the space and upgrade to a GPU in the settings. <br/> <a
-        href="https://huggingface.co/spaces/haoheliu/audioldm2-text2audio-text2music?duplicate=true"> <img
-        style="margin-top: 0em; margin-bottom: 0em" src="https://bit.ly/3gLdBN6" alt="Duplicate Space"></a> <p/>
-    """
-    )
+        queue, you may duplicate the space and upgrade to a GPU in the settings.""")
+    gr.DuplicateButton()
 
     with gr.Group():
         textbox = gr.Textbox(
@@ -152,12 +108,12 @@ with iface:
             )
 
         outputs = gr.Video(label="Output", elem_id="output-video")
-        btn = gr.Button("Submit").style(full_width=True)
+        btn = gr.Button("Submit")
 
-    with gr.Group(elem_id="share-btn-container", visible=False):
-        community_icon = gr.HTML(community_icon_html)
-        loading_icon = gr.HTML(loading_icon_html)
-        share_button = gr.Button("Share to community", elem_id="share-btn")
+    with gr.Column(elem_id="share-btn-container"):
+        # community_icon = gr.HTML(community_icon_html)
+        # loading_icon = gr.HTML(loading_icon_html)
+        # share_button = gr.Button("Share to community", elem_id="share-btn")
 
         btn.click(
             text2audio,
@@ -165,31 +121,32 @@ with iface:
             outputs=[outputs],
         )
 
-        share_button.click(None, [], [], _js=share_js)
         gr.HTML(
             """
-        <div class="footer" style="text-align: center; max-width: 700px; margin: 0 auto;">
-                    <p>Follow the latest update of AudioLDM 2 on our<a href="https://audioldm.github.io/audioldm2"
-                    style="text-decoration: underline;" target="_blank"> Github repo</a> </p> <br> <p>Model by <a
-                    href="https://twitter.com/LiuHaohe" style="text-decoration: underline;" target="_blank">Haohe
-                    Liu</a>. Code and demo by 🤗 Hugging Face.</p> <br>
+        <div class="footer" style="text-align: center">
+            <p>Share your generations with the community by clicking the share icon at the top right the generated audio!</p>
+            <p>Follow the latest update of AudioLDM 2 on our<a href="https://audioldm.github.io/audioldm2"
+            style="text-decoration: underline;" target="_blank"> Github repo</a> </p> 
+            <p>Model by <a
+            href="https://twitter.com/LiuHaohe" style="text-decoration: underline;" target="_blank">Haohe
+            Liu</a>. Code and demo by 🤗 Hugging Face.</p>
         </div>
         """
         )
-        # gr.Examples(
-        #     [
-        #         ["A hammer is hitting a wooden surface.", "Low quality.", 10, 3.5, 45, 3],
-        #         ["A cat is meowing for attention.", "Low quality.", 10, 3.5, 45, 3],
-        #         ["An excited crowd cheering at a sports game.", "Low quality.", 10, 3.5, 45, 3],
-        #         ["Birds singing sweetly in a blooming garden.", "Low quality.", 10, 3.5, 45, 3],
-        #         ["A modern synthesizer creating futuristic soundscapes.", "Low quality.", 10, 3.5, 45, 3],
-        #         ["The vibrant beat of Brazilian samba drums.", "Low quality.", 10, 3.5, 45, 3],
-        #     ],
-        #     fn=text2audio,
-        #     inputs=[textbox, negative_textbox, duration, guidance_scale, seed, n_candidates],
-        #     outputs=[outputs],
-        #     # cache_examples=True,
-        # )
+        gr.Examples(
+            [
+                ["A hammer is hitting a wooden surface.", "Low quality.", 10, 3.5, 45, 3],
+                ["A cat is meowing for attention.", "Low quality.", 10, 3.5, 45, 3],
+                ["An excited crowd cheering at a sports game.", "Low quality.", 10, 3.5, 45, 3],
+                ["Birds singing sweetly in a blooming garden.", "Low quality.", 10, 3.5, 45, 3],
+                ["A modern synthesizer creating futuristic soundscapes.", "Low quality.", 10, 3.5, 45, 3],
+                ["The vibrant beat of Brazilian samba drums.", "Low quality.", 10, 3.5, 45, 3],
+            ],
+            fn=text2audio,
+            inputs=[textbox, negative_textbox, duration, guidance_scale, seed, n_candidates],
+            outputs=[outputs],
+            # cache_examples=True,
+        )
         gr.HTML(
             """
                 <div class="acknowledgements"> <p>Essential Tricks for Enhancing the Quality of Your Generated