refactor(tools): readable visibility handling

Kitware · Sep 15, 2023 · 491babb · 491babb
1 parent 98cf278
commit 491babb
Show file tree

Hide file tree

Showing 2 changed files with 25 additions and 49 deletions.
diff --git a/src/components/tools/rectangle/RectangleWidget2D.vue b/src/components/tools/rectangle/RectangleWidget2D.vue
@@ -11,6 +11,7 @@ import {
   toRefs,
   watch,
   watchEffect,
+  reactive,
 } from 'vue';
 import vtkPlaneManipulator from '@kitware/vtk.js/Widgets/Manipulators/PlaneManipulator';
 import { useCurrentImage } from '@/src/composables/useCurrentImage';
@@ -23,15 +24,12 @@ import vtkRectangleWidget, {
   InteractionState,
 } from '@/src/vtk/RectangleWidget';
 import RectangleSVG2D from '@/src/components/tools/rectangle/RectangleSVG2D.vue';
-import { vtkRulerWidgetPointState } from '@/src/vtk/RulerWidget';
-import { watchOnce } from '@vueuse/core';
 import { RectangleID } from '@/src/types/rectangle';
 import { useRightClickContextMenu } from '@/src/composables/annotationTool';
 
 const useStore = useRectangleStore;
 const vtkWidgetFactory = vtkRectangleWidget;
 type WidgetView = vtkRectangleViewWidget;
-type vtkWidgetPointState = vtkRulerWidgetPointState;
 type ToolID = RectangleID;
 const SVG2DComponent = RectangleSVG2D;
 
@@ -171,33 +169,25 @@ export default defineComponent({
     });
 
     // --- handle pick visibility --- //
-    const usePointVisibility = (
-      pointState: Ref<vtkWidgetPointState | undefined>
-    ) => {
-      const visible = ref(false);
-      const updateVisibility = () => {
-        if (!pointState.value) return;
-        visible.value = pointState.value.getVisible();
-      };
-      onVTKEvent(pointState, 'onModified', () => updateVisibility());
-      watchOnce(pointState, () => updateVisibility());
-      return visible;
-    };
 
-    const firstPointVisible = usePointVisibility(
-      computed(() => widget.value?.getWidgetState().getFirstPoint())
-    );
-    const secondPointVisible = usePointVisibility(
-      computed(() => widget.value?.getWidgetState().getSecondPoint())
-    );
+    const visibleStates = reactive({
+      firstPoint: false,
+      secondPoint: false,
+    });
+
+    const widgetState = widgetFactory.getWidgetState();
+    onVTKEvent(widgetFactory.getWidgetState(), 'onModified', () => {
+      visibleStates.firstPoint = widgetState.getFirstPoint().getVisible();
+      visibleStates.secondPoint = widgetState.getSecondPoint().getVisible();
+    });
 
     return {
       tool,
       firstPoint: computed(() => {
-        return firstPointVisible.value ? tool.value.firstPoint : undefined;
+        return visibleStates.firstPoint ? tool.value.firstPoint : undefined;
       }),
       secondPoint: computed(() => {
-        return secondPointVisible.value ? tool.value.secondPoint : undefined;
+        return visibleStates.secondPoint ? tool.value.secondPoint : undefined;
       }),
     };
   },

diff --git a/src/components/tools/ruler/RulerWidget2D.vue b/src/components/tools/ruler/RulerWidget2D.vue
@@ -2,16 +2,15 @@
 import vtkRulerWidget, {
   InteractionState,
   vtkRulerViewWidget,
-  vtkRulerWidgetPointState,
 } from '@/src/vtk/RulerWidget';
 import vtkWidgetManager from '@kitware/vtk.js/Widgets/Core/WidgetManager';
 import {
+  reactive,
   computed,
   defineComponent,
   onMounted,
   onUnmounted,
   PropType,
-  Ref,
   ref,
   toRefs,
   watch,
@@ -24,7 +23,6 @@ import { LPSAxisDir } from '@/src/types/lps';
 import { useRulerStore } from '@/src/store/tools/rulers';
 import { onVTKEvent } from '@/src/composables/onVTKEvent';
 import RulerSVG2D from '@/src/components/tools/ruler/RulerSVG2D.vue';
-import { watchOnce } from '@vueuse/core';
 import { useRightClickContextMenu } from '@/src/composables/annotationTool';
 
 export default defineComponent({
@@ -162,36 +160,24 @@ export default defineComponent({
 
     // --- handle pick visibility --- //
 
-    const usePointVisibility = (
-      pointState: Ref<vtkRulerWidgetPointState | undefined>
-    ) => {
-      const visible = ref(false);
-      const updateVisibility = () => {
-        if (!pointState.value) return;
-        visible.value = pointState.value.getVisible();
-      };
-
-      onVTKEvent(pointState, 'onModified', () => updateVisibility());
-
-      watchOnce(pointState, () => updateVisibility());
-
-      return visible;
-    };
+    const visibleStates = reactive({
+      firstPoint: false,
+      secondPoint: false,
+    });
 
-    const firstPointVisible = usePointVisibility(
-      computed(() => widget.value?.getWidgetState().getFirstPoint())
-    );
-    const secondPointVisible = usePointVisibility(
-      computed(() => widget.value?.getWidgetState().getSecondPoint())
-    );
+    const widgetState = widgetFactory.getWidgetState();
+    onVTKEvent(widgetFactory.getWidgetState(), 'onModified', () => {
+      visibleStates.firstPoint = widgetState.getFirstPoint().getVisible();
+      visibleStates.secondPoint = widgetState.getSecondPoint().getVisible();
+    });
 
     return {
       ruler,
       firstPoint: computed(() => {
-        return firstPointVisible.value ? ruler.value.firstPoint : undefined;
+        return visibleStates.firstPoint ? ruler.value.firstPoint : undefined;
       }),
       secondPoint: computed(() => {
-        return secondPointVisible.value ? ruler.value.secondPoint : undefined;
+        return visibleStates.secondPoint ? ruler.value.secondPoint : undefined;
       }),
       length: computed(() => rulerStore.lengthByID[ruler.value.id]),
     };