lib/ui_components.py

import gradio as gr
from .api_utils import get_camera_motions
from pathlib import Path

def create_header():
    """Create the header with title and API settings in 3 columns."""
    with gr.Row():
        # Title column
        with gr.Column(scale=1):
            gr.Markdown(
                """
                # 🎬 LumaAI Video Generator
                ### Transform your prompts into mesmerizing videos
                """
            )
            
        # API info column
        with gr.Column(scale=1):
            gr.Markdown("Get an API key from [LumaAI Dream Machine](https://lumalabs.ai/dream-machine/api)")
            gr.Markdown("*$0.0032 USD/megapixel: 720p, 5 sec video is around $0.4 USD*")
    
        # Empty column for symmetry
        with gr.Column(scale=1):
            pass

def create_main_interface(generate_fn):
    """Create the main interface with input and output columns."""
    with gr.Row():
        # Input column
        with gr.Column(scale=1):
            api_key = gr.Textbox(
                label="LumaAI API Key", 
                placeholder="Enter a LumaAI API key",
                type="password",
                autofocus=True,
                show_label=False,
                container=False,
                scale=1
            )
            
            with gr.Row():
                prompt = gr.Textbox(
                    label="Prompt",
                    placeholder="Describe your video scene here...",
                    lines=3,
                    value="Dreamlike scene transforms into circuitry"
                )
            
            camera_motion = gr.Dropdown(
                choices=get_camera_motions(),
                label="Camera Motion",
                value="None"
            )
            
            loop_video = gr.Checkbox(
                label="Loop Video",
                value=False,
                info="Enable video looping"
            )
            
            generate_btn = gr.Button("🚀 Generate Video", variant="primary", size="lg")
            clear_btn = gr.Button("🗑️ Clear Placeholders", size="sm", variant="huggingface")
        
        # Output column
        with gr.Column(scale=1):
            video_output = gr.Video(
                label="Generated Video",
                show_label=True,
                width="100%",
                height="400px",
                value="TestVideo.mp4"
            )
            
            with gr.Accordion("🖼️ Starting Image [Optional]", open=True):
                image_input = gr.Image(
                    label="Starting Image (will be resized to 512x512)",
                    type="pil",
                    value="TestImage.png"
                )

        # Set up event handlers
        def clear_all():
            return ["", None, None]  # Clear prompt, image, and video
            
        clear_btn.click(
            fn=clear_all,
            inputs=[],
            outputs=[prompt, image_input, video_output]
        )
        
        generate_btn.click(
            fn=generate_fn,
            inputs=[api_key, prompt, camera_motion, loop_video, image_input],
            outputs=video_output,
            api_name=False
        )

def create_interface(generate_fn):
    """Create the complete interface."""
    with gr.Blocks(theme=gr.themes.Monochrome()) as interface:
        create_header()
        create_main_interface(generate_fn)
        return interface