@cornerstonejs/tools 0.56.2 → 0.56.3

package/src/store/removeEnabledElement.ts

@@ -0,0 +1,132 @@
+import { getEnabledElement, Types } from '@cornerstonejs/core';
+import {
+  mouseEventListeners,
+  wheelEventListener,
+  touchEventListeners,
+  keyEventListener,
+} from '../eventListeners';
+import {
+  imageRenderedEventDispatcher,
+  cameraModifiedEventDispatcher,
+  mouseToolEventDispatcher,
+  keyboardToolEventDispatcher,
+  imageSpacingCalibratedEventDispatcher,
+  touchToolEventDispatcher,
+} from '../eventDispatchers';
+// ~~
+
+import filterToolsWithAnnotationsForElement from './filterToolsWithAnnotationsForElement';
+import { state } from './state';
+import getToolsWithModesForElement from '../utilities/getToolsWithModesForElement';
+import { ToolModes } from '../enums';
+import { removeAnnotation } from '../stateManagement';
+import getSynchronizersForViewport from './SynchronizerManager/getSynchronizersForViewport';
+import getToolGroupForViewport from './ToolGroupManager/getToolGroupForViewport';
+import { annotationRenderingEngine } from '../utilities/triggerAnnotationRender';
+
+const VIEWPORT_ELEMENT = 'viewport-element';
+
+function removeEnabledElement(
+  elementDisabledEvt: Types.EventTypes.ElementDisabledEvent
+): void {
+  // Is DOM element
+  const { element, viewportId } = elementDisabledEvt.detail;
+
+  _resetSvgNodeCache(element);
+  _removeSvgNode(element);
+
+  // Remove this element from the annotation rendering engine
+  annotationRenderingEngine.removeViewportElement(viewportId, element);
+
+  // Listeners
+  mouseEventListeners.disable(element);
+  wheelEventListener.disable(element);
+  touchEventListeners.disable(element);
+  keyEventListener.disable(element);
+  // labelmap
+
+  // Dispatchers: renderer
+  imageRenderedEventDispatcher.disable(element);
+  cameraModifiedEventDispatcher.disable(element);
+  imageSpacingCalibratedEventDispatcher.disable(element);
+  // Dispatchers: interaction
+  mouseToolEventDispatcher.disable(element);
+  keyboardToolEventDispatcher.disable(element);
+  touchToolEventDispatcher.disable(element);
+
+  // State
+  // @TODO: We used to "disable" the tool before removal. Should we preserve the hook that would call on tools?
+  _removeViewportFromSynchronizers(element);
+  _removeViewportFromToolGroup(element);
+
+  // _removeAllToolsForElement(canvas)
+  _removeEnabledElement(element);
+}
+
+const _removeViewportFromSynchronizers = (element: HTMLDivElement) => {
+  const enabledElement = getEnabledElement(element);
+
+  const synchronizers = getSynchronizersForViewport(
+    enabledElement.viewportId,
+    enabledElement.renderingEngineId
+  );
+  synchronizers.forEach((sync) => {
+    sync.remove(enabledElement);
+  });
+};
+
+const _removeViewportFromToolGroup = (element: HTMLDivElement) => {
+  const { renderingEngineId, viewportId } = getEnabledElement(element);
+
+  const toolGroup = getToolGroupForViewport(viewportId, renderingEngineId);
+
+  if (toolGroup) {
+    toolGroup.removeViewports(renderingEngineId, viewportId);
+  }
+};
+
+const _removeAllToolsForElement = function (element) {
+  const tools = getToolsWithModesForElement(element, [
+    ToolModes.Active,
+    ToolModes.Passive,
+  ]);
+
+  const toolsWithData = filterToolsWithAnnotationsForElement(element, tools);
+  toolsWithData.forEach(({ annotations }) => {
+    annotations.forEach((annotation) => {
+      removeAnnotation(annotation.annotationUID);
+    });
+  });
+};
+
+function _resetSvgNodeCache(element: HTMLDivElement) {
+  const { viewportUid: viewportId, renderingEngineUid: renderingEngineId } =
+    element.dataset;
+  const elementHash = `${viewportId}:${renderingEngineId}`;
+
+  delete state.svgNodeCache[elementHash];
+}
+
+function _removeSvgNode(element: HTMLDivElement) {
+  const internalViewportNode = element.querySelector(`div.${VIEWPORT_ELEMENT}`);
+  const svgLayer = internalViewportNode.querySelector('svg');
+  if (svgLayer) {
+    internalViewportNode.removeChild(svgLayer);
+  }
+}
+
+/**
+ * @private
+ * @param enabledElement
+ */
+const _removeEnabledElement = function (element: HTMLDivElement) {
+  const foundElementIndex = state.enabledElements.findIndex(
+    (el) => el === element
+  );
+
+  if (foundElementIndex > -1) {
+    state.enabledElements.splice(foundElementIndex, 1);
+  }
+};
+
+export default removeEnabledElement;

