Update app.py

app.py

@@ -110,76 +110,117 @@ function refresh() {
 }
 """
 
-with gr.Blocks(theme='NoCrypt/miku@>=1.2.2', fill_width=True, css=CSS) as demo:
-    gr.HTML("")
-    
+with gr.Blocks(fill_width=True, css=CSS) as demo:
+    gr.HTML("")  
     with gr.Tab('6 Models'):
         with gr.Column(scale=2):
             with gr.Group():
                 txt_input = gr.Textbox(label='Your prompt:', value=preSetPrompt, lines=3, autofocus=1)
                 neg_input = gr.Textbox(label='Negative prompt:', value=negPreSetPrompt, lines=1)
-                with gr.Accordion("Advanced", open=False):
-                    width = gr.Slider(label="Width", maximum=1216, step=32, value=0)
-                    height = gr.Slider(label="Height", maximum=1216, step=32, value=0)
-                    steps = gr.Slider(label="Number of inference steps", maximum=100, step=1, value=0)
-                    cfg = gr.Slider(label="Guidance scale", maximum=30.0, step=0.1, value=0)
-                    seed = gr.Slider(label="Seed", minimum=-1, maximum=MAX_SEED, step=1, value=-1)
-                    seed_rand = gr.Button("Randomize Seed 🎲", size="sm", variant="secondary")
-                    seed_rand.click(randomize_seed, None, [seed], queue=False)
-            gen_button = gr.Button(f'Generate up to {num_models} images', variant='primary', scale=3)
-            random_button = gr.Button('Randomize Models', variant='secondary', scale=1)
-            gr.Markdown("")
-
-        with gr.Row():
-            output = [gr.Image(label=m, show_download_button=True, elem_classes="output", interactive=False, width=112, height=112, format="png", visible=True) for m in default_models]
-            current_models = [gr.Textbox(m, visible=False) for m in default_models]
+                with gr.Accordion("Advanced", open=False, visible=True):
+                    with gr.Row():
+                        width = gr.Slider(label="Width", info="If 0, the default value is used.", maximum=1216, step=32, value=0)
+                        height = gr.Slider(label="Height", info="If 0, the default value is used.", maximum=1216, step=32, value=0)
+                    with gr.Row():
+                        steps = gr.Slider(label="Number of inference steps", info="If 0, the default value is used.", maximum=100, step=1, value=0)
+                        cfg = gr.Slider(label="Guidance scale", info="If 0, the default value is used.", maximum=30.0, step=0.1, value=0)
+                        seed = gr.Slider(label="Seed", info="Randomize Seed if -1.", minimum=-1, maximum=MAX_SEED, step=1, value=-1)
+                        seed_rand = gr.Button("Randomize Seed 🎲", size="sm", variant="secondary")
+                        seed_rand.click(randomize_seed, None, [seed], queue=False)
+            with gr.Row():
+                gen_button = gr.Button(f'Generate up to {int(num_models)} images', variant='primary', scale=3)
+                random_button = gr.Button(f'Randomize Models', variant='secondary', scale=1)
+
+            gr.Markdown("", elem_classes="guide")
+
+        with gr.Column(scale=1):
+            with gr.Group():
+                with gr.Row():
+                    output = [gr.Image(label=m, show_download_button=True, elem_classes="output",
+                              interactive=False, width=112, height=112, show_share_button=False, format="png",
+                              visible=True) for m in default_models]
+                    current_models = [gr.Textbox(m, visible=False) for m in default_models]
 
         with gr.Column(scale=2):
-            gallery = gr.Gallery(label="Output", show_download_button=True, elem_classes="gallery", interactive=False, format="png", preview=True, object_fit="cover", columns=2, rows=2)
+            gallery = gr.Gallery(label="Output", show_download_button=True, elem_classes="gallery",
+                                interactive=False, show_share_button=False, container=True, format="png",
+                                preview=True, object_fit="cover", columns=2, rows=2)
+
+        # Inside the `gr.Blocks` context where the components are defined:
+        for i, o in enumerate(output):
+            # Ensure event handler is inside `gr.Blocks`
+            num_images.change(
+                lambda num_images, i=i: gr.update(visible=(i < num_images)),  # `i` corresponds to the index of the image
+                [num_images],  # Only num_images needs to be an input
+                o,  # Outputs the updated visibility of the image `o`
+                queue=False
+            )
+
+            # Image generation function
+            gen_event2 = gr.on(
+                triggers=[gen_button.click, txt_input.submit],
+                fn=gen_fn,
+                inputs=[i, num_images, model_choice2, txt_input, neg_input, height, width, steps, cfg, seed],
+                outputs=[o]
+            )
+
+            # Update gallery when a new image is generated
+            o.change(add_gallery, [o, model_choice2, gallery], [gallery])
+
+        # Model selection and updating outputs
+        with gr.Column(scale=4):
+            with gr.Accordion('Model selection'):
+                model_choice = gr.CheckboxGroup(models, label=f'Choose up to {int(num_models)} different models from the {len(models)} available!', value=default_models, interactive=True)
+                model_choice.change(update_imgbox, model_choice, output)
+                model_choice.change(extend_choices, model_choice, current_models)
+                random_button.click(random_choices, None, model_choice)
+
+    # Single model section
+    with gr.Tab('Single model'):
+        with gr.Column(scale=2):
+            model_choice2 = gr.Dropdown(models, label='Choose model', value=models[0])
+            with gr.Group():
+                txt_input2 = gr.Textbox(label='Your prompt:', value=preSetPrompt, lines=3, autofocus=1)
+                neg_input2 = gr.Textbox(label='Negative prompt:', value=negPreSetPrompt, lines=1)
+                with gr.Accordion("Advanced", open=False, visible=True):
+                    with gr.Row():
+                        width2 = gr.Slider(label="Width", info="If 0, the default value is used.", maximum=1216, step=32, value=0)
+                        height2 = gr.Slider(label="Height", info="If 0, the default value is used.", maximum=1216, step=32, value=0)
+                    with gr.Row():
+                        steps2 = gr.Slider(label="Number of inference steps", info="If 0, the default value is used.", maximum=100, step=1, value=0)
+                        cfg2 = gr.Slider(label="Guidance scale", info="If 0, the default value is used.", maximum=30.0, step=0.1, value=0)
+                        seed2 = gr.Slider(label="Seed", info="Randomize Seed if -1.", minimum=-1, maximum=MAX_SEED, step=1, value=-1)
+                        seed_rand2 = gr.Button("Randomize Seed", size="sm", variant="secondary")
+                        seed_rand2.click(randomize_seed, None, [seed2], queue=False)
+
+            num_images2 = gr.Slider(1, max_images, value=max_images, step=1, label='Number of images')
+
+            with gr.Row():
+                gen_button2 = gr.Button('Let the machine hallucinate', variant='primary', scale=2)
+
+        with gr.Column(scale=1):
+            with gr.Group():
+                with gr.Row():
+                    output2 = [gr.Image(label='', show_download_button=True, elem_classes="output",
+                               interactive=False, width=112, height=112, visible=True, format="png",
+                               show_share_button=False, show_label=False) for _ in range(max_images)]
 
-        for m, o in zip(current_models, output):
-            gen_event = gr.on(triggers=[gen_button.click, txt_input.submit], fn=gen_fn,
-                              inputs=[m, txt_input, neg_input, height, width, steps, cfg, seed], outputs=[o])
-            o.change(add_gallery, [o, m, gallery], [gallery])
+        with gr.Column(scale=2):
+            gallery2 = gr.Gallery(label="Output", show_download_button=True, elem_classes="gallery",
+                                interactive=False, show_share_button=True, container=True, format="png",
+                                preview=True, object_fit="cover", columns=2, rows=2)
 
-        model_choice = gr.CheckboxGroup(models, label=f'Choose up to {num_models} models', value=default_models)
-        model_choice.change(update_imgbox, model_choice, output)
-        model_choice.change(extend_choices, model_choice, current_models)
-        random_button.click(random_choices, None, model_choice)
+        for i, o in enumerate(output2):
+            img_i = gr.Number(i, visible=False)
+            num_images2.change(lambda i, n: gr.update(visible=(i < n)), [img_i, num_images2], o, queue=False)
+            gen_event2 = gr.on(
+                triggers=[gen_button2.click, txt_input2.submit],
+                fn=gen_fn,
+                inputs=[img_i, num_images2, model_choice2, txt_input2, neg_input2, height2, width2, steps2, cfg2, seed2],
+                outputs=[o]
+            )
 
-    with gr.Tab('Single model'):
-        model_choice2 = gr.Dropdown(models, label='Choose model', value=models[0])
-        txt_input2 = gr.Textbox(label='Your prompt:', value=preSetPrompt, lines=3, autofocus=1)
-        neg_input2 = gr.Textbox(label='Negative prompt:', value=negPreSetPrompt, lines=1)
-        num_images = gr.Slider(1, max_images, value=max_images, step=1, label='Number of images')
-
-        gen_button2 = gr.Button('Let the machine hallucinate', variant='primary', scale=2)
-        
-        output2 = [gr.Image(label='', show_download_button=True, elem_classes="output", interactive=False, width=112, height=112, format="png", show_share_button=False) for _ in range(max_images)]
-        
-        with gr.Column(scale=2):
-            gallery2 = gr.Gallery(label="Output", show_download_button=True, elem_classes="gallery", interactive=False, show_share_button=True, format="png", preview=True, object_fit="cover", columns=2, rows=2)
-
-for i, o in enumerate(output2):
-    # Change visibility based on num_images
-    num_images.change(
-        lambda num_images, i=i: gr.update(visible=(i < num_images)),  # `i` corresponds to the index of the image
-        [num_images],  # Only num_images needs to be an input
-        o,  # Outputs the updated visibility of the image `o`
-        queue=False
-    )
-    
-    # Image generation function
-    gen_event2 = gr.on(
-        triggers=[gen_button2.click, txt_input2.submit],
-        fn=gen_fn,
-        inputs=[i, num_images, model_choice2, txt_input2, neg_input2, height, width, steps, cfg, seed],
-        outputs=[o]
-    )
-    
-    # Update gallery when a new image is generated
-    o.change(add_gallery, [o, model_choice2, gallery2], [gallery2])
+            o.change(add_gallery, [o, model_choice2, gallery2], [gallery2])
 
+    demo.launch(show_api=False, max_threads=400)
 
-    gr.Markdown("")
-demo.launch(show_api=False, max_threads=400)