.

app.py

@@ -119,37 +119,41 @@ def create_ui(examples_path: str):
                         gr.Markdown(f"#Summary: {example['analysis']['video_description']}")
                         gr.Markdown(f"#Highlights to search for: {example['analysis']['highlight_types']}")
 
-
+        # Main interface section
         gr.Markdown("## Try It Yourself!")
         with gr.Row():
-            input_video = gr.Video(
-                label="Upload your video (max 20 minutes)",
-                interactive=True
-            )
-        
-        gr.Progress()
-        process_btn = gr.Button("Process Video", variant="primary")
-
-        status = gr.Markdown(visible=True)
-        
-        with gr.Row() as results_row:
-            with gr.Column():
-                video_description = gr.Markdown(visible=False)
-            with gr.Column():
-                highlight_types = gr.Markdown(visible=False)
-        
-        with gr.Row() as output_row:
-            output_video = gr.Video(label="Highlight Video", visible=False)
-            download_btn = gr.Button("Download Highlights", visible=False)
+            # Left column: Upload and Process
+            with gr.Column(scale=1):
+                input_video = gr.Video(
+                    label="Upload your video (max 20 minutes)",
+                    interactive=True
+                )
+                process_btn = gr.Button("Process Video", variant="primary")
+                status = gr.Markdown(visible=True)
+            
+            # Right column: Progress, Results and Analysis
+            with gr.Column(scale=1):
+                progress_bar = gr.Progress(elem_id="progress_bar")
+                
+                # Output video (initially hidden)
+                output_video = gr.Video(
+                    label="Highlight Video",
+                    visible=False,
+                    interactive=False,
+                    downloadable=True  # Enable download button
+                )
+                
+                # Analysis accordion
+                with gr.Accordion("Model chain of thought details", open=True, visible=False) as analysis_accordion:
+                    video_description = gr.Markdown(visible=True)
+                    highlight_types = gr.Markdown(visible=True)
 
         def on_process(video, progress=gr.Progress()):
             if not video:
                 return {
                     status: "Please upload a video",
-                    video_description: gr.update(visible=False),
-                    highlight_types: gr.update(visible=False),
                     output_video: gr.update(visible=False),
-                    download_btn: gr.update(visible=False)
+                    analysis_accordion: gr.update(visible=False),
                 }
             
             status.value = "Processing video..."
@@ -158,33 +162,100 @@ def create_ui(examples_path: str):
             if err:
                 return {
                     status: f"Error: {err}",
-                    video_description: gr.update(visible=False),
-                    highlight_types: gr.update(visible=False),
                     output_video: gr.update(visible=False),
-                    download_btn: gr.update(visible=False)
+                    analysis_accordion: gr.update(visible=False),
                 }
             
+            # Format the analysis text
+            desc = f"#Summary: {desc[:500] + '...' if len(desc) > 500 else desc}"
+            highlights = f"#Highlights to search for: {highlights[:500] + '...' if len(highlights) > 500 else highlights}"
+            
             return {
                 status: "Processing complete!",
-                video_description: gr.update(value=desc, visible=True),
-                highlight_types: gr.update(value=highlights, visible=True),
                 output_video: gr.update(value=output_path, visible=True),
-                download_btn: gr.update(visible=True)
+                analysis_accordion: gr.update(visible=True),
+                video_description: desc,
+                highlight_types: highlights,
             }
 
         process_btn.click(
             on_process,
             inputs=[input_video],
-            outputs=[status, video_description, highlight_types, output_video, download_btn]
-        )
-
-        download_btn.click(
-            lambda x: x,
-            inputs=[output_video],
-            outputs=[output_video]
+            outputs=[
+                status,
+                output_video,
+                analysis_accordion,
+                video_description,
+                highlight_types,
+            ]
         )
 
     return app
+    #     gr.Markdown("## Try It Yourself!")
+    #     with gr.Row():
+    #         input_video = gr.Video(
+    #             label="Upload your video (max 20 minutes)",
+    #             interactive=True
+    #         )
+        
+    #     gr.Progress()
+    #     process_btn = gr.Button("Process Video", variant="primary")
+
+    #     status = gr.Markdown(visible=True)
+        
+    #     with gr.Row() as results_row:
+    #         with gr.Column():
+    #             video_description = gr.Markdown(visible=False)
+    #         with gr.Column():
+    #             highlight_types = gr.Markdown(visible=False)
+        
+    #     with gr.Row() as output_row:
+    #         output_video = gr.Video(label="Highlight Video", visible=False)
+    #         download_btn = gr.Button("Download Highlights", visible=False)
+
+    #     def on_process(video, progress=gr.Progress()):
+    #         if not video:
+    #             return {
+    #                 status: "Please upload a video",
+    #                 video_description: gr.update(visible=False),
+    #                 highlight_types: gr.update(visible=False),
+    #                 output_video: gr.update(visible=False),
+    #                 download_btn: gr.update(visible=False)
+    #             }
+            
+    #         status.value = "Processing video..."
+    #         output_path, desc, highlights, err = process_video(video, progress=progress)
+            
+    #         if err:
+    #             return {
+    #                 status: f"Error: {err}",
+    #                 video_description: gr.update(visible=False),
+    #                 highlight_types: gr.update(visible=False),
+    #                 output_video: gr.update(visible=False),
+    #                 download_btn: gr.update(visible=False)
+    #             }
+            
+    #         return {
+    #             status: "Processing complete!",
+    #             video_description: gr.update(value=desc, visible=True),
+    #             highlight_types: gr.update(value=highlights, visible=True),
+    #             output_video: gr.update(value=output_path, visible=True),
+    #             download_btn: gr.update(visible=True)
+    #         }
+
+    #     process_btn.click(
+    #         on_process,
+    #         inputs=[input_video],
+    #         outputs=[status, video_description, highlight_types, output_video, download_btn]
+    #     )
+
+    #     download_btn.click(
+    #         lambda x: x,
+    #         inputs=[output_video],
+    #         outputs=[output_video]
+    #     )
+
+    # return app
 
 if __name__ == "__main__":
     # Initialize CUDA