package/src/store/state.ts

@@ -0,0 +1,57 @@
+import _cloneDeep from 'lodash.clonedeep';
+
+import { IToolGroup, IToolClassReference } from '../types';
+import Synchronizer from './SynchronizerManager/Synchronizer';
+import svgNodeCache, { resetSvgNodeCache } from './svgNodeCache';
+
+interface ICornerstoneTools3dState {
+  isInteractingWithTool: boolean;
+  isMultiPartToolActive: boolean;
+  tools: Record<
+    string,
+    {
+      toolClass: IToolClassReference;
+    }
+  >;
+  toolGroups: Array<IToolGroup>;
+  synchronizers: Array<Synchronizer>;
+  svgNodeCache: Record<string, unknown>;
+  enabledElements: Array<unknown>;
+  handleRadius: number;
+}
+
+const defaultState: ICornerstoneTools3dState = {
+  isInteractingWithTool: false,
+  isMultiPartToolActive: false,
+  tools: {},
+  toolGroups: [],
+  synchronizers: [],
+  svgNodeCache: svgNodeCache,
+  // Should this be named... canvases?
+  enabledElements: [], // switch to Uids?
+  handleRadius: 6,
+};
+
+let state: ICornerstoneTools3dState = {
+  isInteractingWithTool: false,
+  isMultiPartToolActive: false,
+  tools: {},
+  toolGroups: [],
+  synchronizers: [],
+  svgNodeCache: svgNodeCache,
+  // Should this be named... canvases?
+  enabledElements: [], // switch to Uids?
+  handleRadius: 6,
+};
+
+function resetCornerstoneToolsState(): void {
+  resetSvgNodeCache();
+  state = _cloneDeep(defaultState);
+}
+
+export {
+  ICornerstoneTools3dState,
+  resetCornerstoneToolsState,
+  state,
+  state as default,
+};

package/src/store/svgNodeCache.ts

@@ -0,0 +1,7 @@
+let svgNodeCache = {};
+
+export function resetSvgNodeCache(): void {
+  svgNodeCache = {};
+}
+
+export default svgNodeCache;

package/src/synchronizers/callbacks/areViewportsCoplanar .ts

@@ -0,0 +1,12 @@
+import { vec3 } from 'gl-matrix';
+import { Types } from '@cornerstonejs/core';
+
+export default function areViewportsCoplanar(
+  viewport1: Types.IStackViewport,
+  viewport2: Types.IStackViewport
+): boolean {
+  const { viewPlaneNormal: viewPlaneNormal1 } = viewport1.getCamera();
+  const { viewPlaneNormal: viewPlaneNormal2 } = viewport2.getCamera();
+  const dotProducts = vec3.dot(viewPlaneNormal1, viewPlaneNormal2);
+  return Math.abs(dotProducts) > 0.9;
+}

package/src/synchronizers/callbacks/cameraSyncCallback.ts

