Add video

README.md

@@ -15,7 +15,7 @@ tags:
   - mcp-in-action-track-consumer
 ---
 
-- Video recordings:
+- Video recordings: https://vimeo.com/1141884335
 - Post to social media:
 - Team usernames: @castlebbs, @stargarnet
 - Sponsor: Nebius Token Factory

app.py

@@ -16,6 +16,7 @@ from dtc_display import DTCDisplay
 from tools import search_youtube_video, decode_vin, hex_to_decimal, calculate_obd_value, combine_bytes
 from prompts import system_prompt
 from hackathon_detail import create_hackathon_detail_tab
+from demo_video import create_demo_video_tab
 from mcp_server_detail import create_mcp_server_tab
 
 # from langchain_anthropic import ChatAnthropic
@@ -596,6 +597,9 @@ with gr.Blocks() as demo:
                                     wrap=True
                                 )
 
+        with gr.Tab("Demo Video"):
+            create_demo_video_tab()
+
         with gr.Tab("Hackathon project detail"):
             create_hackathon_detail_tab()
 

demo_video.py

@@ -0,0 +1,22 @@
+import gradio as gr
+
+def create_demo_video_tab():
+    """Create the content for the Demo Video tab."""
+
+    # Vimeo embed HTML
+    vimeo_html = """
+    <div style="padding:56.25% 0 0 0;position:relative;">
+        <iframe src="https://player.vimeo.com/video/1141884335?badge=0&amp;autopause=0&amp;player_id=0&amp;app_id=58479"
+                frameborder="0"
+                allow="autoplay; fullscreen; picture-in-picture; clipboard-write; encrypted-media; web-share"
+                referrerpolicy="strict-origin-when-cross-origin"
+                style="position:absolute;top:0;left:0;width:100%;height:100%;"
+                title="MCP 1st birthday Hackathon - Car Diagnostic Agent">
+        </iframe>
+    </div>
+    <script src="https://player.vimeo.com/api/player.js"></script>
+    """
+
+    with gr.Column():
+        gr.Markdown("## Demo Video")
+        gr.HTML(vimeo_html)