add video

.pre-commit-config.yaml

@@ -27,6 +27,6 @@ repos:
     hooks:
         - id: isort
 -   repo: https://github.com/psf/black
-    rev: 22.3.0
+    rev: 23.7.0
     hooks:
     -   id: black

README.md

@@ -19,6 +19,9 @@ doc = html.PlotlyWebsiteBuilder("Evaluation Visualizations")
 fig = go.Figure()
 doc.add_plot("Sample Category", "Sample ID", fig)
 
+# Add a video to the page.
+doc.add_video("Sample Category", "Sample ID", "./path/to/video.mp4")
+
 # Write the site to disk.
 doc.write_site("./path/to/desired/output/directory")
 ```

pyproject.toml

@@ -15,7 +15,7 @@ build-backend = "setuptools.build_meta"
 [project.optional-dependencies]
 develop = [
   "autoflake",
-  "black >= 22.3.0",
+  "black == 23.7.0",
   "isort",
   "jupyterlab",
   "mypy",

src/rpad/visualize_3d/html.py

@@ -13,35 +13,54 @@ class PlotlyWebsiteBuilder:
     def __init__(self, title: str):
         self.title = title
         self.cats: Dict[str, List[Tuple[str, go.Figure]]] = defaultdict(list)
+        self.videos: Dict[str, List[Tuple[str, Union[str, Path]]]] = defaultdict(list)
 
     def add_plot(self, category: str, id: str, plot: go.Figure):
         plot.update_layout(margin=dict(l=5, r=5, t=40, b=5))
         self.cats[category].append((id, plot))
 
+    def add_video(self, category: str, id: str, video_path: Union[str, Path]):
+        self.videos[category].append((id, video_path))
+
     def write_site(self, site_dir: Union[str, Path]):
         os.makedirs(site_dir, exist_ok=True)
 
         # Group all the IDs by category, and then by ID.
         parsed_ids: Dict[str, Dict[str, List]] = {}
+        parsed_videos: Dict[str, Dict[str, List]] = {}
         for cat, plot_list in self.cats.items():
             parsed_ids[cat] = defaultdict(list)
             for id, plot in plot_list:
                 obj_id = id.split("_")[0]
                 parsed_ids[cat][obj_id].append((id, plot))
 
+        for cat, video_list in self.videos.items():
+            parsed_videos[cat] = defaultdict(list)
+            for id, video in video_list:
+                obj_id = id.split("_")[0]
+                parsed_videos[cat][obj_id].append((id, video))
+
         # Create a page for each object, and put all of its articulations on that page.
         for cat, obj_dict in parsed_ids.items():
+            video_dict = parsed_videos[cat]
             for obj_id, plot_list in obj_dict.items():
+                video_list = video_dict[obj_id]
                 sub_doc = dom.document(title=f"{obj_id}: {self.title}")
 
                 with sub_doc.head:
                     dt.script(src="https://cdn.plot.ly/plotly-2.25.0.min.js")
 
                 with sub_doc:
                     with dt.div(id=cat):
-                        dt.h1(f"{id} - {cat}")
+                        dt.h1(f"{obj_id} - {cat}")
                         with dt.table():
-                            for i, (id, plot) in enumerate(plot_list):
+                            for i, ((pid, plot), (vid, video)) in enumerate(
+                                zip(plot_list, video_list)
+                            ):
+                                assert (
+                                    pid == vid
+                                ), f"Video {vid} and image {pid} are from different sample."
+                                id = pid
                                 if i % 3 == 0:
                                     tr = dt.tr()
 
@@ -56,6 +75,15 @@ def write_site(self, site_dir: Union[str, Path]):
                                                     auto_play=False,
                                                 )
                                             )
+                                        # Add a video section
+                                        video_src = video
+                                        with dt.div():
+                                            dt.video(
+                                                src=video_src,
+                                                width="640",
+                                                height="360",
+                                                controls=True,
+                                            )
                 with open(os.path.join(site_dir, f"{obj_id}.html"), "w") as f:
                     f.write(str(sub_doc))
 

tests/html_test.py

@@ -10,11 +10,19 @@ def test_html():
     doc = PlotlyWebsiteBuilder("test_doc")
 
     with tempfile.TemporaryDirectory() as tmpdir:
+        # Make a test video.
+        video_fn = os.path.join(tmpdir, "test", "test.mp4")
+
         for i in range(10):
             fig = px.line(x=["a", "b", "c"], y=[i + 1, i + 3, i + 2], title=f"Plot {i}")
             doc.add_plot("Show", str(i), fig)
+
+            # Add a video.
+            doc.add_video("Show", str(i), "./test.mp4")
         doc.write_site(os.path.join(tmpdir, "test"))
 
+        os.system(f"ffmpeg -f lavfi -i testsrc=size=640x300:rate=30 -t 5 {video_fn}")
+
         # Check that the files were created.
         assert os.path.exists(os.path.join(tmpdir, "test/index.html"))
         for i in range(10):