@@ -0,0 +1,33 @@
+import { getRenderingEngine, Types } from '@cornerstonejs/core';
+import { Synchronizer } from '../../store';
+
+/**
+ * Synchronizer callback to synchronize the camera by updating all camera
+ * values.  See also zoomPanSyncCallback
+ *
+ * @param synchronizerInstance - The Instance of the Synchronizer
+ * @param sourceViewport - The list of IDs defining the source viewport.
+ * @param targetViewport - The list of IDs defining the target viewport, never
+ *   the same as sourceViewport.
+ * @param cameraModifiedEvent - The CAMERA_MODIFIED event.
+ */
+export default function cameraSyncCallback(
+  synchronizerInstance: Synchronizer,
+  sourceViewport: Types.IViewportId,
+  targetViewport: Types.IViewportId,
+  cameraModifiedEvent: CustomEvent
+): void {
+  const { camera } = cameraModifiedEvent.detail;
+
+  const renderingEngine = getRenderingEngine(targetViewport.renderingEngineId);
+  if (!renderingEngine) {
+    throw new Error(
+      `No RenderingEngine for Id: ${targetViewport.renderingEngineId}`
+    );
+  }
+
+  const tViewport = renderingEngine.getViewport(targetViewport.viewportId);
+
+  tViewport.setCamera(camera);
+  tViewport.render();
+}

package/src/synchronizers/callbacks/stackImageSyncCallback.ts

