Create app.py

app.py

@@ -0,0 +1,50 @@
+import gradio as gr
+
+
+get_video_data = """async (video, video_data_dummy) => {
+  const videoEl = document.querySelector("#video_in video");
+  if (!videoEl){
+    return [video, {}]
+  }
+  const metadata = {
+    duration: videoEl.duration,
+    currentTime: videoEl.currentTime,
+    isPaused: videoEl.paused,
+    hasEnded: videoEl.ended,
+    volume: videoEl.volume,
+    isMuted: videoEl.muted,
+    playbackRate: videoEl.playbackRate,
+    videoWidth: videoEl.videoWidth,
+    videoHeight: videoEl.videoHeight,
+    readyState: videoEl.readyState,
+    bufferedTimeRanges: Array.from(
+      { length: videoEl.buffered.length },
+      (v, i) => ({
+        start: videoEl.buffered.start(i),
+        end: videoEl.buffered.end(i),
+      })
+    ),
+  };
+  console.log(metadata);
+  return [video, metadata];
+}"""
+
+
+def predict(video, video_data):
+    timestamp = video_data["timestamp"]
+    return video_data
+
+
+with gr.Blocks() as demo:
+    video_data_dummy = gr.JSON({}, visible=False)
+    with gr.Row():
+        with gr.Column():
+            video = gr.Video(elem_id="video_in")
+        with gr.Column():
+            timestamp = gr.JSON()
+    with gr.Row():
+        btn = gr.Button(value="Run")
+    btn.click(
+        predict, inputs=[video, video_data_dummy], outputs=[timestamp], _js=get_video_data
+    )
+demo.launch()