@cornerstonejs/tools 0.66.6 → 0.67.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cornerstonejs/tools",
-  "version": "0.66.6",
+  "version": "0.67.0",
   "description": "Cornerstone3D Tools",
   "main": "dist/umd/index.js",
   "types": "dist/esm/index.d.ts",
@@ -26,7 +26,7 @@
     "webpack:watch": "webpack --mode development --progress --watch  --config ./.webpack/webpack.dev.js"
   },
   "dependencies": {
-    "@cornerstonejs/core": "^0.45.1",
+    "@cornerstonejs/core": "^0.46.0",
     "lodash.clonedeep": "4.5.0",
     "lodash.get": "^4.4.2"
   },
@@ -49,5 +49,5 @@
     "type": "individual",
     "url": "https://ohif.org/donate"
   },
-  "gitHead": "2a678fa8a71841b0a241357999d737a7b7f98126"
+  "gitHead": "5856c935d5879c1efa3a50930044d6526ed5c2c2"
 }

package/src/tools/annotation/PlanarFreehandROITool.ts

@@ -17,6 +17,7 @@ import {
 } from '../../stateManagement/annotation/annotationState';
 import { polyline } from '../../utilities/math';
 import { filterAnnotationsForDisplay } from '../../utilities/planar';
+import throttle from '../../utilities/throttle';
 import { getViewportIdsWithToolToRender } from '../../utilities/viewportFilters';
 import triggerAnnotationRenderForViewportIds from '../../utilities/triggerAnnotationRenderForViewportIds';
 import registerDrawLoop from './planarFreehandROITool/drawLoop';
@@ -34,13 +35,21 @@ import {
   ToolHandle,
   Annotation,
   Annotations,
+  AnnotationStyle,
   PublicToolProps,
   ToolProps,
   InteractionTypes,
   SVGDrawingHelper,
 } from '../../types';
+import { drawLine, drawCircle, drawLinkedTextBox } from '../../drawingSvg';
 import { PlanarFreehandROIAnnotation } from '../../types/ToolSpecificAnnotationTypes';
+import { getTextBoxCoordsCanvas } from '../../utilities/drawing';
 import { PlanarFreehandROICommonData } from '../../utilities/math/polyline/planarFreehandROIInternalTypes';
+import pointInPolyline from '../../utilities/math/polyline/pointInPolyline';
+import { getIntersectionCoordinatesWithPolyline } from '../../utilities/math/polyline/getIntersectionWithPolyline';
+import pointInShapeCallback from '../../utilities/pointInShapeCallback';
+import { isViewportPreScaled } from '../../utilities/viewport/isViewportPreScaled';
+import { getModalityUnit } from '../../utilities/getModalityUnit';
 
 const { pointCanProjectOnLine } = polyline;
 const { EPSILON } = CONSTANTS;