@@ -0,0 +1,157 @@
+import { vec3 } from 'gl-matrix';
+import {
+  getRenderingEngine,
+  Types,
+  metaData,
+  utilities,
+} from '@cornerstonejs/core';
+import { Synchronizer } from '../../store';
+import { jumpToSlice } from '../../utilities';
+import areViewportsCoplanar from './areViewportsCoplanar ';
+/**
+ * Synchronizer callback to synchronize the source viewport image to the
+ * target viewports closest image in its stack. There are two scenarios
+ *
+ * 1) viewports are in the same frameOfReferenceUID then we can use the
+ * absolute imagePositionPatient for the source viewport's current image
+ * and set the target viewport's image to the closest image in its stack
+ * (which might have different slice thickness so cannot use slice number)
+ *
+ * 2) viewports have different frameOfReferenceUIDs then we look inside the
+ * registrationMetadataProvider to check if there is a corresponding matrix
+ * for mapping between the source and target viewport if so it is used to
+ * and is applied to the imagePositionPatient of the source viewport's to
+ * get the imagePositionPatient of the target viewport's closest image in
+ * its stack.
+ * Note for 2) The consuming apps using Cornerstone3D (OHIF, etc) are responsible
+ * to provide such data in the registrationMetadataProvider. This can be done
+ * by various methods 1) Using spatialRegistrationModule inside dicom 2) assuming
+ * the user has actually manually scrolled the target viewport to the correct
+ * slice before initiating the synchronization 3) using some other method
+ * But overall, the consuming app is responsible for providing the data.
+ *
+ *
+ * @param synchronizerInstance - The Instance of the Synchronizer
+ * @param sourceViewport - The list of IDs defining the source viewport.
+ * @param targetViewport - The list of IDs defining the target viewport, never
+ *   the same as sourceViewport.
+ * @param cameraModifiedEvent - The CAMERA_MODIFIED event.
+ */
+export default async function stackImageSyncCallback(
+  synchronizerInstance: Synchronizer,
+  sourceViewport: Types.IViewportId,
+  targetViewport: Types.IViewportId
+): Promise<void> {
+  const renderingEngine = getRenderingEngine(targetViewport.renderingEngineId);
+  if (!renderingEngine) {
+    throw new Error(
+      `No RenderingEngine for Id: ${targetViewport.renderingEngineId}`
+    );
+  }
+
+  const sViewport = renderingEngine.getViewport(
+    sourceViewport.viewportId
+  ) as Types.IStackViewport;
+
+  const tViewport = renderingEngine.getViewport(
+    targetViewport.viewportId
+  ) as Types.IStackViewport;
+
+  const frameOfReferenceUID1 = sViewport.getFrameOfReferenceUID();
+  const frameOfReferenceUID2 = tViewport.getFrameOfReferenceUID();
+
+  const imageId1 = sViewport.getCurrentImageId();
+  const imagePlaneModule1 = metaData.get('imagePlaneModule', imageId1);
+  const sourceImagePositionPatient = imagePlaneModule1.imagePositionPatient;
+
+  const targetImageIds = tViewport.getImageIds();
+
+  if (!areViewportsCoplanar(sViewport, tViewport)) {
+    return;
+  }
+
+  if (frameOfReferenceUID1 === frameOfReferenceUID2) {
+    // if frames of references are the same we can use the absolute
+    // imagePositionPatient to find the closest image in the target viewport's stack
+    const closestImageIdIndex = _getClosestImageIdIndex(
+      sourceImagePositionPatient,
+      targetImageIds
+    );
+
+    if (
+      closestImageIdIndex.index !== -1 &&
+      tViewport.getCurrentImageIdIndex() !== closestImageIdIndex.index
+    ) {
+      // await tViewport.setImageIdIndex(closestImageIdIndex.index);
+      await jumpToSlice(tViewport.element, {
+        imageIndex: closestImageIdIndex.index,
+      });
+
+      return;
+    }
+  } else {
+    // if the frame of reference is different we need to use the registrationMetadataProvider
+    // and add that to the imagePositionPatient of the source viewport to get the
+    // imagePositionPatient of the target viewport's closest image in its stack
+    const registrationMatrixMat4 =
+      utilities.spatialRegistrationMetadataProvider.get(
+        'spatialRegistrationModule',
+        [targetViewport.viewportId, sourceViewport.viewportId]
+      );
+
+    if (!registrationMatrixMat4) {
+      throw new Error(
+        `No registration matrix found for sourceViewport: ${sourceViewport.viewportId} and targetViewport: ${targetViewport.viewportId}, viewports with different frameOfReferenceUIDs must have a registration matrix in the registrationMetadataProvider. Use calculateViewportsRegistrationMatrix to calculate the matrix.`
+      );
+    }
+
+    // apply the registration matrix to the source viewport's imagePositionPatient
+    // to get the target viewport's imagePositionPatient
+    const targetImagePositionPatientWithRegistrationMatrix = vec3.transformMat4(
+      vec3.create(),
+      sourceImagePositionPatient,
+      registrationMatrixMat4
+    );
+
+    // find the closest image in the target viewport's stack to the
+    // targetImagePositionPatientWithRegistrationMatrix
+    const closestImageIdIndex2 = _getClosestImageIdIndex(
+      targetImagePositionPatientWithRegistrationMatrix,
+      targetImageIds
+    );
+
+    if (
+      closestImageIdIndex2.index !== -1 &&
+      tViewport.getCurrentImageIdIndex() !== closestImageIdIndex2.index
+    ) {
+      await jumpToSlice(tViewport.element, {
+        imageIndex: closestImageIdIndex2.index,
+      });
+    }
+  }
+}
+
+function _getClosestImageIdIndex(targetPoint, imageIds) {
+  // todo: this does not assume orientation yet, but that can be added later
+  return imageIds.reduce(
+    (closestImageIdIndex, imageId, index) => {
+      const { imagePositionPatient } = metaData.get(
+        'imagePlaneModule',
+        imageId
+      );
+      const distance = vec3.distance(imagePositionPatient, targetPoint);
+
+      if (distance < closestImageIdIndex.distance) {
+        return {
+          distance,
+          index,
+        };
+      }
+      return closestImageIdIndex;
+    },
+    {
+      distance: Infinity,
+      index: -1,
+    }
+  );
+}

package/src/synchronizers/callbacks/voiSyncCallback.ts

