Update image assets and refactor app.py for improved functionality. Added new images, removed outdated ones, and updated paths in IMAGE_PATHS. Renamed render_demo3 function to render_demonstrate for clarity. Adjusted UI styles and fixed image loading issues.

.gitattributes

@@ -38,3 +38,7 @@ test_samples/oxford.jpeg filter=lfs diff=lfs merge=lfs -text
 test_samples/changi.jpg filter=lfs diff=lfs merge=lfs -text
 test_samples/friends.jpg filter=lfs diff=lfs merge=lfs -text
 test_samples/jesus.jpg filter=lfs diff=lfs merge=lfs -text
+test_samples/living_room_2.jpeg filter=lfs diff=lfs merge=lfs -text
+test_samples/living_room.jpg filter=lfs diff=lfs merge=lfs -text
+test_samples/oxford.jpg filter=lfs diff=lfs merge=lfs -text
+test_samples/arc_de_tromphe.jpeg filter=lfs diff=lfs merge=lfs -text

app.py

@@ -27,6 +27,7 @@ import glob
 
 
 
+
 CONFIG_PATH = "configs/inference/inference.yaml"
 CONFIG = OmegaConf.load(CONFIG_PATH)
 DEVICE = torch.device("cuda" if torch.cuda.is_available() else "cpu")
@@ -39,12 +40,13 @@ WIDTH = 576
 HEIGHT = 576
 
 
-IMAGE_PATHS = ['test_samples/changi.jpg', 'test_samples/oxford.jpeg', 'test_samples/open_door.jpg', 'test_samples/jesus.jpg', 'test_samples/friends.jpg']
-
-# for asset_dir in ASSET_DIRS:
-#     if os.path.exists(asset_dir):
-#         for ext in ["*.jpg", "*.jpeg", "*.png"]:
-#             IMAGE_PATHS.extend(glob.glob(os.path.join(asset_dir, ext)))
+IMAGE_PATHS = ['test_samples/oxford.jpg', 
+               'test_samples/open_door.jpg', 
+               'test_samples/living_room.jpg', 
+               'test_samples/living_room_2.jpeg',
+               'test_samples/arc_de_tromphe.jpeg',
+               'test_samples/changi.jpg', 
+               'test_samples/jesus.jpg',]
 
 # If no images found, create placeholders
 if not IMAGE_PATHS:
@@ -52,7 +54,6 @@ if not IMAGE_PATHS:
         """Create placeholder images for the demo"""
         images = []
         for i in range(num_samples):
-            # Create a gradient image as placeholder
             img = np.zeros((height, width, 3), dtype=np.uint8)
             for h in range(height):
                 for w in range(width):
