Integrate video segment labeler. Fix targets being passed to BatchIma…

…geLabeler.
faustomorales · Sep 27, 2023 · b159cf9 · b159cf9
1 parent 2bd15bd
commit b159cf9
Show file tree

Hide file tree

Showing 10 changed files with 223 additions and 55 deletions.
diff --git a/qsl/common.py b/qsl/common.py
@@ -630,7 +630,12 @@ def update(self, reset: bool):
             (
                 base_item.get("labels")
                 or base_item.get("defaults")
-                or ([] if base_item.get("type", "image") == "video" else {})
+                or (
+                    []
+                    if base_item.get("type", "image")
+                    in ("video", "video-segment-pairs")
+                    else {}
+                )
             ),
         )
         sIdx = self.sortedIdxs.index(self.idx)
@@ -687,6 +692,29 @@ def set_urls_and_type(self):
             )
             if self.type == "time-series":
                 self.urls = [self.targets[0]["target"]]
+            elif self.type == "video-segment-pairs":
+                target = self.targets[0]["target"]
+                self.urls = [
+                    {
+                        "video1": {
+                            **target["video1"],
+                            "target": files.build_url(
+                                target["video1"]["target"],
+                                base=self.base,
+                                get_tempdir=self.get_temporary_directory,
+                            ),
+                        },
+                        "video2": {
+                            **target["video2"],
+                            "target": files.build_url(
+                                target["video2"]["target"],
+                                base=self.base,
+                                get_tempdir=self.get_temporary_directory,
+                            ),
+                        },
+                    }
+                ]
+
             elif self.type in ["image-group", "image-stack"]:
                 target = self.targets[0]["target"]
                 self.urls = [

diff --git a/qsl/version.py b/qsl/version.py
@@ -1,2 +1,2 @@
-version_info = (0, 2, 30)
+version_info = (0, 2, 33)
 __version__ = ".".join(map(str, version_info))
diff --git a/qslwidgets/package.json b/qslwidgets/package.json
@@ -1,6 +1,6 @@
 {
   "name": "qslwidgets",
-  "version": "0.2.32",
+  "version": "0.2.33",
   "description": "Widgets for the QSL media labeling package.",
   "keywords": [
     "jupyter",

diff --git a/qslwidgets/src/components/BatchImageLabeler.svelte b/qslwidgets/src/components/BatchImageLabeler.svelte
@@ -15,7 +15,7 @@
   export let labels: Labels,
     config: Config,
     states: BatchEntry[] = [],
-    targets: (string | undefined)[] = [],
+    targets: (string | undefined)[] | undefined = [],
     navigation: boolean = false,
     editableConfig: boolean = false,
     transitioning: boolean = false,
@@ -39,7 +39,7 @@
     })));
   $: targets, labels, draft.reset(labels);
   $: items =
-    targets.length === states.length
+    targets && targets.length === states.length
       ? targets
           .map((target, index) => ({ target, state: states[index], index }))
           .filter((entry) => entry.state.visible)

diff --git a/qslwidgets/src/components/VideoLabeler.svelte b/qslwidgets/src/components/VideoLabeler.svelte
@@ -39,14 +39,10 @@
     paused: true,
     muted: false,
     playhead: 0,