@@ -0,0 +1,51 @@
+import {
+  getRenderingEngine,
+  StackViewport,
+  Types,
+  VolumeViewport,
+} from '@cornerstonejs/core';
+
+/**
+ * Synchronizer callback to synchronize the voi of volumeActors of identical volumes
+ * in different viewports.
+ *
+ * @param synchronizerInstance - The Instance of the Synchronizer
+ * @param sourceViewport - The list of IDs defining the source viewport.
+ * @param targetViewport - The list of IDs defining the target viewport.
+ * @param voiModifiedEvent - The VOI_MODIFIED event.
+ */
+export default function voiSyncCallback(
+  synchronizerInstance,
+  sourceViewport: Types.IViewportId,
+  targetViewport: Types.IViewportId,
+  voiModifiedEvent: Types.EventTypes.VoiModifiedEvent
+): void {
+  const eventDetail = voiModifiedEvent.detail;
+  const { volumeId, range } = eventDetail;
+
+  const renderingEngine = getRenderingEngine(targetViewport.renderingEngineId);
+  if (!renderingEngine) {
+    throw new Error(
+      `Rendering Engine does not exist: ${targetViewport.renderingEngineId}`
+    );
+  }
+
+  const tViewport = renderingEngine.getViewport(targetViewport.viewportId);
+
+  if (tViewport instanceof VolumeViewport) {
+    tViewport.setProperties(
+      {
+        voiRange: range,
+      },
+      volumeId
+    );
+  } else if (tViewport instanceof StackViewport) {
+    tViewport.setProperties({
+      voiRange: range,
+    });
+  } else {
+    throw new Error('Viewport type not supported.');
+  }
+
+  tViewport.render();
+}

package/src/synchronizers/callbacks/zoomPanSyncCallback.ts

@@ -0,0 +1,43 @@
+import { getRenderingEngine, Types } from '@cornerstonejs/core';
+import { Synchronizer } from '../../store';
+
+/**
+ * Synchronizer callback to synchronize the camera. Synchronization
+ *
+ * targetViewport.options.syncZoom set to false to not sync the zoom
+ * targetViewport.options.syncPan set to false to not sync the pan
+
+ * @param synchronizerInstance - The Instance of the Synchronizer
+ * @param sourceViewport - The list of IDs defining the source viewport.
+ * @param targetViewport - The list of IDs defining the target viewport, different
+ *   from sourceViewport
+ */
+export default function zoomPanSyncCallback(
+  synchronizerInstance: Synchronizer,
+  sourceViewport: Types.IViewportId,
+  targetViewport: Types.IViewportId
+): void {
+  const renderingEngine = getRenderingEngine(targetViewport.renderingEngineId);
+  if (!renderingEngine) {
+    throw new Error(
+      `No RenderingEngine for Id: ${targetViewport.renderingEngineId}`
+    );
+  }
+
+  const options = synchronizerInstance.getOptions(targetViewport.viewportId);
+
+  const tViewport = renderingEngine.getViewport(targetViewport.viewportId);
+  const sViewport = renderingEngine.getViewport(sourceViewport.viewportId);
+
+  if (options?.syncZoom !== false) {
+    const srcZoom = sViewport.getZoom();
+    // Do the zoom first, as the pan is relative to the zoom level
+    tViewport.setZoom(srcZoom);
+  }
+  if (options?.syncPan !== false) {
+    const srcPan = sViewport.getPan();
+    tViewport.setPan(srcPan);
+  }
+
+  tViewport.render();
+}

package/src/synchronizers/index.ts

@@ -0,0 +1,11 @@
+import createCameraPositionSynchronizer from './synchronizers/createCameraPositionSynchronizer';
+import createVOISynchronizer from './synchronizers/createVOISynchronizer';
+import createZoomPanSynchronizer from './synchronizers/createZoomPanSynchronizer';
+import createStackImageSynchronizer from './synchronizers/createStackImageSynchronizer';
+
+export {
+  createCameraPositionSynchronizer,
+  createVOISynchronizer,
+  createZoomPanSynchronizer,
+  createStackImageSynchronizer,
+};

package/src/synchronizers/synchronizers/createCameraPositionSynchronizer.ts

@@ -0,0 +1,25 @@
+import { createSynchronizer } from '../../store/SynchronizerManager';
+import { Enums } from '@cornerstonejs/core';
+import cameraSyncCallback from '../callbacks/cameraSyncCallback';
+import Synchronizer from '../../store/SynchronizerManager/Synchronizer';
+
+const { CAMERA_MODIFIED } = Enums.Events;
+
+/**
+ * A helper that creates a new `Synchronizer` which listens to the `CAMERA_MODIFIED`
+ * rendering event and calls the `cameraSyncCallback`.
+ *
+ * @param synchronizerName - The name of the synchronizer.
+ * @returns A new `Synchronizer` instance.
+ */
+export default function createCameraPositionSynchronizer(
+  synchronizerName: string
+): Synchronizer {
+  const cameraPositionSynchronizer = createSynchronizer(
+    synchronizerName,
+    CAMERA_MODIFIED,
+    cameraSyncCallback
+  );
+
+  return cameraPositionSynchronizer;
+}

