Update demo.py

demo.py

@@ -126,6 +126,23 @@ def generate_new_experiment() -> Experiment:
     )
 
 
+def load_initial():
+    """
+    Initializes the first experiment on app load.
+    """
+    try:
+        new_experiment = generate_new_experiment()
+        return [
+            new_experiment,
+            gr.Video.update(value=new_experiment["video_left"]),
+            gr.Video.update(value=new_experiment["video_right"]),
+            ""  # Empty message
+        ]
+    except Exception as e:
+        print(f"Error loading initial experiment: {e}")
+        return [None, gr.Video.update(value=""), gr.Video.update(value=""), "❌ Failed to load initial videos ❌"]
+
+
 def select_and_load(selected_label, experiment, message_component):
     """
     Handles the selection of a video by the user.
@@ -160,8 +177,6 @@ def select_and_load(selected_label, experiment, message_component):
         new_experiment = generate_new_experiment()
 
         # Update the video components with new video paths
-        # Instead of creating new Video components, use .update() to change the 'value'
-        # This ensures that Gradio correctly updates the existing components
         return [
             new_experiment,
             gr.Video.update(value=new_experiment["video_left"]),
@@ -173,8 +188,12 @@ def select_and_load(selected_label, experiment, message_component):
         message_component.value = f"❌ Failed to load new videos: {e} ❌"
         print(f"Error generating new experiment: {e}")
         # Keep the current experiment and videos
-        return [experiment, gr.Video.update(value=experiment["video_left"]),
-                gr.Video.update(value=experiment["video_right"]), message_component.value]
+        return [
+            experiment,
+            gr.Video.update(value=experiment["video_left"]),
+            gr.Video.update(value=experiment["video_right"]),
+            message_component.value
+        ]
 
 
 def skip_experiment(mode, experiment, message_component):
@@ -220,8 +239,12 @@ def skip_experiment(mode, experiment, message_component):
         message_component.value = f"❌ Failed to load new videos: {e} ❌"
         print(f"Error generating new experiment: {e}")
         # Keep the current experiment and videos
-        return [experiment, gr.Video.update(value=experiment["video_left"]),
-                gr.Video.update(value=experiment["video_right"]), message_component.value]
+        return [
+            experiment,
+            gr.Video.update(value=experiment["video_left"]),
+            gr.Video.update(value=experiment["video_right"]),
+            message_component.value
+        ]
 
 ##################################################################
 # UI Layer
@@ -256,9 +279,12 @@ css = """
     justify-content: center;
     align-items: center;
 }
+video {
+    width: 100%;
+    height: auto;
+}
 """
 
-
 with gr.Blocks(title="Unsupervised Video Editing", css=css) as demo:
     # Initialize the state
     experiment = gr.State()
@@ -327,7 +353,7 @@ with gr.Blocks(title="Unsupervised Video Editing", css=css) as demo:
 
     # Load the first experiment on app startup
     demo.load(
-        fn=generate_new_experiment,
+        fn=load_initial,
         inputs=None,
         outputs=[experiment, video_left_component, video_right_component, message_component]
     )