@@ -314,13 +315,13 @@ def undo_navigation(
 
 
 
-def render_demo3(
+def render_demonstrate(
     s: Literal["Selection", "Generation"],
     idx: int,
-    demo3_stage: gr.State,
-    demo3_selected_index: gr.State,
-    demo3_current_video: gr.State,
-    demo3_current_poses: gr.State
+    demonstrate_stage: gr.State,
+    demonstrate_selected_index: gr.State,
+    demonstrate_current_video: gr.State,
+    demonstrate_current_poses: gr.State
 ):
     gr.Markdown(
         """
@@ -377,17 +378,20 @@ def render_demo3(
                     upload_btn.click(
                         fn=process_uploaded_image,
                         inputs=[upload_image],
-                        outputs=[demo3_stage, demo3_selected_index, demo3_current_video, demo3_current_poses]
+                        outputs=[demonstrate_stage, demonstrate_selected_index, demonstrate_current_video, demonstrate_current_poses]
                     )
                 
                 gr.Markdown("### Or Choose From Our Examples")
                 # Define image captions
                 image_captions = {
-                    'test_samples/changi.jpg': 'Changi Airport',
-                    'test_samples/oxford.jpeg': 'Oxford University',
+          
+                    'test_samples/oxford.jpg': 'Oxford University',
                     'test_samples/open_door.jpg': 'Bedroom Interior',
+                    'test_samples/living_room.jpg': 'Living Room',
+                    'test_samples/living_room_2.jpeg': 'Living Room 2',
+                    'test_samples/arc_de_tromphe.jpeg': 'Arc de Triomphe',
                     'test_samples/jesus.jpg': 'Jesus College',
-                    'test_samples/friends.jpg': 'Friends Café'
+                    'test_samples/changi.jpg': 'Changi Airport',
                 }
                 
                 # Load all images for the gallery with captions
@@ -401,7 +405,7 @@ def render_demo3(
                         print(f"Error loading image {img_path}: {e}")
                 
                 # Show image gallery for selection
-                demo3_image_gallery = gr.Gallery(
+                demonstrate_image_gallery = gr.Gallery(
                     value=gallery_images,
                     label="Select an Image to Start Navigation",
                     columns=len(gallery_images),
@@ -436,22 +440,22 @@ def render_demo3(
                         gr.Warning(f"Error starting navigation: {e}")
                         return "Selection", None, None, None
                 
-                demo3_image_gallery.select(
+                demonstrate_image_gallery.select(
                     fn=start_navigation,
                     inputs=None, 
-                    outputs=[demo3_stage, demo3_selected_index, demo3_current_video, demo3_current_poses]
+                    outputs=[demonstrate_stage, demonstrate_selected_index, demonstrate_current_video, demonstrate_current_poses]
                 )
 
         case "Generation":
             with gr.Row():
                 with gr.Column(scale=3):
                     with gr.Row():
-                        demo3_current_view = gr.Image(
+                        demonstrate_current_view = gr.Image(
                             label="Current View",
                             width=256,
                             height=256,
                         )
-                        demo3_video = gr.Video(
+                        demonstrate_video = gr.Video(
                             label="Generated Video",
                             width=256,
                             height=256,
@@ -461,7 +465,7 @@ def render_demo3(
                             show_download_button=True,
                         )
 
-                    demo3_generated_gallery = gr.Gallery(
+                    demonstrate_generated_gallery = gr.Gallery(
                         value=[],
                         label="Generated Frames",
                         columns=[6],
@@ -472,7 +476,7 @@ def render_demo3(
                         try:
                             selected_path = IMAGE_PATHS[idx]
                             result = load_image_for_navigation(selected_path)
-                            demo3_current_view.value = result["image"]
+                            demonstrate_current_view.value = result["image"]
                         except Exception as e:
                             print(f"Error initializing current view: {e}")
 
@@ -503,15 +507,15 @@ def render_demo3(
                                     distance=0,
                                 ),
                                 inputs=[
-                                    demo3_current_video,
-                                    demo3_current_poses,
+                                    demonstrate_current_video,
+                                    demonstrate_current_poses,
                                 ],
                                 outputs=[
-                                    demo3_current_video,
-                                    demo3_current_poses,
-                                    demo3_current_view,
-                                    demo3_video,
-                                    demo3_generated_gallery,
+                                    demonstrate_current_video,
+                                    demonstrate_current_poses,
+                                    demonstrate_current_view,
+                                    demonstrate_video,
+                                    demonstrate_generated_gallery,
                                 ],
                             )
 
@@ -528,42 +532,18 @@ def render_demo3(
                                     distance=0,
                                 ),
                                 inputs=[
-                                    demo3_current_video,
-                                    demo3_current_poses,
+                                    demonstrate_current_video,
+                                    demonstrate_current_poses,
                                 ],
                                 outputs=[
-                                    demo3_current_video,
-                                    demo3_current_poses,
-                                    demo3_current_view,
-                                    demo3_video,
-                                    demo3_generated_gallery,
+                                    demonstrate_current_video,
+                                    demonstrate_current_poses,
+                                    demonstrate_current_view,
+                                    demonstrate_video,
+                                    demonstrate_generated_gallery,
                                 ],
                             )
 
-                            # gr.Button(
-                            #     "↑0°\nAhead",
-                            #     size="sm",
-                            #     min_width=0,
-                            #     variant="primary",
-                            # ).click(
-                            #     fn=partial(
-                            #         navigate_video,
-                            #         x_angle=0,
-                            #         y_angle=0,
-                            #         distance=10,
-                            #     ),
-                            #     inputs=[
-                            #         demo3_current_video,
-                            #         demo3_current_poses,
-                            #     ],
-                            #     outputs=[
-                            #         demo3_current_video,
-                            #         demo3_current_poses,
-                            #         demo3_current_view,
-                            #         demo3_video,
-                            #         demo3_generated_gallery,
-                            #     ],
-                            # )
                             gr.Button(
                                 "↗10°\nTurn",
                                 size="sm",
@@ -577,15 +557,15 @@ def render_demo3(
                                     distance=0,
                                 ),
                                 inputs=[
-                                    demo3_current_video,
-                                    demo3_current_poses,
+                                    demonstrate_current_video,
+                                    demonstrate_current_poses,
                                 ],
                                 outputs=[
-                                    demo3_current_video,
-                                    demo3_current_poses,
-                                    demo3_current_view,
-                                    demo3_video,
-                                    demo3_generated_gallery,
+                                    demonstrate_current_video,
+                                    demonstrate_current_poses,
+                                    demonstrate_current_view,
+                                    demonstrate_video,
+                                    demonstrate_generated_gallery,
                                 ],
                             )
                             gr.Button(
@@ -601,15 +581,15 @@ def render_demo3(
                                     distance=0,
                                 ),
                                 inputs=[
-                                    demo3_current_video,
-                                    demo3_current_poses,
+                                    demonstrate_current_video,
+                                    demonstrate_current_poses,
                                 ],
                                 outputs=[
-                                    demo3_current_video,
-                                    demo3_current_poses,
-                                    demo3_current_view,
-                                    demo3_video,
-                                    demo3_generated_gallery,
+                                    demonstrate_current_video,
+                                    demonstrate_current_poses,
+                                    demonstrate_current_view,
+                                    demonstrate_video,
+                                    demonstrate_generated_gallery,
                                 ],
                             )
                         
@@ -628,15 +608,15 @@ def render_demo3(
                                     distance=-10,
                                 ),
                                 inputs=[
-                                    demo3_current_video,
-                                    demo3_current_poses,
+                                    demonstrate_current_video,
+                                    demonstrate_current_poses,
                                 ],
                                 outputs=[
-                                    demo3_current_video,
-                                    demo3_current_poses,
-                                    demo3_current_view,
-                                    demo3_video,
-                                    demo3_generated_gallery,
+                                    demonstrate_current_video,
+                                    demonstrate_current_poses,
+                                    demonstrate_current_view,
+                                    demonstrate_video,
+                                    demonstrate_generated_gallery,
                                 ],
                             )
                             
@@ -653,78 +633,30 @@ def render_demo3(
                                     distance=10,
                                 ),
                                 inputs=[
-                                    demo3_current_video,
-                                    demo3_current_poses,
+                                    demonstrate_current_video,
+                                    demonstrate_current_poses,
                                 ],
                                 outputs=[
-                                    demo3_current_video,
-                                    demo3_current_poses,
-                                    demo3_current_view,
-                                    demo3_video,
-                                    demo3_generated_gallery,
+                                    demonstrate_current_video,
+                                    demonstrate_current_poses,
+                                    demonstrate_current_view,
+                                    demonstrate_video,
+                                    demonstrate_generated_gallery,
                                 ],
                             )
-                    # with gr.Tab("Advanced", elem_id="advanced-controls-tab"):
-                    #     with gr.Group():
-                    #         gr.Markdown("_**Select angles and distance:**_")
-
-                    #         demo3_y_angle = gr.Slider(
-                    #             minimum=-90,
-                    #             maximum=90,
-                    #             value=0,
-                    #             step=10,
-                    #             label="Horizontal Angle",
-                    #             interactive=True,
-                    #         )
-                    #         demo3_x_angle = gr.Slider(
-                    #             minimum=-40,
-                    #             maximum=40,
-                    #             value=0,
-                    #             step=10,
-                    #             label="Vertical Angle",
-                    #             interactive=True,
-                    #         )
-                    #         demo3_distance = gr.Slider(
-                    #             minimum=-200,
-                    #             maximum=200,
-                    #             value=100,
-                    #             step=10,
-                    #             label="Distance (negative = backward)",
-                    #             interactive=True,
-                    #         )
-
-                    #         gr.Button(
-                    #             "Generate Next Move", variant="primary"
-                    #         ).click(
-                    #             fn=navigate_video,
-                    #             inputs=[
-                    #                 demo3_current_video,
-                    #                 demo3_current_poses,
-                    #                 demo3_x_angle,
-                    #                 demo3_y_angle,
-                    #                 demo3_distance,
-                    #             ],
-                    #             outputs=[
-                    #                 demo3_current_video,
-                    #                 demo3_current_poses,
-                    #                 demo3_current_view,
-                    #                 demo3_video,
-                    #                 demo3_generated_gallery,
-                    #             ],
-                    #         )
                     gr.Markdown("---")
                     with gr.Group():
                         gr.Markdown("_**Navigation controls:**_")
                         with gr.Row():
                             gr.Button("Undo Last Move", variant="huggingface").click(
                                 fn=undo_navigation,
-                                inputs=[demo3_current_video, demo3_current_poses],
+                                inputs=[demonstrate_current_video, demonstrate_current_poses],
                                 outputs=[
-                                    demo3_current_video,
-                                    demo3_current_poses,
-                                    demo3_current_view,
-                                    demo3_video,
-                                    demo3_generated_gallery,
+                                    demonstrate_current_video,
+                                    demonstrate_current_poses,
+                                    demonstrate_current_view,
+                                    demonstrate_video,
+                                    demonstrate_generated_gallery,
                                 ],
                             )
                             
@@ -741,7 +673,7 @@ def render_demo3(
                             
                             gr.Button("Save Camera", variant="huggingface").click(
                                 fn=save_camera_poses,
-                                inputs=[demo3_current_video, demo3_current_poses],
+                                inputs=[demonstrate_current_video, demonstrate_current_poses],
                                 outputs=[]
                             )
                             
@@ -755,12 +687,12 @@ def render_demo3(
                             gr.Button("Choose New Image", variant="secondary").click(
                                 fn=reset_navigation,
                                 inputs=[],
-                                outputs=[demo3_stage, demo3_selected_index, demo3_current_video, demo3_current_poses]
+                                outputs=[demonstrate_stage, demonstrate_selected_index, demonstrate_current_video, demonstrate_current_poses]
                             )
 
 
 # Create the Gradio Blocks
-with gr.Blocks(theme=gr.themes.Base(primary_hue="teal")) as demo:
+with gr.Blocks(theme=gr.themes.Base(primary_hue="purple")) as demo:
     gr.HTML(
         """
     <style>
@@ -769,10 +701,10 @@ with gr.Blocks(theme=gr.themes.Base(primary_hue="teal")) as demo:
         font-weight: bold;
     }
     #page-title h1 {
-        color: #0D9488 !important;
+        color: #9B6B9E !important;
     }
     .task-title h2 {
-        color: #F59E0C !important;
+        color: #B19CD9 !important;
     }
     .header-button-row {
         gap: 4px !important;
@@ -785,7 +717,7 @@ with gr.Blocks(theme=gr.themes.Base(primary_hue="teal")) as demo:
         gap: 5px !important;
     }
     .header-button a {
-        border: 1px solid #e4e4e7;
+        border: 1px solid #9B6B9E;
     }
     .header-button .button-icon {
         margin-right: 8px;
@@ -808,7 +740,7 @@ with gr.Blocks(theme=gr.themes.Base(primary_hue="teal")) as demo:
         margin-top: 8px;
     }
     #selected-demo-button {
-        color: #F59E0C;
+        color: #B19CD9;
         text-decoration: underline;
     }
     .demo-button {
@@ -828,17 +760,17 @@ with gr.Blocks(theme=gr.themes.Base(primary_hue="teal")) as demo:
         box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
     }
     #navigation-gallery .gallery-item.selected {
