Spaces:
Running
Running
| import streamlit as st | |
| import os | |
| VIDEO_FOLDER = "./src/synthda_falling_realreal/" | |
| # Page layout settings | |
| st.set_page_config(layout="wide", initial_sidebar_state="collapsed") | |
| # Custom styles for centering and reducing video size | |
| st.markdown(""" | |
| <style> | |
| html, body, [class*="css"] { | |
| padding: 0; | |
| margin: 0; | |
| font-size: 14px; | |
| } | |
| .block-container { | |
| padding-top: 1rem; | |
| padding-bottom: 0rem; | |
| } | |
| .video-wrapper { | |
| display: flex; | |
| justify-content: center; | |
| } | |
| video { | |
| width: 100%; | |
| max-width: 300px; /* Shrink video */ | |
| height: auto; | |
| border-radius: 6px; | |
| } | |
| .video-caption { | |
| text-align: center; | |
| font-weight: bold; | |
| margin-bottom: 0.2rem; | |
| } | |
| </style> | |
| """, unsafe_allow_html=True) | |
| # Title and description | |
| st.markdown(""" | |
| <h2 style='text-align: center;'>Project SynthDa</h2> | |
| <h4 style='text-align: center;'>SynthDa Interpolation Demo Viewer</h4> | |
| <p style='text-align: center;'> | |
| AutoSynthDa blends two input motion videos to <strong>generate kinematically coherent, synthetic action videos</strong>.<br> | |
| Use the slider below to explore how the system interpolates motion from one video to another.<br> | |
| <a href="https://github.com/nvidia/synthda" target="_blank">github.com/nvidia/synthda</a> | |
| </p> | |
| """, unsafe_allow_html=True) | |
| # Slider | |
| weight = st.slider("Interpolation Weight (0 = Left Video, 1 = Right Video)", 0.1, 0.9, 0.5, step=0.1) | |
| # Interpolation status | |
| if weight == 0.0: | |
| interp_text = "Showing Input Video 1 (no interpolation)" | |
| elif weight == 1.0: | |
| interp_text = "Showing Input Video 2 (no interpolation)" | |
| else: | |
| w2 = round(1.0 - weight, 1) | |
| interp_text = f"{weight:.1f} from Input 1 + {w2:.1f} from Input 2" | |
| st.markdown(f"<p style='text-align:center;'><strong>{interp_text}</strong></p>", unsafe_allow_html=True) | |
| # Video paths | |
| filename_interp = f"videos_generated_{weight:.1f}.mp4" | |
| video_interp = os.path.join(VIDEO_FOLDER, filename_interp) | |
| video_input1 = os.path.join(VIDEO_FOLDER, "videos_generated_0.0.mp4") | |
| video_input2 = os.path.join(VIDEO_FOLDER, "videos_generated_1.0.mp4") | |
| # 3 videos in row | |
| col1, col2, col3 = st.columns([1, 1, 1]) | |
| with col1: | |
| st.markdown("<div class='video-caption'>Input Video 1</div>", unsafe_allow_html=True) | |
| if os.path.exists(video_input1): | |
| st.markdown(f""" | |
| <div class='video-wrapper'> | |
| <video controls> | |
| <source src="{video_input1}" type="video/mp4"> | |
| </video> | |
| </div> | |
| """, unsafe_allow_html=True) | |
| else: | |
| st.error("Video 1 not found") | |
| with col2: | |
| st.markdown("<div class='video-caption'>Interpolated Video</div>", unsafe_allow_html=True) | |
| if os.path.exists(video_interp): | |
| st.markdown(f""" | |
| <div class='video-wrapper'> | |
| <video controls> | |
| <source src="{video_interp}" type="video/mp4"> | |
| </video> | |
| </div> | |
| """, unsafe_allow_html=True) | |
| else: | |
| st.error("Interpolated video not found") | |
| with col3: | |
| st.markdown("<div class='video-caption'>Input Video 2</div>", unsafe_allow_html=True) | |
| if os.path.exists(video_input2): | |
| st.markdown(f""" | |
| <div class='video-wrapper'> | |
| <video controls> | |
| <source src="{video_input2}" type="video/mp4"> | |
| </video> | |
| </div> | |
| """, unsafe_allow_html=True) | |
| else: | |
| st.error("Video 2 not found") | |