Implement requested changes

- update computed properties for better readability
biigle · Jan 29, 2025 · 97b7239 · 97b7239
1 parent 3cd67f8
commit 97b7239
Show file tree

Hide file tree

Showing 2 changed files with 23 additions and 31 deletions.
diff --git a/resources/assets/js/videos/components/videoScreen.vue b/resources/assets/js/videos/components/videoScreen.vue
@@ -79,14 +79,14 @@
                         <control-button
                             icon="fa-check"
                             title="Finish the point annotation 𝗘𝗻𝘁𝗲𝗿"
-                            :disabled="cantFinishDrawAnnotation || singleAnnotation"
+                            :disabled="disableFinishDrawAnnotation"
                             @click="finishDrawAnnotation"
                             ></control-button>
                         <control-button
                             icon="fa-project-diagram"
                             title="Finish and track the point annotation"
                             v-on:click="finishTrackAnnotation"
-                            :disabled="cantFinishTrackAnnotation || disableJobTracking || singleAnnotation"
+                            :disabled="disableFinishTrackAnnotation"
                             :loading="disableJobTracking"
                             ></control-button>
                 </control-button>
@@ -102,7 +102,7 @@
                         <control-button
                             icon="fa-check"
                             title="Finish the rectangle annotation 𝗘𝗻𝘁𝗲𝗿"
-                            :disabled="cantFinishDrawAnnotation || singleAnnotation"
+                            :disabled="disableFinishDrawAnnotation"
                             @click="finishDrawAnnotation"
                             ></control-button>
                 </control-button>
@@ -118,14 +118,14 @@
                         <control-button
                             icon="fa-check"
                             title="Finish the circle annotation 𝗘𝗻𝘁𝗲𝗿"
-                            :disabled="cantFinishDrawAnnotation || singleAnnotation"
+                            :disabled="disableFinishDrawAnnotation"
                             @click="finishDrawAnnotation"
                             ></control-button>
                         <control-button
                             icon="fa-project-diagram"
                             title="Finish and track the circle annotation"
                             v-on:click="finishTrackAnnotation"
-                            :disabled="cantFinishTrackAnnotation || disableJobTracking || singleAnnotation"
+                            :disabled="disableFinishTrackAnnotation"
                             :loading="disableJobTracking"
                             ></control-button>
                 </control-button>
@@ -141,7 +141,7 @@
                         <control-button
                             icon="fa-check"
                             title="Finish the line annotation 𝗘𝗻𝘁𝗲𝗿"
-                            :disabled="cantFinishDrawAnnotation || singleAnnotation"
+                            :disabled="disableFinishDrawAnnotation"
                             @click="finishDrawAnnotation"
                             ></control-button>
                 </control-button>
@@ -157,7 +157,7 @@
                             v-if="isDrawingPolygon || isUsingPolygonBrush"
                             icon="fa-check"
                             title="Finish the polygon annotation 𝗘𝗻𝘁𝗲𝗿"
-                            :disabled="cantFinishDrawAnnotation || singleAnnotation"
+                            :disabled="disableFinishDrawAnnotation"
                             @click="finishDrawAnnotation"
                             ></control-button>
                         <control-button
@@ -433,6 +433,12 @@ export default {
         jumpForwardMessage() {
             return `Advance video by ${this.jumpStep} s 𝗖𝘁𝗿𝗹+𝗥𝗶𝗴𝗵𝘁 𝗮𝗿𝗿𝗼𝘄`;
         },
+        disableFinishTrackAnnotation() {
+            return this.cantFinishTrackAnnotation || this.disableJobTracking || this.singleAnnotation
+        },
+        disableFinishDrawAnnotation() {
+            return this.cantFinishDrawAnnotation || this.singleAnnotation
+        },
     },
     methods: {
         createMap() {

diff --git a/resources/assets/js/videos/components/videoScreen/drawInteractions.vue b/resources/assets/js/videos/components/videoScreen/drawInteractions.vue
@@ -30,9 +30,12 @@ export default {
             lastDrawnPointTime: 0,
         };
     },
-    props: ({
-        singleAnnotation: Boolean
-    }),
+    props: {
+        singleAnnotation: {
+            type: Boolean,
+            default: false
+        }
+    },
     computed: {
         hasSelectedLabel() {
             return !!this.selectedLabel;
@@ -74,9 +77,6 @@ export default {
         cantFinishTrackAnnotation() {
             return !this.pendingAnnotation.frames || this.pendingAnnotation.frames.length !== 1;
         },
-        singleAnnotationActive() {
-            return this.singleAnnotation;
-        },
     },
     methods: {
         requireSelectedLabel() {
@@ -213,12 +213,11 @@ export default {
             let lastFrame = this.pendingAnnotation.frames[this.pendingAnnotation.frames.length - 1];
 
             if (lastFrame === undefined || lastFrame < this.video.currentTime) {
-                if (this.singleAnnotationActive && this.isPointDoubleClick(e)) { 
+                if (this.singleAnnotation && this.isPointDoubleClick(e)) { 
                     this.pendingAnnotationSource.once('addfeature', function (e) {
                         this.removeFeature(e.feature);
                     });
-                }
-                else {
+                } else {
                     this.pendingAnnotation.frames.push(this.video.currentTime);
                     this.pendingAnnotation.points.push(this.getPointsFromGeometry(e.feature.getGeometry()));
 
@@ -239,7 +238,7 @@ export default {
 
             this.$emit('pending-annotation', this.pendingAnnotation);
 
-            if (this.singleAnnotationActive) {
+            if (this.singleAnnotation) {
                 if (this.isDrawingPoint) {
                     if (this.isPointDoubleClick(e)) {
                         this.resetPendingAnnotation(this.pendingAnnotation.shape);
@@ -248,20 +247,7 @@ export default {
                     this.lastDrawnPointTime = new Date().getTime();
                     this.lastDrawnPoint = e.feature.getGeometry();
                 }
-            this.pendingAnnotationSource.once('addfeature', this.finishDrawAnnotation);
-                /*
-                if (!this.isDrawingPoint) {
-                    this.pendingAnnotationSource.once('addfeature', this.finishDrawAnnotation);
-                }
-                else {
-                    if (this.isPointDoubleClick(e)) {
-                        this.resetPendingAnnotation(this.pendingAnnotation.shape);
-                        return;
-                    }
-                    this.lastDrawnPointTime = new Date().getTime();
-                    this.lastDrawnPoint = e.feature.getGeometry();
-                    this.pendingAnnotationSource.once('addfeature', this.finishDrawAnnotation);
-                } */
+                this.pendingAnnotationSource.once('addfeature', this.finishDrawAnnotation);
             }
         },
         isPointDoubleClick(e) {