Update app.py

app.py

@@ -6,43 +6,53 @@ from fastrtc import WebRTC, get_turn_credentials
 @spaces.GPU
 def flip_frame_handler(video_frame):
     """
-    Flips the incoming video frame vertically and yields it.
-    This needs to be a generator function because the output is a receive-only stream.
+    Flips the incoming video frame both vertically and horizontally.
+    This function now uses 'return' because it processes one frame at a time.
     """
-    if video_frame:
-        yield np.flip(video_frame, axis=0)
+    if video_frame is not None:
+        # A single call to np.flip with axis=(0, 1) flips both vertically and horizontally.
+        return np.flip(video_frame, axis=(0, 1))
+    
+    # Return None if no frame is received to handle the case gracefully.
+    return None
 
 # --- Gradio UI Layout ---
-with gr.Blocks(theme=gr.themes.Soft(), title="FastRTC Webcam Frame Flipper") as demo:
-    gr.Markdown("# 🚀 FastRTC Webcam Frame Flipper (Side-by-Side)")
-    gr.Markdown("*This demo takes your webcam feed from the left panel, flips each frame vertically on the server, and streams it back to the right panel in real-time.*")
+with gr.Blocks(theme=gr.themes.Soft(), title="FastRTC Webcam Double Flipper") as demo:
+    gr.Markdown("# 🚀 FastRTC Webcam Double Flipper (Side-by-Side)")
+    gr.Markdown(
+        "*This demo takes your webcam feed from the left, flips it both horizontally and vertically on the server, and streams it back to the right panel in real-time.*"
+    )
     
     with gr.Row():
         with gr.Column():
             gr.Markdown("### 1. Your Webcam Feed (Input)")
-            # This component only sends video to the server
+            # This component is configured only to send video to the server.
             webcam_input = WebRTC(
                 label="Webcam Input",
                 modality="video", 
                 mode="send",
+                width=640,
+                height=480,
                 rtc_configuration=get_turn_credentials(),
             )
             
         with gr.Column():
             gr.Markdown("### 2. Flipped Video (Output)")
-            # This component only receives video from the server
+            # This component is configured only to receive video from the server.
             video_output = WebRTC(
                 label="Flipped Output Stream",
                 modality="video", 
                 mode="receive",
+                width=640,
+                height=480,
                 rtc_configuration=get_turn_credentials(),
             )
         
-    # The `stream` event is triggered by the input component
+    # The `stream` event is triggered by new frames from the `webcam_input` component.
     webcam_input.stream(
         fn=flip_frame_handler, 
-        inputs=[webcam_input],      # Input is the webcam feed
-        outputs=[video_output],     # Output is the separate receive-only component
+        inputs=[webcam_input],      # The input to our function is the webcam feed.
+        outputs=[video_output],     # The output is sent to the separate 'receive' component.
         time_limit=60,
     )