Update app.py

app.py

@@ -83,34 +83,58 @@ def process_live_frame(frame):
     else:
         alerter.reset_alert()
 
-    # Return all the values needed to update the UI
     return processed_frame, status_text, audio_output
 
-# --- Gradio UI Definition ---
-with gr.Blocks(theme=gr.themes.Default(primary_hue="blue", secondary_hue="blue")) as app:
-    gr.Markdown("# 🚗 Drive Paddy - Drowsiness Detection (Gradio)")
-    gr.Markdown("A live test using Gradio's webcam component. This can be more stable than WebRTC in some environments.")
+# --- UI Definition for the Live Detection Page ---
+def create_live_detection_page():
+    """Builds the Gradio UI components for the live detection tab."""
+    with gr.Blocks(theme=gr.themes.Default(primary_hue="blue", secondary_hue="blue")) as live_detection_page:
+        gr.Markdown("A live test using Gradio's webcam component.")
+        with gr.Row():
+            with gr.Column():
+                webcam_input = gr.Image(sources=["webcam"], streaming=True, label="Live Camera Feed")
+            with gr.Column():
+                processed_output = gr.Image(label="Processed Feed")
+                status_output = gr.Textbox(label="Live Status", lines=3, interactive=False)
+                # Audio player is now visible for debugging and user feedback.
+                audio_alert_output = gr.Audio(autoplay=True, visible=True, label="Alert Sound")
 
-    with gr.Row():
-        with gr.Column():
-            # Input: Live webcam feed
-            webcam_input = gr.Image(sources=["webcam"], streaming=True, label="Live Camera Feed")
-        with gr.Column():
-            # Output 1: Processed video feed
-            processed_output = gr.Image(label="Processed Feed")
-            # Output 2: Live status text
-            status_output = gr.Textbox(label="Live Status", lines=3, interactive=False)
-            # Output 3: Hidden audio player for alerts
-            audio_alert_output = gr.Audio(autoplay=True, visible=False)
+        webcam_input.stream(
+            fn=process_live_frame,
+            inputs=[webcam_input],
+            outputs=[processed_output, status_output, audio_alert_output]
+        )
+    return live_detection_page
 
-    # Link the input to the processing function and the function to the outputs
-    webcam_input.stream(
-        fn=process_live_frame,
-        inputs=[webcam_input],
-        outputs=[processed_output, status_output, audio_alert_output]
-    )
+# --- UI Definition for the Home Page ---
+def create_home_page():
+    """Builds the Gradio UI components for the home/welcome tab."""
+    with gr.Blocks(theme=gr.themes.Default(primary_hue="blue", secondary_hue="blue")) as home_page:
+        gr.Markdown(
+        """
+        <div align="center">
+          <img src="https://em-content.zobj.net/source/samsung/380/automobile_1f697.png" alt="Car Emoji" width="100"/>
+          <h1>Welcome to Drive Paddy!</h1>
+          <p><strong>Your Drowsiness Detection Assistant</strong></p>
+        </div>
+        
+        ---
+        
+        ### How It Works
+        This application uses your webcam to monitor for signs of drowsiness in real-time. Navigate to the **Live Detection** tab to begin.
+        
+        - **Multi-Signal Analysis**: Detects eye closure, yawning, and head position.
+        - **AI-Powered Alerts**: Uses Gemini to generate dynamic audio warnings.
+        - **Live Feedback**: Provides instant visual feedback on the video stream and status panel.
+        """
+        )
+    return home_page
+
+# --- Combine Pages into a Tabbed Interface ---
+app = gr.TabbedInterface(
+    [create_home_page(), create_live_detection_page()],
+    ["Home", "Live Detection"]
+)
 
 # --- Launch the App ---
-# REMOVED: The 'if __name__ == "__main__":' block.
-# Hugging Face will run this file as a module and needs to find the 'app' object.
 app.launch(debug=True)