-    t1: 0,
-    t2: undefined,
   } as {
     paused: boolean;
     muted: boolean;
     playhead: number;
-    t1: number;
-    t2: undefined | number;
   };
   $: ({ callbacks: loadCallbacks, state: loadState } = createContentLoader({
     targets: [target],
@@ -63,15 +59,17 @@
   }));
   const synchronize = () => {
     if (playback.paused) {
-      const existing = labels4timestamp(labels, playback.t1);
+      const existing = labels4timestamp(
+        labels,
+        $draft.timestampInfo?.timestamp || 0
+      );
       frame = existing.label;
-      if (!existing.exists) {
-        playback = {
-          ...playback,
-          t2: $loadState.mediaState?.states[0].duration,
-        };
-      }
-      draft.reset(frame.labels);
+      draft.reset(frame.labels, {
+        timestamp: existing.label.timestamp,
+        end: existing.exists
+          ? existing.label.end
+          : $loadState.mediaState?.states[0].duration,
+      });
     } else {
       console.error(
         "synchronize() was called when unpaused, which should not occur."
@@ -89,13 +87,17 @@
   // If the external inputs change ...
   $: target, labels, $loadState, synchronize();
   // If our current timestamp changes.
-  $: if (frame.timestamp !== playback.t1) synchronize();
+  $: if (frame.timestamp !== $draft.timestampInfo?.timestamp) synchronize();
   const save = () => {
-    if (playback.paused && playback.t1 !== undefined) {
+    if (playback.paused && $draft.timestampInfo?.timestamp !== undefined) {
+      // We can't edit start points of labels because moving the start point
+      // results in a reset/history erasure. Is that okay? If not,
+      // we'll need to add a way to differentiate between "move start time"
+      // and "create new label."
       const current = {
         labels: draft.export($loadState.mediaState?.states[0].size),
-        timestamp: playback.t1!,
-        end: playback.t2,
+        timestamp: $draft.timestampInfo.timestamp,
+        end: $draft.timestampInfo.end,
       };
       labels = insertOrAppendByTimestamp(current, labels || []);
       dispatcher("save");
@@ -134,10 +136,14 @@
     mains={[main]}
     secondaries={[mini]}
     bind:playhead={playback.playhead}
-    t1={playback.t1}
-    t2={playback.t2}
+    t1={$draft.timestampInfo?.timestamp || 0}
+    t2={$draft.timestampInfo?.end}
     on:setMarkers={(event) => {
-      playback = { ...playback, ...event.detail };
+      draft.snapshot();
+      draft.set({
+        ...$draft,
+        timestampInfo: { timestamp: event.detail.t1, end: event.detail.t2 },
+      });
     }}
     bind:paused={playback.paused}
     bind:muted={playback.muted}

diff --git a/qslwidgets/src/components/VideoPair.svelte b/qslwidgets/src/components/VideoPair.svelte
@@ -36,8 +36,6 @@
     }
   };
 </script>
-
-{#if timestampInfo}
   <div class="video-pair">
     <div style="--icon-button-size: 2.5rem">
       <IconButton on:click={onClick}>
@@ -53,14 +51,16 @@
     <!-- svelte-ignore a11y-media-has-caption -->
     <VideoWithPlaybar
       target={target.video1.target}
-      t1={timestampInfo.timestamp}
-      t2={timestampInfo.end}
+      t1={timestampInfo?.timestamp}
+      t2={timestampInfo?.end}
       bind:playhead={playbackState.video1.playhead}
       bind:paused={playbackState.video1.paused}
+      on:loaded={(event) => dispatcher("loaded-video1", event.detail)}
       on:setMarkers={(event) => {
         dispatcher("change");
         draft = {
           ...draft,
+          dirty: true,
           timestampInfo: {
             ...draft.timestampInfo,
             timestamp: event.detail.t1,
@@ -72,10 +72,11 @@
     <!-- svelte-ignore a11y-media-has-caption -->
     <VideoWithPlaybar
       target={target.video2.target}
-      t1={timestampInfo.match.timestamp}
-      t2={timestampInfo.match.end}
+      t1={timestampInfo?.match.timestamp}
+      t2={timestampInfo?.match.end}
       bind:playhead={playbackState.video2.playhead}
       bind:paused={playbackState.video2.paused}
+      on:loaded={(event) => dispatcher("loaded-video2", event.detail)}
       on:setMarkers={(event) => {
         if (
           event.detail.t1 !== undefined &&
@@ -86,6 +87,7 @@
           dispatcher("change");
           draft = {
             ...draft,
+            dirty: true,
             timestampInfo: {
               ...draft.timestampInfo,
               match: {
@@ -98,8 +100,6 @@
       }}
     />
   </div>
-{/if}
-
 <style>
   .video-pair {
     display: flex;