Remove 'add stick' and 'remove stick' selection when moving to different image.

src/components/image-dialog/ImageDialog.vue

@@ -171,61 +171,6 @@ export default {
       }
     }
   },
-  methods: {
-    close() {
-      this.$store.dispatch('setShowImageDialog', false)
-    },
-    onToggleShowSticks() {
-      this.showSticks = !this.showSticks
-    },
-    onToggleShowLabels() {
-      this.showLabels = !this.showLabels
-    },
-    onToggleShowMarkers() {
-      this.showMarkers = !this.showMarkers
-    },
-    onRevertChangeToSticks() {
-      this.$emit('revertChangeToSticks')
-      this.$store.dispatch('checkForPendingChanges')
-    },
-    onSelectNewStick(payload) {
-      this.selectLabel = payload
-    },
-    deselectLabel() {
-      this.selectLabel = {
-        id: 0,
-        name: ''
-      }
-    },
-    onAddStick() {
-      const stickId = this.selectLabel.id
-      if (!this.$store.getters.stickIDs.includes(stickId.toString())) {
-        console.log('ImageDialog.onAddStick(): no stick selected => ignoring')
-        return
-      }
-      if (
-        Object.hasOwnProperty.call(
-          this.$store.getters.sticksByImageName(this.cameraID, this.imageName),
-          stickId.toString()
-        )
-      ) {
-        DatasetService.multipostBegin()
-        this.$store.dispatch('setFlagStickVisible', {
-          cameraID: this.cameraID,
-          imageName: this.imageName,
-          stickID: stickId,
-          flagState: true
-        })
-        this.$store.dispatch('setFlagStickCorrectedByUser', {
-          cameraID: this.cameraID,
-          imageName: this.imageName,
-          stickID: stickId,
-          flagState: true
-        })
-        DatasetService.multipostEnd()
-      }
-    }
-  },
   computed: {
     cameraID() {
       return this.$store.getters.activeCamera
@@ -302,6 +247,73 @@ export default {
         .snowHeight(this.cameraID, this.stickID, this.imageName)
         .toFixed(0)
     }
+  },
+  watch: {
+    imageName() {
+      this.addStick = {
+        id: 0,
+        name: ''
+      }
+      this.removeStick = {
+        id: 0,
+        name: ''
+      }
+    }
+  },
+  methods: {
+    close() {
+      this.$store.dispatch('setShowImageDialog', false)
+    },
+    onToggleShowSticks() {
+      this.showSticks = !this.showSticks
+    },
+    onToggleShowLabels() {
+      this.showLabels = !this.showLabels
+    },
+    onToggleShowMarkers() {
+      this.showMarkers = !this.showMarkers
+    },
+    onRevertChangeToSticks() {
+      this.$emit('revertChangeToSticks')
+      this.$store.dispatch('checkForPendingChanges')
+    },
+    onSelectNewStick(payload) {
+      this.selectLabel = payload
+    },
+    deselectLabel() {
+      this.selectLabel = {
+        id: 0,
+        name: ''
+      }
+    },
+    onAddStick() {
+      const stickId = this.selectLabel.id
+      if (!this.$store.getters.stickIDs.includes(stickId.toString())) {
+        console.log('ImageDialog.onAddStick(): no stick selected => ignoring')
+        return
+      }
+      if (
+        Object.hasOwnProperty.call(
+          this.$store.getters.sticksByImageName(this.cameraID, this.imageName),
+          stickId.toString()
+        )
+      ) {
+        DatasetService.multipostBegin()
+        this.$store.dispatch('setFlagStickVisible', {
+          cameraID: this.cameraID,
+          imageName: this.imageName,
+          stickID: stickId,
+          flagState: true
+        })
+        this.$store.dispatch('setFlagStickCorrectedByUser', {
+          cameraID: this.cameraID,
+          imageName: this.imageName,
+          stickID: stickId,
+          flagState: true
+        })
+        DatasetService.multipostEnd()
+      }
+    }
   }
 }
 </script>