Changeset 35633 for main/trunk

Timestamp:

2021-10-18T21:29:06+13:00 (3 years ago)

Author:

cstephen

Message:

Limit word timing selection by length of audio.
Show time editing boundaries.

Location:

main/trunk/model-interfaces-dev/atea/korero-maori-asr/src/components

Files:

• TranscriptionItemEditor.vue (modified) (1 diff)
• WordTimingSelector.vue (modified) (6 diffs)

main/trunk/model-interfaces-dev/atea/korero-maori-asr/src/components/TranscriptionItemEditor.vue

@@ -21 +21 @@
 
     <word-timing-selector class="word-timing-selector" @wordUpdated="onWordUpdated" v-if="enableEditing"
-        :surroundingWords="surroundingWords" :wordIndex="surroundingWordPrincipleIndex" />
+        :surroundingWords="surroundingWords" :wordIndex="surroundingWordPrincipleIndex" :transcriptionID="transcription.id" />
 </div>
 </template>

main/trunk/model-interfaces-dev/atea/korero-maori-asr/src/components/WordTimingSelector.vue

@@ -1 +1 @@
 <template>
 <div class="word-timing-selector-root">
-    <span>{{ minTimeString }}</span>
+    <span class="boundary-time-string">{{ minTimeString }}</span>
+    <div class="boundary" />
 
     <div class="words-container" v-width="onWordsContainerWidthChanged">
@@ -24 +25 @@
     </div>
 
-    <span>{{ maxTimeString }}</span>
+    <div class="boundary" />
+    <span class="boundary-time-string">{{ maxTimeString }}</span>
 </div>
 </template>
@@ -33 +35 @@
     align-items: flex-end;
     justify-content: center;
-    gap: 1em;
     height: 3em;
 }
@@ -41 +42 @@
     position: relative;
     height: 1.5em;
+}
+
+.boundary {
+    width: 3px;
+    background-color: rgba(var(--bg-color-raw), 0.6);
+    height: 1.5em;
+}
+
+.boundary-time-string {
+    margin: 0 0.5em;
 }
 
@@ -110 +121 @@
     name: "WordTimingSelector",
     props: {
+        transcriptionID: String,
         /** @type {Array<TWord>} */
         surroundingWords: Array,
@@ -169 +181 @@
                 }
 
-                // Gives 0.5s of time to play with while adjusting the last word.
+                // The last word can be adjusted up to the length of the backing audio.
                 if (this.wordIndex === this.surroundingWords.length - 1) {
-                    length += 0.5;
+                    length = this.$store.getters.transcriptionPlaybackLength(this.transcriptionID) - this.surroundingWords[0].startTime;
                 }