Update app.py

app.py

@@ -306,24 +306,21 @@ css = '''
 #title{text-align: center}
 #title h1{font-size: 3em; display:inline-flex; align-items:center}
 #title img{width: 100px; margin-right: 0.5em}
-#gallery .grid-wrap{height: 10vh}
 #lora_list{background: var(--block-background-fill);padding: 0 1em .3em; font-size: 90%}
 .card_internal{display: flex;height: 100px;margin-top: .5em}
 .card_internal img{margin-right: 1em}
 .styler{--form-gap-width: 0px !important}
 #progress{height:30px}
-#progress .generating{display:none}
 .progress-container {width: 100%;height: 30px;background-color: #f0f0f0;border-radius: 15px;overflow: hidden;margin-bottom: 20px}
 .progress-bar {height: 100%;background-color: #4f46e5;width: calc(var(--current) / var(--total) * 100%);transition: width 0.5s ease-in-out}
 '''
-font=[gr.themes.GoogleFont("Source Sans Pro"), "Arial", "sans-serif"]
-# Begin Gradio Blocks
+font = [gr.themes.GoogleFont("Source Sans Pro"), "Arial", "sans-serif"]
+
 with gr.Blocks(theme=gr.themes.Soft(font=font), css=css, delete_cache=(60, 60)) as app:
     title = gr.HTML(
         """<h1><img src="https://huggingface.co/spaces/kayte0342/test/resolve/main/DA4BE61E-A0BD-4254-A1B6-AD3C05D18A9C%20(1).png?download=true" alt="LoRA"> FLUX LoRA Kayte's Space</h1>""",
         elem_id="title",
     )
-    
     # Hidden textbox to store the JSON string of selected indices
     selected_indices_hidden = gr.Textbox(value="[]", visible=False)
     
@@ -336,17 +333,15 @@ with gr.Blocks(theme=gr.themes.Soft(font=font), css=css, delete_cache=(60, 60))
     with gr.Row():
         with gr.Column():
             selected_info = gr.Markdown("")
-            # Create a custom container for LoRA selection with checkboxes
+            # Build a custom layout for LoRA selection with checkboxes.
             lora_selection_container = gr.Column()
-            # We'll collect individual checkbox components in a list for later use
             lora_checkbox_list = []
             for idx, lora in enumerate(loras):
                 with gr.Row():
                     gr.Image(value=lora["image"], label=lora["title"], height=100)
                     checkbox = gr.Checkbox(label="Select", value=False, elem_id=f"lora_checkbox_{idx}")
                     lora_checkbox_list.append(checkbox)
-            # Add a hidden update button (invisible) to update the hidden state; it can be triggered programmatically.
-            update_selection_btn = gr.Button("Update LoRA Selection", visible=False)
+            gr.Markdown("[Check the list of FLUX LoRas](https://huggingface.co/models?other=base_model:adapter:black-forest-labs/FLUX.1-dev)", elem_id="lora_list")
         with gr.Column():
             progress_bar = gr.Markdown(elem_id="progress", visible=False)
             result = gr.Image(label="Generated Image")
@@ -368,19 +363,25 @@ with gr.Blocks(theme=gr.themes.Soft(font=font), css=css, delete_cache=(60, 60))
                     seed = gr.Slider(label="Seed", minimum=0, maximum=2**32-1, step=1, value=0, randomize=True)
                     lora_scale = gr.Slider(label="LoRA Scale", minimum=0, maximum=3, step=0.01, value=0.95)
     
-    # Function to combine checkbox states into a JSON list of selected indices.
+    # Function to combine the checkbox values into a JSON string.
     def combine_selections(*checkbox_values):
         selected_indices = [i for i, v in enumerate(checkbox_values) if v]
         return json.dumps(selected_indices)
     
-    # When the (invisible) update button is clicked, update the hidden state.
-    update_selection_btn.click(
+    # Chain the update: When the Generate button is clicked,
+    # first update the hidden state with combine_selections,
+    # then run run_lora using the updated hidden state.
+    generate_button.click(
         combine_selections,
         inputs=lora_checkbox_list,
         outputs=selected_indices_hidden
+    ).then(
+        run_lora,
+        inputs=[prompt, input_image, image_strength, cfg_scale, steps, selected_indices_hidden, randomize_seed, seed, width, height, lora_scale],
+        outputs=[result, seed, progress_bar]
     )
     
-    # Also update the selected_info Markdown when the hidden state changes.
+    # Optionally, update the selected_info markdown when the hidden state changes.
     def update_info(selected_json):
         selected_indices = json.loads(selected_json)
         if selected_indices:
@@ -388,26 +389,11 @@ with gr.Blocks(theme=gr.themes.Soft(font=font), css=css, delete_cache=(60, 60))
         else:
             info = "No LoRAs selected."
         return info
-    selected_info.change(
+    selected_indices_hidden.change(
         update_info,
         inputs=selected_indices_hidden,
         outputs=selected_info
     )
-    
-    # Also, when the Generate button is clicked, update the hidden state from the checkboxes.
-    generate_button.click(
-        combine_selections,
-        inputs=lora_checkbox_list,
-        outputs=selected_indices_hidden
-    )
-    
-    # Finally, trigger the generation function (run_lora). Note that run_lora should be modified to parse the JSON string.
-    gr.on(
-        triggers=[generate_button.click, prompt.submit],
-        fn=run_lora,  # Make sure run_lora begins by parsing the JSON: selected_indices = json.loads(selected_indices_hidden)
-        inputs=[prompt, input_image, image_strength, cfg_scale, steps, selected_indices_hidden, randomize_seed, seed, width, height, lora_scale],
-        outputs=[result, seed, progress_bar]
-    )
 
 app.queue()
 app.launch()