Update app.py

app.py

@@ -1,31 +1,76 @@
 import gradio as gr
+from gradio_client import Client
 import os
 
 BACKEND_URL = os.environ.get("BACKEND_URL", "").strip()
 
-with gr.Blocks(theme=gr.themes.Soft(), title="PrimateFace Demo") as demo:
-    if BACKEND_URL:
-        gr.HTML(f'''
-        <div style="padding: 20px;">
-            <h1 style="text-align: center;">🐵 PrimateFace Detection, Pose & Gaze Demo</h1>
-            <p style="text-align: center; color: green;">✅ GPU Server Connected</p>
-        </div>
-        <iframe 
-            src="{BACKEND_URL}" 
-            width="100%" 
-            height="1000px" 
-            frameborder="0"
-            style="border: 1px solid #ccc; border-radius: 8px;">
-        </iframe>
-        ''')
-    else:
-        gr.Markdown("""
-        # 🐵 PrimateFace Demo
-        
-        ### 🔴 Configuration Error
+def process_with_backend(file_obj, webcam_img, model_type, conf_thresh, max_dets, task_type):
+    """Forward request to backend"""
+    try:
+        client = Client(BACKEND_URL, headers={"ngrok-skip-browser-warning": "true"})
+        result = client.predict(
+            file_obj,
+            webcam_img, 
+            model_type,
+            conf_thresh,
+            max_dets,
+            task_type,
+            api_name="/predict"
+        )
+        return result
+    except Exception as e:
+        return [gr.update() for _ in range(5)] + [f"Error: {str(e)}"]
+
+with gr.Blocks(theme=gr.themes.Soft()) as demo:
+    gr.Markdown("# 🐵 PrimateFace Detection, Pose Estimation, and Gaze Demo")
+    
+    with gr.Row():
+        with gr.Column(scale=1):
+            with gr.Tabs():
+                with gr.TabItem("Upload File"):
+                    input_file = gr.File(label="Upload Image or Video", file_types=["image", "video"])
+                    display_raw_image_file = gr.Image(visible=False)
+                    display_raw_video_file = gr.Video(visible=False)
+                
+                with gr.TabItem("Webcam"):
+                    gr.Markdown("Click on feed or press Enter to capture")
+                    input_webcam = gr.Image(sources=["webcam"], type="pil")
+                    display_raw_image_webcam = gr.Image(visible=False)
+            
+            clear_button = gr.Button("Clear All Inputs & Outputs")
         
-        The BACKEND_URL environment variable is not set. 
-        Please configure it in the Space settings under "Repository secrets".
-        """)
+        with gr.Column(scale=1):
+            gr.Markdown("### Processed Output")
+            display_processed_image = gr.Image(visible=False)
+            display_processed_video = gr.Video(visible=False)
+    
+    submit_button = gr.Button("Detect Faces", variant="primary")
+    
+    with gr.Column():
+        gr.Markdown("### Detection Controls")
+        model_choice = gr.Radio(["MMDetection"], value="MMDetection", visible=False)
+        task_type = gr.Dropdown(
+            ["Face Detection", "Face Pose Estimation", "Gaze Estimation [experimental]"],
+            value="Face Detection",
+            label="Select Task"
+        )
+        conf_threshold = gr.Slider(0.05, 0.95, 0.25, step=0.05, label="Confidence Threshold")
+        max_detections = gr.Slider(1, 10, 3, step=1, label="Max Detections")
+    
+    # Wire events
+    outputs = [display_raw_image_file, display_raw_video_file, display_raw_image_webcam, 
+               display_processed_image, display_processed_video]
+    
+    submit_button.click(
+        process_with_backend,
+        inputs=[input_file, input_webcam, model_choice, conf_threshold, max_detections, task_type],
+        outputs=outputs
+    )
+    
+    # Simplified clear function
+    clear_button.click(
+        lambda: [gr.update(value=None) for _ in range(5)],
+        outputs=outputs
+    )
 
 demo.launch()