@cornerstonejs/adapters 1.55.0 → 1.56.0

package/dist/adapters.es.js

@@ -38700,6 +38700,9 @@ function isValidVolume(imageIds) {
 
 function updateVTKImageDataWithCornerstoneImage(sourceImageData, image) {
   const pixelData = image.getPixelData();
+  if (!sourceImageData.getPointData) {
+    return;
+  }
   const scalarData = sourceImageData.getPointData().getScalars().getData();
   if (image.color && image.rgba) {
     const newPixelData = new Uint8Array(image.columns * image.rows * 3);
@@ -40744,12 +40747,12 @@ class Viewport {
       return;
     }
     const renderer = this.getRenderer();
-    renderer.addActor(actor);
+    renderer?.addActor(actor);
     this._actors.set(actorUID, Object.assign({}, actorEntry));
     this.updateCameraClippingPlanesAndRange();
   }
   removeAllActors() {
-    this.getRenderer().removeAllViewProps();
+    this.getRenderer()?.removeAllViewProps();
     this._actors = new Map();
     return;
   }
@@ -42155,10 +42158,213 @@ async function convertVolumeToStackViewport({
   return stackViewport;
 }
 
+class RLEVoxelMap {
+  constructor(width, height, depth = 1) {
+    this.rows = new Map();
+    this.height = 1;
+    this.width = 1;
+    this.depth = 1;
+    this.jMultiple = 1;
+    this.kMultiple = 1;
+    this.numComps = 1;
+    this.defaultValue = 0;
+    this.pixelDataConstructor = Uint8Array;
+    this.get = index => {
+      const i = index % this.jMultiple;
+      const j = (index - i) / this.jMultiple;
+      const rle = this.getRLE(i, j);
+      return rle?.value || this.defaultValue;
+    };
+    this.getRun = (j, k) => {
+      const runIndex = j + k * this.height;
+      return this.rows.get(runIndex);
+    };
+    this.set = (index, value) => {
+      if (value === undefined) {
+        throw new Error(`Can't set undefined at ${index % this.width}`);
+      }
+      const i = index % this.width;
+      const j = (index - i) / this.width;
+      const row = this.rows.get(j);
+      if (!row) {
+        this.rows.set(j, [{
+          start: i,
+          end: i + 1,
+          value
+        }]);
+        return;
+      }
+      const rleIndex = this.findIndex(row, i);
+      const rle1 = row[rleIndex];
+      const rle0 = row[rleIndex - 1];
+      if (!rle1) {
+        if (!rle0 || rle0.value !== value || rle0.end !== i) {
+          row[rleIndex] = {
+            start: i,
+            end: i + 1,
+            value
+          };
+          return;
+        }
+        rle0.end++;
+        return;
+      }
+      const {
+        start,
+        end,
+        value: oldValue
+      } = rle1;
+      if (value === oldValue && i >= start) {
+        return;
+      }
+      const rleInsert = {
+        start: i,
+        end: i + 1,
+        value
+      };
+      const isAfter = i > start;
+      const insertIndex = isAfter ? rleIndex + 1 : rleIndex;
+      const rlePrev = isAfter ? rle1 : rle0;
+      let rleNext = isAfter ? row[rleIndex + 1] : rle1;
+      if (rlePrev?.value === value && rlePrev?.end === i) {
+        rlePrev.end++;
+        if (rleNext?.value === value && rleNext.start === i + 1) {
+          rlePrev.end = rleNext.end;
+          row.splice(rleIndex, 1);
+        } else if (rleNext?.start === i) {
+          rleNext.start++;
+          if (rleNext.start === rleNext.end) {
+            row.splice(rleIndex, 1);
+            rleNext = row[rleIndex];
+            if (rleNext?.start === i + 1 && rleNext.value === value) {
+              rlePrev.end = rleNext.end;
+              row.splice(rleIndex, 1);
+            }
+          }
+        }
+        return;
+      }
+      if (rleNext?.value === value && rleNext.start === i + 1) {
+        rleNext.start--;
+        if (rlePrev?.end > i) {
+          rlePrev.end = i;
+          if (rlePrev.end === rlePrev.start) {
+            row.splice(rleIndex, 1);
+          }
+        }
+        return;
+      }
+      if (rleNext?.start === i && rleNext.end === i + 1) {
+        rleNext.value = value;
+        const nextnext = row[rleIndex + 1];
+        if (nextnext?.start == i + 1 && nextnext.value === value) {
+          row.splice(rleIndex + 1, 1);
+          rleNext.end = nextnext.end;
+        }
+        return;
+      }
+      if (i === rleNext?.start) {
+        rleNext.start++;
+      }
+      if (isAfter && end > i + 1) {
+        row.splice(insertIndex, 0, rleInsert, {
+          start: i + 1,
+          end: rlePrev.end,
+          value: rlePrev.value
+        });
+      } else {
+        row.splice(insertIndex, 0, rleInsert);
+      }
+      if (rlePrev?.end > i) {
+        rlePrev.end = i;
+      }
+    };
+    this.width = width;
+    this.height = height;
+    this.depth = depth;
+    this.jMultiple = width;
+    this.kMultiple = this.jMultiple * height;
+  }
+  getRLE(i, j, k = 0) {
+    const row = this.rows.get(j + k * this.height);
+    if (!row) {
+      return;
+    }
+    const index = this.findIndex(row, i);
+    const rle = row[index];
+    return i >= rle?.start ? rle : undefined;
+  }
+  findIndex(row, i) {
+    for (let index = 0; index < row.length; index++) {
+      const {
+        end: iEnd
+      } = row[index];
+      if (i < iEnd) {
+        return index;
+      }
+    }
+    return row.length;
+  }
+  clear() {
+    this.rows.clear();
+  }
+  keys() {
+    return [...this.rows.keys()];
+  }
+  getPixelData(k = 0, pixelData) {
+    if (!pixelData) {
+      pixelData = new this.pixelDataConstructor(this.width * this.height * this.numComps);
+    } else {
+      pixelData.fill(0);
+    }
+    const {
+      width,
+      height,
+      numComps
+    } = this;
+    for (let j = 0; j < height; j++) {
+      const row = this.getRun(j, k);
+      if (!row) {
+        continue;
+      }
+      if (numComps === 1) {
+        for (const rle of row) {
+          const rowOffset = j * width;
+          const {
+            start,
+            end,
+            value
+          } = rle;
+          for (let i = start; i < end; i++) {
+            pixelData[rowOffset + i] = value;
+          }
+        }
+      } else {
+        for (const rle of row) {
+          const rowOffset = j * width * numComps;
+          const {
+            start,
+            end,
+            value
+          } = rle;
+          for (let i = start; i < end; i += numComps) {
+            for (let comp = 0; comp < numComps; comp++) {
+              pixelData[rowOffset + i + comp] = value[comp];
+            }
+          }
+        }
+      }
+    }
+    return pixelData;
+  }
+}
+
+const DEFAULT_RLE_SIZE = 5 * 1024;
 class VoxelManager {
   constructor(dimensions, _get, _set) {
     this.modifiedSlices = new Set();
     this.boundsIJK = [[Infinity, -Infinity], [Infinity, -Infinity], [Infinity, -Infinity]];
+    this.numComps = 1;
     this.getAtIJK = (i, j, k) => {
       const index = i + j * this.width + k * this.frameSize;
       return this._get(index);
@@ -42276,10 +42482,38 @@ class VoxelManager {
     bounds[2][0] = Math.min(point[2], bounds[2][0]);
     bounds[2][1] = Math.max(point[2], bounds[2][1]);
   }
-  static createVolumeVoxelManager(dimensions, scalarData) {
+  static createRGBVolumeVoxelManager(dimensions, scalarData, numComponents) {
+    const voxels = new VoxelManager(dimensions, index => {
+      index *= numComponents;
+      return [scalarData[index++], scalarData[index++], scalarData[index++]];
+    }, (index, v) => {
+      index *= 3;
+      const isChanged = !isEqual$2(scalarData[index], v);
+      scalarData[index++] = v[0];
+      scalarData[index++] = v[1];
+      scalarData[index++] = v[2];
+      return isChanged;
+    });
+    voxels.numComps = numComponents;
+    voxels.scalarData = scalarData;
+    return voxels;
+  }
+  static createVolumeVoxelManager(dimensions, scalarData, numComponents = 0) {
     if (dimensions.length !== 3) {
       throw new Error('Dimensions must be provided as [number, number, number] for [width, height, depth]');
     }
+    if (!numComponents) {
+      numComponents = scalarData.length / dimensions[0] / dimensions[1] / dimensions[2];
+      if (numComponents > 4 || numComponents < 1 || numComponents === 2) {
+        throw new Error(`Number of components ${numComponents} must be 1, 3 or 4`);
+      }
+    }
+    if (numComponents > 1) {
+      return VoxelManager.createRGBVolumeVoxelManager(dimensions, scalarData, numComponents);
+    }
+    return VoxelManager.createNumberVolumeVoxelManager(dimensions, scalarData);
+  }
+  static createNumberVolumeVoxelManager(dimensions, scalarData) {
     const voxels = new VoxelManager(dimensions, index => scalarData[index], (index, v) => {
       const isChanged = scalarData[index] !== v;
       scalarData[index] = v;
@@ -42316,6 +42550,44 @@ class VoxelManager {
     voxelManager.sourceVoxelManager = sourceVoxelManager;
     return voxelManager;
   }
+  static createLazyVoxelManager(dimensions, planeFactory) {
+    const map = new Map();
+    const [width, height, depth] = dimensions;
+    const planeSize = width * height;
+    const voxelManager = new VoxelManager(dimensions, index => map.get(Math.floor(index / planeSize))?.[index % planeSize], (index, v) => {
+      const k = Math.floor(index / planeSize);
+      let layer = map.get(k);
+      if (!layer) {
+        layer = planeFactory(width, height);
+        map.set(k, layer);
+      }
+      layer[index % planeSize] = v;
+    });
+    voxelManager.map = map;
+    return voxelManager;
+  }
+  static createRLEVoxelManager(dimensions) {
+    const [width, height, depth] = dimensions;
+    const map = new RLEVoxelMap(width, height, depth);
+    const voxelManager = new VoxelManager(dimensions, index => map.get(index), (index, v) => map.set(index, v));
+    voxelManager.map = map;
+    voxelManager.getPixelData = map.getPixelData.bind(map);
+    return voxelManager;
+  }
+  static addInstanceToImage(image) {
+    const {
+      width,
+      height
+    } = image;
+    const scalarData = image.getPixelData();
+    if (scalarData?.length >= width * height) {
+      image.voxelManager = VoxelManager.createVolumeVoxelManager([width, height, 1], scalarData);
+      return;
+    }
+    image.voxelManager = VoxelManager.createRLEVoxelManager([width, height, 1]);
+    image.getPixelData = image.voxelManager.getPixelData;
+    image.sizeInBytes = DEFAULT_RLE_SIZE;
+  }
 }
 
 function roundNumber(value, precision = 2) {
@@ -46005,6 +46277,218 @@ class VolumeViewport3D extends BaseVolumeViewport$1 {
 }
 var VolumeViewport3D$1 = VolumeViewport3D;
 
+class CanvasProperties {
+  constructor(actor) {
+    this.opacity = 0.4;
+    this.outlineOpacity = 0.4;
+    this.transferFunction = [];
+    this.actor = actor;
+  }
+  setRGBTransferFunction(index, cfun) {
+    this.transferFunction[index] = cfun;
+  }
+  setScalarOpacity(opacity) {}
+  setInterpolationTypeToNearest() {}
+  setUseLabelOutline() {}
+  setLabelOutlineOpacity(opacity) {
+    this.outlineOpacity = opacity;
+  }
+  setLabelOutlineThickness() {}
+  getColor(index) {
+    const cfun = this.transferFunction[0];
+    const r = cfun.getRedValue(index);
+    const g = cfun.getGreenValue(index);
+    const b = cfun.getBlueValue(index);
+    return [r, g, b, this.opacity];
+  }
+}
+
+class CanvasMapper {
+  constructor(actor) {
+    this.actor = actor;
+  }
+  getInputData() {
+    return this.actor.getImage();
+  }
+}
+
+class CanvasActor {
+  constructor(viewport, derivedImage) {
+    this.canvasProperties = new CanvasProperties(this);
+    this.visibility = false;
+    this.mapper = new CanvasMapper(this);
+    this.className = 'CanvasActor';
+    this.derivedImage = derivedImage;
+    this.viewport = viewport;
+  }
+  renderRLE(viewport, context, voxelManager) {
+    const {
+      width,
+      height
+    } = this.image;
+    let {
+      canvas
+    } = this;
+    if (!canvas || canvas.width !== width || canvas.height !== height) {
+      this.canvas = canvas = new window.OffscreenCanvas(width, height);
+    }
+    const localContext = canvas.getContext('2d');
+    const imageData = localContext.createImageData(width, height);
+    const {
+      data: imageArray
+    } = imageData;
+    imageArray.fill(0);
+    const {
+      map
+    } = voxelManager;
+    let dirtyX = Infinity;
+    let dirtyY = Infinity;
+    let dirtyX2 = -Infinity;
+    let dirtyY2 = -Infinity;
+    for (let y = 0; y < height; y++) {
+      const row = map.getRun(y, 0);
+      if (!row) {
+        continue;
+      }
+      dirtyY = Math.min(dirtyY, y);
+      dirtyY2 = Math.max(dirtyY2, y);
+      const baseOffset = y * width << 2;
+      let indicesToDelete;
+      for (const run of row) {
+        const {
+          start: start,
+          end,
+          value: segmentIndex
+        } = run;
+        if (segmentIndex === 0) {
+          indicesToDelete ||= [];
+          indicesToDelete.push(row.indexOf(run));
+          continue;
+        }
+        dirtyX = Math.min(dirtyX, start);
+        dirtyX2 = Math.max(dirtyX2, end);
+        const rgb = this.canvasProperties.getColor(segmentIndex).map(v => v * 255);
+        let startOffset = baseOffset + (start << 2);
+        for (let i = start; i < end; i++) {
+          imageArray[startOffset++] = rgb[0];
+          imageArray[startOffset++] = rgb[1];
+          imageArray[startOffset++] = rgb[2];
+          imageArray[startOffset++] = rgb[3];
+        }
+      }
+    }
+    if (dirtyX > width) {
+      return;
+    }
+    const dirtyWidth = dirtyX2 - dirtyX;
+    const dirtyHeight = dirtyY2 - dirtyY;
+    localContext.putImageData(imageData, 0, 0, dirtyX, dirtyY, dirtyWidth, dirtyHeight);
+    context.drawImage(canvas, dirtyX, dirtyY, dirtyWidth, dirtyHeight, dirtyX, dirtyY, dirtyWidth, dirtyHeight);
+  }
+  render(viewport, context) {
+    if (!this.visibility) {
+      return;
+    }
+    const image = this.image || this.getImage();
+    const {
+      width,
+      height
+    } = image;
+    const data = image.getScalarData();
+    if (!data) {
+      return;
+    }
+    const {
+      voxelManager
+    } = image;
+    if (voxelManager) {
+      if (voxelManager.map.getRun) {
+        return this.renderRLE(viewport, context, voxelManager);
+      }
+    }
+    let {
+      canvas
+    } = this;
+    if (!canvas || canvas.width !== width || canvas.height !== height) {
+      this.canvas = canvas = new window.OffscreenCanvas(width, height);
+    }
+    const localContext = canvas.getContext('2d');
+    const imageData = localContext.createImageData(width, height);
+    const {
+      data: imageArray
+    } = imageData;
+    let offset = 0;
+    let destOffset = 0;
+    let dirtyX = Infinity;
+    let dirtyY = Infinity;
+    let dirtyX2 = -Infinity;
+    let dirtyY2 = -Infinity;
+    for (let y = 0; y < height; y++) {
+      for (let x = 0; x < width; x++) {
+        const segmentIndex = data[offset++];
+        if (segmentIndex) {
+          dirtyX = Math.min(x, dirtyX);
+          dirtyY = Math.min(y, dirtyY);
+          dirtyX2 = Math.max(x, dirtyX2);
+          dirtyY2 = Math.max(y, dirtyY2);
+          const rgb = this.canvasProperties.getColor(segmentIndex);
+          imageArray[destOffset] = rgb[0] * 255;
+          imageArray[destOffset + 1] = rgb[1] * 255;
+          imageArray[destOffset + 2] = rgb[2] * 255;
+          imageArray[destOffset + 3] = 127;
+        }
+        destOffset += 4;
+      }
+    }
+    if (dirtyX > width) {
+      return;
+    }
+    const dirtyWidth = dirtyX2 - dirtyX + 1;
+    const dirtyHeight = dirtyY2 - dirtyY + 1;
+    localContext.putImageData(imageData, 0, 0, dirtyX, dirtyY, dirtyWidth, dirtyHeight);
+    context.drawImage(canvas, dirtyX, dirtyY, dirtyWidth, dirtyHeight, dirtyX, dirtyY, dirtyWidth, dirtyHeight);
+  }
+  getClassName() {
+    return this.className;
+  }
+  getProperty() {
+    return this.canvasProperties;
+  }
+  setVisibility(visibility) {
+    this.visibility = visibility;
+  }
+  getMapper() {
+    return this.mapper;
+  }
+  isA(actorType) {
+    return actorType === this.className;
+  }
+  getImage() {
+    if (this.image) {
+      return this.image;
+    }
+    this.image = {
+      ...this.derivedImage
+    };
+    const imageData = this.viewport.getImageData();
+    Object.assign(this.image, {
+      worldToIndex: worldPos => imageData.imageData.worldToIndex(worldPos),
+      indexToWorld: index => imageData.imageData.indexToWorld(index),
+      getDimensions: () => imageData.dimensions,
+      getScalarData: () => this.derivedImage?.getPixelData(),
+      getDirection: () => imageData.direction,
+      getSpacing: () => imageData.spacing,
+      setOrigin: () => null,
+      setDerivedImage: image => {
+        this.derivedImage = image;
+        this.image = null;
+      },
+      modified: () => null
+    });
+    return this.image;
+  }
+}
+
 class VideoViewport extends Viewport$1 {
   constructor(props) {
     super({
@@ -46102,8 +46586,11 @@ class VideoViewport extends Viewport$1 {
       const transformationMatrix = transform.getMatrix();
       this.canvasContext.transform(transformationMatrix[0], transformationMatrix[1], transformationMatrix[2], transformationMatrix[3], transformationMatrix[4], transformationMatrix[5]);
       this.canvasContext.drawImage(this.videoElement, 0, 0, this.videoWidth, this.videoHeight);
+      for (const actor of this.getActors()) {
+        actor.actor.render(this, this.canvasContext);
+      }
       this.canvasContext.resetTransform();
-      triggerEvent(this.element, EVENTS.IMAGE_RENDERED, {
+      triggerEvent(this.element, EVENTS.STACK_NEW_IMAGE, {
         element: this.element,
         viewportId: this.id,
         viewport: this,
@@ -46157,8 +46644,9 @@ class VideoViewport extends Viewport$1 {
     this.removeEventListeners();
     this.videoElement.remove();
   }
-  _getImageDataMetadata() {
-    const imagePlaneModule = getMetaData(MetadataModules$1.IMAGE_PLANE, this.imageId);
+  getImageDataMetadata(image) {
+    const imageId = typeof image === 'string' ? image : image.imageId;
+    const imagePlaneModule = getMetaData(MetadataModules$1.IMAGE_PLANE, imageId);
     let rowCosines = imagePlaneModule.rowCosines;
     let columnCosines = imagePlaneModule.columnCosines;
     if (rowCosines == null || columnCosines == null) {
@@ -46171,8 +46659,6 @@ class VideoViewport extends Viewport$1 {
       rows,
       columns
     } = imagePlaneModule;
-    this.videoWidth = columns;
-    this.videoHeight = rows;
     const scanAxisNormal = vec3.create();
     vec3.cross(scanAxisNormal, rowCosineVec, colCosineVec);
     let origin = imagePlaneModule.imagePositionPatient;
@@ -46190,6 +46676,8 @@ class VideoViewport extends Viewport$1 {
       bitsAllocated: 8,
       numComps: 3,
       origin,
+      rows,
+      columns,
       direction: [...rowCosineVec, ...colCosineVec, ...scanAxisNormal],
       dimensions: [xVoxels, yVoxels, zVoxels],
       spacing: [xSpacing, ySpacing, zSpacing],
@@ -46205,7 +46693,7 @@ class VideoViewport extends Viewport$1 {
     } = getMetaData(MetadataModules$1.IMAGE_URL, imageId);
     const generalSeries = getMetaData(MetadataModules$1.GENERAL_SERIES, imageId);
     this.modality = generalSeries?.Modality;
-    this.metadata = this._getImageDataMetadata();
+    this.metadata = this.getImageDataMetadata(imageId);
     return this.setVideoURL(rendered).then(() => {
       let {
         cineRate,
@@ -46221,10 +46709,13 @@ class VideoViewport extends Viewport$1 {
       this.numberOfFrames = numberOfFrames;
       this.setFrameRange([1, numberOfFrames]);
       this.play();
-      window.setTimeout(() => {
-        this.pause();
-        this.setFrameNumber(frameNumber || 1);
-      }, 50);
+      return new Promise(resolve => {
+        window.setTimeout(() => {
+          this.pause();
+          this.setFrameNumber(frameNumber || 1);
+          resolve(this);
+        }, 100);
+      });
     });
   }
   async setVideoURL(videoURL) {
@@ -46241,6 +46732,14 @@ class VideoViewport extends Viewport$1 {
       this.videoElement.addEventListener('loadedmetadata', loadedMetadataEventHandler);
     });
   }
+  getImageIds() {
+    const imageIds = new Array(this.numberOfFrames);
+    const baseImageId = this.imageId.replace(/[0-9]+$/, '');
+    for (let i = 0; i < this.numberOfFrames; i++) {
+      imageIds[i] = `${baseImageId}${i + 1}`;
+    }
+    return imageIds;
+  }
   togglePlayPause() {
     if (this.isPlaying) {
       this.pause();
@@ -46369,16 +46868,19 @@ class VideoViewport extends Viewport$1 {
     });
   }
   getScalarData() {
+    if (this.scalarData?.frameNumber === this.getFrameNumber()) {
+      return this.scalarData;
+    }
     const canvas = document.createElement('canvas');
     canvas.width = this.videoWidth;
     canvas.height = this.videoHeight;
     const context = canvas.getContext('2d');
     context.drawImage(this.videoElement, 0, 0);
     const canvasData = context.getImageData(0, 0, this.videoWidth, this.videoHeight);
-    const {
-      data: scalarData
-    } = canvasData;
+    const scalarData = canvasData.data;
     scalarData.getRange = () => [0, 255];
+    scalarData.frameNumber = this.getFrameNumber();
+    this.scalarData = scalarData;
     return scalarData;
   }
   getImageData() {
@@ -46564,6 +47066,30 @@ class VideoViewport extends Viewport$1 {
     transform.translate(-halfCanvasWorldCoordinates[0], -halfCanvasWorldCoordinates[1]);
     return transform;
   }
+  updateCameraClippingPlanesAndRange() {}
+  addImages(stackInputs) {
+    const actors = this.getActors();
+    stackInputs.forEach(stackInput => {
+      const image = cache$1.getImage(stackInput.imageId);
+      const imageActor = this.createActorMapper(image);
+      if (imageActor) {
+        actors.push({
+          uid: stackInput.actorUID,
+          actor: imageActor
+        });
+        if (stackInput.callback) {
+          stackInput.callback({
+            imageActor,
+            imageId: stackInput.imageId
+          });
+        }
+      }
+    });
+    this.setActors(actors);
+  }
+  createActorMapper(image) {
+    return new CanvasActor(this, image);
+  }
 }
 var VideoViewport$1 = VideoViewport;