Update app.py

app.py

@@ -1,14 +1,3 @@
-#
-# Advanced Image Augmentation Tool for Gradio
-#
-# This script creates a comprehensive web interface for applying various image transformations.
-# It uses the modern gr.ImageEditor component for interactive cropping.
-#
-# CRITICAL FIX: The event handling logic has been revised to prevent feedback loops.
-# Instead of using a broad .change() event on the ImageEditor, this version uses
-# specific .upload(), .clear(), and .select() events. Transformation triggers
-# now ONLY update the output image, not the input, which resolves the flickering/resetting issue.
-#
 
 import gradio as gr
 from PIL import Image, ImageEnhance, ImageFilter, ImageOps
@@ -17,7 +6,6 @@ import random
 import cv2
 import os
 
-# --- Core Transformation Logic ---
 
 def apply_transformations(
     image,
@@ -43,7 +31,8 @@ def apply_transformations(
     cutout_ratio
 ):
     """
-    Applies a series of transformations to an input image based on user-defined parameters.
+    Applies a series of transformations to an input image. This function is now
+    called ONLY when the 'Apply Transformations' button is clicked.
     """
     # Handle the dictionary input from gr.ImageEditor, which contains the background image
     if isinstance(image, dict) and image.get("background") is not None:
@@ -70,7 +59,7 @@ def apply_transformations(
         mosaic_img.paste(crops[3].resize((cx, cy), Image.Resampling.LANCZOS), (cx, cy))
         img = mosaic_img
 
-    # Geometric Augmentation: Crop
+    # Geometric Augmentation: Crop (uses the stored state)
     if crop_box is not None:
         try:
             x1, y1, x2, y2 = map(int, crop_box)
@@ -79,7 +68,7 @@ def apply_transformations(
         except (ValueError, TypeError):
             pass
 
-    # Apply other transformations...
+    # Apply all other transformations...
     if scale_factor != 1.0: img = img.resize((int(img.width * scale_factor), int(img.height * scale_factor)), Image.Resampling.LANCZOS)
     if shear_x != 0 or shear_y != 0: img = img.transform(img.size, Image.Transform.AFFINE, (1, shear_x, 0, shear_y, 1, 0), Image.Resampling.BICUBIC)
     if rotation_angle != 0: img = img.rotate(rotation_angle, expand=True, fillcolor=(128, 128, 128))
@@ -127,6 +116,7 @@ def apply_transformations(
 # --- UI Helper Functions ---
 
 def process_selection(evt: gr.SelectData):
+    """Callback function to CAPTURE the coordinates of a user's selection, to be used later."""
     return (evt.index[0], evt.index[1], evt.index[2], evt.index[3])
 
 def update_slider(min_val, max_val, current_val):
@@ -135,6 +125,7 @@ def update_slider(min_val, max_val, current_val):
     return gr.update(minimum=min_val, maximum=max_val, value=new_val)
 
 def reset_all_controls():
+    """Returns a tuple of default values to reset all UI components to their initial state."""
     return (
         False, None, 1.0, 0, False, False, 0.0, 0.0, 1.0, 1.0, 1.0, 0, 1.0, False, False, 0.0, 0, 0, 0, 0.0,
         0.1, 3.0, -180, 180, -0.5, 0.5, -0.5, 0.5, 0.0, 3.0, 0.0, 3.0, 0.0, 3.0,
@@ -142,21 +133,25 @@ def reset_all_controls():
         None, None
     )
 
-def on_upload_or_clear():
-    return reset_all_controls()
+def on_upload():
+    """Returns a partial reset tuple, specifically clearing the output image and resetting controls, but leaves the input image alone."""
+    # Slices the full reset tuple to exclude the last two items (image_input, image_output)
+    # and then adds a None for image_output.
+    return reset_all_controls()[:-2] + (None,)
+
 
 # --- Gradio UI Layout ---
 
 with gr.Blocks(theme=gr.themes.Soft(), css="footer {display: none !important}") as demo:
-    gr.Markdown("# Advanced Image Augmentation Tool")
-    gr.Markdown("Upload an image or select an example. Apply transformations from the control panel and even define your own parameter ranges.")
+    gr.Markdown("# Advanced Image Augmentation Tool (Manual Control)")
+    gr.Markdown("Set your parameters on the left, then click **Apply Transformations** to see the result.")
     
     crop_box_state = gr.State(None)
     mosaic_trigger = gr.State(False)
 
     with gr.Row(variant="panel"):
         with gr.Column(scale=1, min_width=400):
-            gr.Markdown("### Main Control Panel")
+            gr.Markdown("### Control Panel")
             # All control panels remain the same...
             with gr.Accordion("Geometric Transformations", open=True):
                 scale_slider = gr.Slider(0.1, 3.0, 1.0, step=0.05, label="Scale")
@@ -179,6 +174,7 @@ with gr.Blocks(theme=gr.themes.Soft(), css="footer {display: none !important}")
                 mosaic_btn = gr.Button("Apply Mosaic")
 
             with gr.Accordion("Parameter Range Control (Advanced)", open=False):
+                # This panel remains unchanged
                 with gr.Tabs():
                     with gr.TabItem("Geometric"):
                         scale_min, scale_max, rotation_min, rotation_max = gr.Number(0.1, label="Scale Min"), gr.Number(3.0, label="Scale Max"), gr.Number(-180, label="Rotation Min"), gr.Number(180, label="Rotation Max")
@@ -194,6 +190,8 @@ with gr.Blocks(theme=gr.themes.Soft(), css="footer {display: none !important}")
             reset_btn = gr.Button("Reset All Settings", variant="stop", size="lg")
 
         with gr.Column(scale=3):
+            apply_btn = gr.Button("Apply Transformations", variant="primary")
+            
             image_input = gr.ImageEditor(type="numpy", label="Original Image (Select an area to crop)", interactive=True)
             image_output = gr.Image(label="Transformed Image", interactive=False)
             gr.Examples(
@@ -201,14 +199,15 @@ with gr.Blocks(theme=gr.themes.Soft(), css="footer {display: none !important}")
                 inputs=image_input, label="Example Images"
             )
 
-    all_inputs = [
+    # --- LIST OF ALL INPUTS AND RESETTABLE COMPONENTS ---
+    all_inputs_for_transform = [
         image_input, mosaic_trigger, crop_box_state, scale_slider, rotation_slider, h_flip_check, v_flip_check,
         shear_x_slider, shear_y_slider, brightness_slider, contrast_slider, saturation_slider, 
         hue_slider, gamma_slider, grayscale_check, invert_check, blur_slider, sharpen_slider, noise_slider,
         cutout_n_slider, cutout_ratio_slider
     ]
     
-    all_resettable_outputs = [
+    all_resettable_components = [
         mosaic_trigger, crop_box_state, scale_slider, rotation_slider, h_flip_check, v_flip_check,
         shear_x_slider, shear_y_slider, brightness_slider, contrast_slider, saturation_slider, 
         hue_slider, gamma_slider, grayscale_check, invert_check, blur_slider, sharpen_slider, noise_slider,
@@ -219,32 +218,52 @@ with gr.Blocks(theme=gr.themes.Soft(), css="footer {display: none !important}")
         cutout_n_min, cutout_n_max, cutout_ratio_min, cutout_ratio_max,
         image_input, image_output
     ]
+    
+    partial_resettable_components = all_resettable_components[:-2] + [image_output]
 
-    # STABLE EVENT HANDLING
-    # 1. Any change in a control slider/checkbox triggers the transformation function.
-    #    CRITICAL: The output is ONLY the output image, not the input. This prevents the loop.
-    for component in all_inputs:
-        if component not in [image_input, crop_box_state, mosaic_trigger]:
-            component.change(fn=apply_transformations, inputs=all_inputs, outputs=[image_output, mosaic_trigger])
+    # --- STABLE EVENT HANDLING (MANUAL TRIGGER) ---
+
+    # 1. THE MAIN TRIGGER: Apply button click
+    apply_btn.click(
+        fn=apply_transformations,
+        inputs=all_inputs_for_transform,
+        outputs=[image_output, mosaic_trigger]
+    )
             
-    # 2. Selecting a crop area updates the crop state, then triggers transformation.
-    image_input.select(fn=process_selection, inputs=None, outputs=[crop_box_state]).then(
-        fn=apply_transformations, inputs=all_inputs, outputs=[image_output, mosaic_trigger])
+    # 2. Selecting a crop area ONLY updates the crop state silently. No transformation is run.
+    image_input.select(
+        fn=process_selection,
+        inputs=None,
+        outputs=[crop_box_state]
+    )
 
-    # 3. Use SPECIFIC events for upload/clear to reset the entire UI.
-    image_input.upload(fn=on_upload_or_clear, inputs=None, outputs=all_resettable_outputs)
-    image_input.clear(fn=on_upload_or_clear, inputs=None, outputs=all_resettable_outputs)
-    reset_btn.click(fn=on_upload_or_clear, inputs=None, outputs=all_resettable_outputs)
+    # 3. Use SPECIFIC events for upload/clear to reset the UI in a controlled way.
+    #    These do NOT trigger any transformations.
+    image_input.upload(
+        fn=on_upload,
+        inputs=None,
+        outputs=partial_resettable_components
+    )
+    image_input.clear(
+        fn=reset_all_controls,
+        inputs=None,
+        outputs=all_resettable_components
+    )
+    reset_btn.click(
+        fn=reset_all_controls,
+        inputs=None,
+        outputs=all_resettable_components
+    )
     
-    # Other event handlers
+    # 4. Other helper buttons also have no effect on images until "Apply" is clicked.
     rotate_90_btn.click(lambda x: (x + 90) % 360, inputs=[rotation_slider], outputs=[rotation_slider])
     rotate_180_btn.click(lambda: 180, inputs=None, outputs=[rotation_slider])
     rotate_270_btn.click(lambda: -90, inputs=None, outputs=[rotation_slider])
     
-    mosaic_btn.click(lambda: True, None, mosaic_trigger).then(
-        fn=apply_transformations, inputs=all_inputs, outputs=[image_output, mosaic_trigger])
+    # Mosaic button only updates the state, to be used when "Apply" is clicked.
+    mosaic_btn.click(lambda: True, None, mosaic_trigger)
 
-    # Range control handlers remain the same
+    # 5. Range control handlers update the sliders, but do not trigger transformations.
     range_map = {
         (scale_min, scale_max): scale_slider, (rotation_min, rotation_max): rotation_slider,
         (shear_x_min, shear_x_max): shear_x_slider, (shear_y_min, shear_y_max): shear_y_slider,