app.py

import gradio as gr
import os

# Function to handle image upload and layout setting
def process_images(layout, image_files):
    # Save uploaded images
    img_paths = []
    for img_file in image_files:
        img_path = f"temp_images/{img_file.name}"
        img_file.save(img_path)
        img_paths.append(img_path)
    
    # Return the layout and image paths to the front-end (HTML and JS will take care of it)
    return layout, img_paths

# Gradio Interface setup
iface = gr.Interface(
    fn=process_images, 
    inputs=[
        gr.CheckboxGroup(
            label="Choose Grid Layout", 
            choices=["1x2", "1x3", "2x2", "2x3"],
            type="value"  # This allows for the selection of multiple options if needed
        ),
        gr.File(label="Upload Images", type="file", multiple=True)  # Multiple image upload
    ], 
    outputs=["text", "json"],  # We'll output a layout and list of image paths
    live=True  # Updates in real-time
)

# Run Gradio app
iface.launch(share=True)