Resolve #493 by adding a refreshAnnotation method

Annotations were not updated because the annotation watcher was not triggered by the color change. Add a refreshAnnotation method which replaces the old annotation by the new one in the annotationSource.
biigle · Jul 12, 2023 · 28e448a · 28e448a
1 parent 9761fc3
commit 28e448a
Show file tree

Hide file tree

Showing 2 changed files with 21 additions and 4 deletions.
diff --git a/resources/assets/js/annotations/annotatorContainer.vue b/resources/assets/js/annotations/annotatorContainer.vue
@@ -353,10 +353,10 @@ export default {
         handleDetachAnnotationLabel(annotation, annotationLabel) {
             if (this.isEditor) {
                 if (annotation.labels.length > 1) {
-                    AnnotationsStore.detachLabel(annotation, annotationLabel)
+                    return AnnotationsStore.detachLabel(annotation, annotationLabel)
                         .catch(handleErrorResponse);
                 } else if (confirm('Detaching the last label of an annotation deletes the whole annotation. Do you want to delete the annotation?')) {
-                    this.handleDeleteAnnotation(annotation);
+                    return this.handleDeleteAnnotation(annotation);
                 }
             }
         },
@@ -370,7 +370,7 @@ export default {
             // Mark for deletion so the annotation is immediately removed from
             // the canvas. See https://github.com/biigle/annotations/issues/70
             Vue.set(annotation, 'markedForDeletion', true);
-            AnnotationsStore.delete(annotation)
+            return AnnotationsStore.delete(annotation)
                 .catch(function (response) {
                     annotation.markedForDeletion = false;
                     handleErrorResponse(response);
@@ -443,12 +443,18 @@ export default {
                 this.handleAttachLabel(annotation, label)
                     .then(() => {
                         if (lastLabel) {
-                            this.handleDetachAnnotationLabel(annotation, lastLabel);
+                            this.handleDetachAnnotationLabel(annotation, lastLabel)
+                                .then(() => {
+                                    this.refreshAnnotation(annotation);
+                                });
                         }
                     })
                     .catch(handleErrorResponse);
             }
         },
+        refreshAnnotation(annotation){
+            this.$refs.canvas.refreshAnnotation(annotation);
+        },
         handleAttachAllSelected() {
             this.selectedAnnotations.forEach(this.handleAttachLabel);
         },

diff --git a/resources/assets/js/annotations/components/annotationCanvas.vue b/resources/assets/js/annotations/components/annotationCanvas.vue
@@ -596,6 +596,17 @@ export default {
         },
         updateMousePosition(e) {
             this.mousePosition = e.coordinate;
+        },
+        refreshAnnotation(annotation) {
+            let source = this.annotationSource;
+
+            let newFeature = this.createFeature(annotation);
+            let oldFeature = source.getFeatureById(annotation.id)
+            
+            source.removeFeature(oldFeature);
+            source.addFeature(newFeature);
+            
+        
         },
         refreshAnnotationSource(annotations, source) {
             let annotationsMap = {};