@@ -135,7 +144,8 @@ class PlanarFreehandROITool extends AnnotationTool {
   private activateOpenContourEndEdit: (
     evt: EventTypes.InteractionEventType,
     annotation: PlanarFreehandROIAnnotation,
-    viewportIdsToRender: string[]
+    viewportIdsToRender: string[],
+    handle: ToolHandle | null
   ) => void;
   private cancelDrawing: (element: HTMLDivElement) => void;
   private cancelClosedContourEdit: (element: HTMLDivElement) => void;
@@ -195,6 +205,7 @@ class PlanarFreehandROITool extends AnnotationTool {
           knotsRatioPercentageOnAdd: 40,
           knotsRatioPercentageOnEdit: 40,
         },
+        calculateStats: false,
       },
     }
   ) {
@@ -208,6 +219,12 @@ class PlanarFreehandROITool extends AnnotationTool {
     registerOpenContourEditLoop(this);
     registerOpenContourEndEditLoop(this);
     registerRenderMethods(this);
+
+    this._throttledCalculateCachedStats = throttle(
+      this._calculateCachedStats,
+      100,
+      { trailing: true }
+    );
   }
 
   /**
@@ -268,6 +285,7 @@ class PlanarFreehandROITool extends AnnotationTool {
         },
         polyline: [<Types.Point3>[...worldPos]], // Polyline coordinates
         label: '',
+        cachedStats: {},
       },
     };
 
@@ -293,7 +311,8 @@ class PlanarFreehandROITool extends AnnotationTool {
    */
   handleSelectedCallback = (
     evt: EventTypes.InteractionEventType,
-    annotation: PlanarFreehandROIAnnotation
+    annotation: PlanarFreehandROIAnnotation,
+    handle: ToolHandle
   ): void => {
     const eventDetail = evt.detail;
     const { element } = eventDetail;
@@ -303,7 +322,12 @@ class PlanarFreehandROITool extends AnnotationTool {
       this.getToolName()
     );
 
-    this.activateOpenContourEndEdit(evt, annotation, viewportIdsToRender);
+    this.activateOpenContourEndEdit(
+      evt,
+      annotation,
+      viewportIdsToRender,
+      handle
+    );
   };
 
   /**
@@ -555,10 +579,12 @@ class PlanarFreehandROITool extends AnnotationTool {
     enabledElement: Types.IEnabledElement,
     svgDrawingHelper: SVGDrawingHelper
   ): boolean => {
-    const renderStatus = false;
-    const { viewport } = enabledElement;
+    let renderStatus = false;
+    const { viewport, renderingEngine } = enabledElement;
     const { element } = viewport;
 
+    const targetId = this.getTargetId(viewport);
+
     let annotations = <PlanarFreehandROIAnnotation[]>(
       getAnnotations(this.getToolName(), element)
     );
@@ -585,50 +611,344 @@ class PlanarFreehandROITool extends AnnotationTool {
       // No annotations are currently being modified, so we can just use the
       // render contour method to render all of them
       annotations.forEach((annotation) => {
-        if (!annotation) return;
         this.renderContour(enabledElement, svgDrawingHelper, annotation);
       });
+    } else {
+      // One of the annotations will need special rendering treatment, render all
+      // other annotations not being interacted with using the standard renderContour
+      // rendering path.
+      const activeAnnotationUID = this.commonData.annotation.annotationUID;
 
-      return renderStatus;
+      annotations.forEach((annotation) => {
+        if (annotation.annotationUID === activeAnnotationUID) {
+          if (isDrawing) {
+            this.renderContourBeingDrawn(
+              enabledElement,
+              svgDrawingHelper,
+              annotation
+            );
+          } else if (isEditingClosed) {
+            this.renderClosedContourBeingEdited(
+              enabledElement,
+              svgDrawingHelper,
+              annotation
+            );
+          } else if (isEditingOpen) {
+            this.renderOpenContourBeingEdited(
+              enabledElement,
+              svgDrawingHelper,
+              annotation
+            );
+          } else {
+            throw new Error(
+              `Unknown ${this.getToolName()} annotation rendering state`
+            );
+          }
+        } else {
+          this.renderContour(enabledElement, svgDrawingHelper, annotation);
+        }
+      });
+
+      // Todo: return boolean flag for each rendering route in the planar tool.
+      renderStatus = true;
     }
 
-    // One of the annotations will need special rendering treatment, render all
-    // other annotations not being interacted with using the standard renderContour
-    // rendering path.
-    const activeAnnotationUID = this.commonData.annotation.annotationUID;
+    if (!this.configuration.calculateStats) return;
 
     annotations.forEach((annotation) => {
-      if (annotation.annotationUID === activeAnnotationUID) {
-        if (isDrawing) {
-          this.renderContourBeingDrawn(
-            enabledElement,
-            svgDrawingHelper,
-            annotation
-          );
-        } else if (isEditingClosed) {
-          this.renderClosedContourBeingEdited(
-            enabledElement,
-            svgDrawingHelper,
-            annotation
-          );
-        } else if (isEditingOpen) {
-          this.renderOpenContourBeingEdited(
-            enabledElement,
-            svgDrawingHelper,
-            annotation
+      const activeAnnotationUID = this.commonData?.annotation.annotationUID;
+      if (
+        annotation.annotationUID === activeAnnotationUID &&
+        !this.commonData?.movingTextBox
+      )
+        return;
+
+      if (!this.commonData?.movingTextBox) {
+        const { data } = annotation;
+        if (
+          !data.cachedStats[targetId] ||
+          data.cachedStats[targetId].areaUnit === undefined
+        ) {
+          data.cachedStats[targetId] = {
+            Modality: null,
+            area: null,
+            max: null,
+            mean: null,
+            stdDev: null,
+            areaUnit: null,
+          };
+
+          this._calculateCachedStats(
+            annotation,
+            viewport,
+            renderingEngine,
+            enabledElement
           );
-        } else {
-          throw new Error(
-            `Unknown ${this.getToolName()} annotation rendering state`
+        } else if (annotation.invalidated) {
+          this._throttledCalculateCachedStats(
+            annotation,
+            viewport,
+            renderingEngine,
+            enabledElement
           );
         }
-      } else {
-        this.renderContour(enabledElement, svgDrawingHelper, annotation);
       }
+
+      this._renderStats(annotation, viewport, enabledElement, svgDrawingHelper);
     });
 
-    // Todo: return boolean flag for each rendering route in the planar tool.
-    return true;
+    return renderStatus;
+  };
+
+  _calculateCachedStats = (
+    annotation,
+    viewport,
+    renderingEngine,
+    enabledElement
+  ) => {
+    const data = annotation.data;
+    const { cachedStats, polyline: points } = data;
+
+    const targetIds = Object.keys(cachedStats);
+
+    for (let i = 0; i < targetIds.length; i++) {
+      const targetId = targetIds[i];
+      const image = this.getTargetIdImage(targetId, renderingEngine);
+
+      // If image does not exists for the targetId, skip. This can be due
+      // to various reasons such as if the target was a volumeViewport, and
+      // the volumeViewport has been decached in the meantime.
+      if (!image) {
+        continue;
+      }
+
+      const { imageData, metadata, hasPixelSpacing } = image;
+      const canvasCoordinates = points.map((p) => viewport.worldToCanvas(p));
+      const area = polyline.calculateAreaOfPoints(canvasCoordinates);
+
+      const worldPosIndex = csUtils.transformWorldToIndex(imageData, points[0]);
+      worldPosIndex[0] = Math.floor(worldPosIndex[0]);
+      worldPosIndex[1] = Math.floor(worldPosIndex[1]);
+      worldPosIndex[2] = Math.floor(worldPosIndex[2]);
+
+      let iMin = worldPosIndex[0];
+      let iMax = worldPosIndex[0];
+
+      let jMin = worldPosIndex[1];
+      let jMax = worldPosIndex[1];
+
+      let kMin = worldPosIndex[2];
+      let kMax = worldPosIndex[2];
+
+      for (let j = 1; j < points.length; j++) {
+        const worldPosIndex = csUtils.transformWorldToIndex(
+          imageData,
+          points[j]
+        );
+        worldPosIndex[0] = Math.floor(worldPosIndex[0]);
+        worldPosIndex[1] = Math.floor(worldPosIndex[1]);
+        worldPosIndex[2] = Math.floor(worldPosIndex[2]);
+        iMin = Math.min(iMin, worldPosIndex[0]);
+        iMax = Math.max(iMax, worldPosIndex[0]);
+
+        jMin = Math.min(jMin, worldPosIndex[1]);
+        jMax = Math.max(jMax, worldPosIndex[1]);
+
+        kMin = Math.min(kMin, worldPosIndex[2]);
+        kMax = Math.max(kMax, worldPosIndex[2]);
+      }
+
+      // Expand bounding box
+      const iDelta = 0.01 * (iMax - iMin);
+      const jDelta = 0.01 * (jMax - jMin);
+      const kDelta = 0.01 * (kMax - kMin);
+
+      iMin = Math.floor(iMin - iDelta);
+      iMax = Math.ceil(iMax + iDelta);
+      jMin = Math.floor(jMin - jDelta);
+      jMax = Math.ceil(jMax + jDelta);
+      kMin = Math.floor(kMin - kDelta);
+      kMax = Math.ceil(kMax + kDelta);
+
+      const boundsIJK = [
+        [iMin, iMax],
+        [jMin, jMax],
+        [kMin, kMax],
+      ] as [Types.Point2, Types.Point2, Types.Point2];
+
+      const worldPosEnd = imageData.indexToWorld([iMax, jMax, kMax]);
+      const canvasPosEnd = viewport.worldToCanvas(worldPosEnd);
+
+      let count = 0;
+      let sum = 0;
+      let sumSquares = 0;
+      let max = -Infinity;
+
+      const statCalculator = ({ value: newValue }) => {
+        if (newValue > max) {
+          max = newValue;
+        }
+
+        sum += newValue;
+        sumSquares += newValue ** 2;
+        count += 1;
+      };
+
+      let curRow = 0;
+      let intersections = [];
+      let intersectionCounter = 0;
+      pointInShapeCallback(
+        imageData,
+        (pointLPS, pointIJK) => {
+          let result = true;
+          const point = viewport.worldToCanvas(pointLPS);
+          if (point[1] != curRow) {
+            intersectionCounter = 0;
+            curRow = point[1];
+            intersections = getIntersectionCoordinatesWithPolyline(
+              canvasCoordinates,
+              point,
+              [canvasPosEnd[0], point[1]]
+            );
+            intersections.sort(
+              (function (index) {
+                return function (a, b) {
+                  return a[index] === b[index]
+                    ? 0
+                    : a[index] < b[index]
+                    ? -1
+                    : 1;
+                };
+              })(0)
+            );
+          }
+          if (intersections.length && point[0] > intersections[0][0]) {
+            intersections.shift();
+            intersectionCounter++;
+          }
+          if (intersectionCounter % 2 === 0) {
+            result = false;
+          }
+          return result;
+        },
+        statCalculator,
+        boundsIJK
+      );
+
+      const mean = sum / count;
+
+      // https://www.strchr.com/standard_deviation_in_one_pass?allcomments=1
+      let stdDev = sumSquares / count - mean ** 2;
+      stdDev = Math.sqrt(stdDev);
+
+      cachedStats[targetId] = {
+        Modality: metadata.Modality,
+        area,
+        mean,
+        max,
+        stdDev,
+        areaUnit: hasPixelSpacing ? 'mm' : 'px',
+      };
+    }
+
+    annotation.invalidated = false;
+
+    return cachedStats;
+  };
+
+  _renderStats = (annotation, viewport, enabledElement, svgDrawingHelper) => {
+    const data = annotation.data;
+    const targetId = this.getTargetId(viewport);
+    const isPreScaled = isViewportPreScaled(viewport, targetId);
+    const isSuvScaled = this.isSuvScaled(
+      viewport,
+      targetId,
+      annotation.metadata.referencedImageId
+    );
+
+    const textLines = this._getTextLines(
+      data,
+      targetId,
+      isPreScaled,
+      isSuvScaled
+    );
+    if (!textLines || textLines.length === 0) return;
+
+    const canvasCoordinates = data.polyline.map((p) =>
+      viewport.worldToCanvas(p)
+    );
+    if (!data.handles.textBox.hasMoved) {
+      const canvasTextBoxCoords = getTextBoxCoordsCanvas(canvasCoordinates);
+
+      data.handles.textBox.worldPosition =
+        viewport.canvasToWorld(canvasTextBoxCoords);
+    }
+
+    const textBoxPosition = viewport.worldToCanvas(
+      data.handles.textBox.worldPosition
+    );
+
+    const styleSpecifier: AnnotationStyle.StyleSpecifier = {
+      toolGroupId: this.toolGroupId,
+      toolName: this.getToolName(),
+      viewportId: enabledElement.viewport.id,
+    };
+
+    const textBoxUID = '1';
+    const boundingBox = drawLinkedTextBox(
+      svgDrawingHelper,
+      annotation.annotationUID ?? '',
+      textBoxUID,
+      textLines,
+      textBoxPosition,
+      canvasCoordinates,
+      {},
+      this.getLinkedTextBoxStyle(styleSpecifier, annotation)
+    );
+
+    const { x: left, y: top, width, height } = boundingBox;
+
+    data.handles.textBox.worldBoundingBox = {
+      topLeft: viewport.canvasToWorld([left, top]),
+      topRight: viewport.canvasToWorld([left + width, top]),
+      bottomLeft: viewport.canvasToWorld([left, top + height]),
+      bottomRight: viewport.canvasToWorld([left + width, top + height]),
+    };
+  };
+
+  _getTextLines = (
+    data,
+    targetId: string,
+    isPreScaled: boolean,
+    isSuvScaled: boolean
+  ): string[] => {
+    const cachedVolumeStats = data.cachedStats[targetId];
+    const { area, mean, stdDev, max, isEmptyArea, Modality, areaUnit } =
+      cachedVolumeStats;
+
+    const textLines: string[] = [];
+    const unit = getModalityUnit(Modality, isPreScaled, isSuvScaled);
+
+    if (area) {
+      const areaLine = isEmptyArea
+        ? `Area: Oblique not supported`
+        : `Area: ${area.toFixed(2)} ${areaUnit}\xb2`;
+      textLines.push(areaLine);
+    }
+
+    if (mean) {
+      textLines.push(`Mean: ${mean.toFixed(2)} ${unit}`);
+    }
+
+    if (max) {
+      textLines.push(`Max: ${max.toFixed(2)} ${unit}`);
+    }
+
+    if (stdDev) {
+      textLines.push(`Std Dev: ${stdDev.toFixed(2)} ${unit}`);
+    }
+
+    return textLines;
   };
 }
 

package/src/tools/annotation/planarFreehandROITool/closedContourEditLoop.ts

@@ -58,6 +58,7 @@ function activateClosedContourEdit(
     spacing,
     xDir,
     yDir,
+    movingTextBox: false,
   };
 
   state.isInteractingWithTool = true;

package/src/tools/annotation/planarFreehandROITool/drawLoop.ts

@@ -57,6 +57,7 @@ function activateDraw(
     spacing,
     xDir,
     yDir,
+    movingTextBox: false,
   };
 
   state.isInteractingWithTool = true;
@@ -98,7 +99,14 @@ function mouseDragDrawCallback(evt: EventTypes.InteractionEventType): void {
   const enabledElement = getEnabledElement(element);
   const { renderingEngine, viewport } = enabledElement;
 
-  const { viewportIdsToRender, xDir, yDir, spacing } = this.commonData;
+  const {
+    annotation,
+    viewportIdsToRender,
+    xDir,
+    yDir,
+    spacing,
+    movingTextBox,
+  } = this.commonData;
   const { polylineIndex, canvasPoints } = this.drawData;
 
   const lastCanvasPoint = canvasPoints[canvasPoints.length - 1];
@@ -117,21 +125,38 @@ function mouseDragDrawCallback(evt: EventTypes.InteractionEventType): void {
     return;
   }
 
-  const crossingIndex = this.findCrossingIndexDuringCreate(evt);
+  if (movingTextBox) {
+    this.isDrawing = false;
+
+    // Drag mode - Move the text boxes world position
+    const { deltaPoints } = eventDetail as EventTypes.MouseDragEventDetail;
+    const worldPosDelta = deltaPoints.world;
+
+    const { textBox } = annotation.data.handles;
+    const { worldPosition } = textBox;
+
+    worldPosition[0] += worldPosDelta[0];
+    worldPosition[1] += worldPosDelta[1];
+    worldPosition[2] += worldPosDelta[2];
 
-  if (crossingIndex !== undefined) {
-    // If we have crossed our drawing line, create a closed contour and then
-    // start an edit.
-    this.applyCreateOnCross(evt, crossingIndex);
+    textBox.hasMoved = true;
   } else {
-    const numPointsAdded = addCanvasPointsToArray(
-      element,
-      canvasPoints,
-      canvasPos,
-      this.commonData
-    );
-
-    this.drawData.polylineIndex = polylineIndex + numPointsAdded;
+    const crossingIndex = this.findCrossingIndexDuringCreate(evt);
+
+    if (crossingIndex !== undefined) {
+      // If we have crossed our drawing line, create a closed contour and then
+      // start an edit.
+      this.applyCreateOnCross(evt, crossingIndex);
+    } else {
+      const numPointsAdded = addCanvasPointsToArray(
+        element,
+        canvasPoints,
+        canvasPos,
+        this.commonData
+      );
+
+      this.drawData.polylineIndex = polylineIndex + numPointsAdded;
+    }
   }
 
   triggerAnnotationRenderForViewportIds(renderingEngine, viewportIdsToRender);

package/src/tools/annotation/planarFreehandROITool/openContourEditLoop.ts

@@ -54,6 +54,7 @@ function activateOpenContourEdit(
     spacing,
     xDir,
     yDir,
+    movingTextBox: false,
   };
 
   state.isInteractingWithTool = true;
@@ -230,7 +231,7 @@ function openContourEditOverwriteEnd(
 
   // Jump to a normal line edit now.
   this.deactivateOpenContourEdit(element);
-  this.activateOpenContourEndEdit(evt, annotation, viewportIdsToRender);
+  this.activateOpenContourEndEdit(evt, annotation, viewportIdsToRender, null);
 }
 
 /**

package/src/tools/annotation/planarFreehandROITool/openContourEndEditLoop.ts

@@ -2,7 +2,12 @@ import { getEnabledElement } from '@cornerstonejs/core';
 import { state } from '../../../store';
 import { Events } from '../../../enums';
 import { hideElementCursor } from '../../../cursors/elementCursor';
-import type { EventTypes, Annotation } from '../../../types';
+import type {
+  EventTypes,
+  Annotation,
+  ToolHandle,
+  TextBoxHandle,
+} from '../../../types';
 import { polyline } from '../../../utilities/math';
 
 const { getSubPixelSpacingAndXYDirections } = polyline;
@@ -14,7 +19,8 @@ const { getSubPixelSpacingAndXYDirections } = polyline;
 function activateOpenContourEndEdit(
   evt: EventTypes.InteractionEventType,
   annotation: Annotation,
-  viewportIdsToRender: string[]
+  viewportIdsToRender: string[],
+  handle: ToolHandle | null
 ): void {
   this.isDrawing = true;
 
@@ -37,6 +43,11 @@ function activateOpenContourEndEdit(
     canvasPoints.reverse();
   }
 
+  let movingTextBox = false;
+  if ((handle as TextBoxHandle).worldPosition) {
+    movingTextBox = true;
+  }
+
   this.drawData = {
     canvasPoints: canvasPoints,
     polylineIndex: canvasPoints.length - 1,
@@ -48,6 +59,7 @@ function activateOpenContourEndEdit(
     spacing,
     xDir,
     yDir,
+    movingTextBox,
   };
 
   state.isInteractingWithTool = true;

package/src/types/ToolSpecificAnnotationTypes.ts

@@ -237,6 +237,7 @@ export interface PlanarFreehandROIAnnotation extends Annotation {
         };
       };
     };
+    cachedStats?: ROICachedStats;
   };
 }