package/src/synchronizers/synchronizers/createStackImageSynchronizer.ts

@@ -0,0 +1,25 @@
+import { createSynchronizer } from '../../store/SynchronizerManager';
+import { Enums } from '@cornerstonejs/core';
+import stackImageSyncCallback from '../callbacks/stackImageSyncCallback';
+import Synchronizer from '../../store/SynchronizerManager/Synchronizer';
+
+const { STACK_NEW_IMAGE } = Enums.Events;
+
+/**
+ * A helper that creates a new `Synchronizer` which listens to the `STACK_NEW_IMAGE`
+ * rendering event and calls the `stackImageSyncCallback`.
+ *
+ * @param synchronizerName - The name of the synchronizer.
+ * @returns A new `Synchronizer` instance.
+ */
+export default function createStackImageSynchronizer(
+  synchronizerName: string
+): Synchronizer {
+  const stackImageSynchronizer = createSynchronizer(
+    synchronizerName,
+    STACK_NEW_IMAGE,
+    stackImageSyncCallback
+  );
+
+  return stackImageSynchronizer;
+}

package/src/synchronizers/synchronizers/createVOISynchronizer.ts

@@ -0,0 +1,24 @@
+import { createSynchronizer } from '../../store/SynchronizerManager';
+import { Enums } from '@cornerstonejs/core';
+import voiSyncCallback from '../callbacks/voiSyncCallback';
+import Synchronizer from '../../store/SynchronizerManager/Synchronizer';
+
+/**
+ * A helper that creates a new `Synchronizer`
+ * which listens to the `VOI_MODIFIED` rendering event and calls the `voiSyncCallback`.
+ *
+ * @param synchronizerName - The name of the synchronizer.
+ *
+ * @returns A new `Synchronizer` instance.
+ */
+export default function createVOISynchronizer(
+  synchronizerName: string
+): Synchronizer {
+  const VOISynchronizer = createSynchronizer(
+    synchronizerName,
+    Enums.Events.VOI_MODIFIED,
+    voiSyncCallback
+  );
+
+  return VOISynchronizer;
+}

package/src/synchronizers/synchronizers/createZoomPanSynchronizer.ts

@@ -0,0 +1,25 @@
+import { createSynchronizer } from '../../store/SynchronizerManager';
+import { Enums } from '@cornerstonejs/core';
+import zoomPanSyncCallback from '../callbacks/zoomPanSyncCallback';
+import Synchronizer from '../../store/SynchronizerManager/Synchronizer';
+
+const { CAMERA_MODIFIED } = Enums.Events;
+
+/**
+ * A helper that creates a new `Synchronizer` which listens to the `CAMERA_MODIFIED`
+ * rendering event and calls the `cameraSyncCallback`.
+ *
+ * @param synchronizerName - The name of the synchronizer.
+ * @returns A new `Synchronizer` instance.
+ */
+export default function createZoomPanSynchronizer(
+  synchronizerName: string
+): Synchronizer {
+  const zoomPanSynchronizer = createSynchronizer(
+    synchronizerName,
+    CAMERA_MODIFIED,
+    zoomPanSyncCallback
+  );
+
+  return zoomPanSynchronizer;
+}

package/src/synchronizers/synchronizers/index.ts

@@ -0,0 +1,11 @@
+import createCameraPositionSynchronizer from './createCameraPositionSynchronizer';
+import createVOISynchronizer from './createVOISynchronizer';
+import createZoomPanSynchronizer from './createZoomPanSynchronizer';
+import createStackImageSynchronizer from './createStackImageSynchronizer';
+
+export {
+  createCameraPositionSynchronizer,
+  createVOISynchronizer,
+  createZoomPanSynchronizer,
+  createStackImageSynchronizer,
+};