-        border: 3px solid #0D9488;
+        border: 3px solid #9B6B9E;
     }
     /* Upload image styling */
     #upload-image {
         border-radius: 8px;
-        border: 2px dashed #0D9488;
+        border: 2px dashed #9B6B9E;
         padding: 10px;
         transition: all 0.3s ease;
     }
     #upload-image:hover {
-        border-color: #F59E0C;
+        border-color: #9B6B9E;
         box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
     }
     /* Box styling */
@@ -846,8 +778,28 @@ with gr.Blocks(theme=gr.themes.Base(primary_hue="teal")) as demo:
         border-radius: 10px;
         margin-bottom: 20px;
         padding: 15px;
-        background-color: #f8f9fa;
-        border: 1px solid #e9ecef;
+        background-color: #9B6B9E;
+        border: 1px solid #9B6B9E;
+    }
+    /* Start Navigation button styling */
+    button[data-testid="Start Navigation"] {
+        background-color: #B19CD9 !important;
+        border-color: #B19CD9 !important;
+        color: white !important;
+    }
+    button[data-testid="Start Navigation"]:hover {
+        background-color: #9B6B9E !important;
+        border-color: #9B6B9E !important;
+    }
+    /* Override Gradio's primary button color */
+    .gradio-button.primary {
+        background-color: #B19CD9 !important;
+        border-color: #B19CD9 !important;
+        color: white !important;
+    }
+    .gradio-button.primary:hover {
+        background-color: #9B6B9E !important;
+        border-color: #9B6B9E !important;
     }
     </style>
     """
@@ -856,9 +808,9 @@ with gr.Blocks(theme=gr.themes.Base(primary_hue="teal")) as demo:
     demo_idx = gr.State(value=3)
 
     with gr.Sidebar():
-        gr.Markdown("# VMem: Consistent Scene Generation with Surfel Memory of Views", elem_id="page-title")
+        gr.Markdown("# VMem: Consistent Video Scene Generation with Surfel-Indexed View Memory", elem_id="page-title")
         gr.Markdown(
-            "### Official Interactive Demo for [_VMem_](https://arxiv.org/abs/2502.06764)"
+            "### Official Interactive Demo for [_VMem_](https://arxiv.org/abs/2502.06764) that enables interactive consistent video scene generation."
         )
         gr.Markdown("---")
         gr.Markdown("#### Links ↓")
@@ -898,40 +850,22 @@ with gr.Blocks(theme=gr.themes.Base(primary_hue="teal")) as demo:
                     min_width=0,
                 )
         gr.Markdown("---")
-        gr.Markdown("#### Choose a Demo ↓")
-        with gr.Column(elem_classes=["demo-button-column"]):
-            @gr.render(inputs=[demo_idx])
-            def render_demo_tabs(idx):
-                demo_tab_button3 = gr.Button(
-                    "Navigate Image",
-                    size="md", elem_classes=["demo-button"],  **{"elem_id": "selected-demo-button"} if idx == 3 else {}
-                ).click(
-                    fn=lambda: 3,
-                    outputs=demo_idx
-                )
-        gr.Markdown("---")
-        gr.Markdown("#### Troubleshooting ↓")
-        with gr.Group():
-            with gr.Accordion("Error or Unexpected Results?", open=False):
-                gr.Markdown("Please try again after refreshing the page and ensure you do not click the same button multiple times.")
-            with gr.Accordion("Too Slow or No GPU Allocation?", open=False):
-                gr.Markdown(
-                    "Consider running the demo locally (click the dots in the top-right corner). Alternatively, you can subscribe to Hugging Face Pro for an increased GPU quota."
-                )
+        gr.Markdown("This demo interface is adapted from the History-Guided Video Diffusion demo template. We thank the authors for their work.")
+
 
 
-    demo3_stage = gr.State(value="Selection")
-    demo3_selected_index = gr.State(value=None)
-    demo3_current_video = gr.State(value=None)
-    demo3_current_poses = gr.State(value=None)
+    demonstrate_stage = gr.State(value="Selection")
+    demonstrate_selected_index = gr.State(value=None)
+    demonstrate_current_video = gr.State(value=None)
+    demonstrate_current_poses = gr.State(value=None)
 
-    @gr.render(inputs=[demo_idx, demo3_stage, demo3_selected_index])
+    @gr.render(inputs=[demo_idx, demonstrate_stage, demonstrate_selected_index])
     def render_demo(
-        _demo_idx, _demo3_stage, _demo3_selected_index
+        _demo_idx, _demonstrate_stage, _demonstrate_selected_index
     ):
         match _demo_idx:
             case 3:
-                render_demo3(_demo3_stage, _demo3_selected_index, demo3_stage, demo3_selected_index, demo3_current_video, demo3_current_poses)
+                render_demonstrate(_demonstrate_stage, _demonstrate_selected_index, demonstrate_stage, demonstrate_selected_index, demonstrate_current_video, demonstrate_current_poses)
                 
 
 if __name__ == "__main__":