image-js 1.0.0 → 1.2.0

package/src/load/decodePng.ts

@@ -15,12 +15,16 @@ export function decodePng(buffer: Uint8Array): Image {
   const png = decode(buffer);
 
   let colorModel: ImageColorModel;
-  const bitDepth: BitDepth = png.depth === 16 ? 16 : 8;
-
+  const bitDepth: BitDepth = png.depth as BitDepth;
   if (png.palette) {
     return loadPalettePng(png);
   }
-
+  if (bitDepth === 1) {
+    return new Image(png.width, png.height, {
+      data: decodeBinary(png),
+      colorModel: 'GREY',
+    });
+  }
   switch (png.channels) {
     case 1:
       colorModel = 'GREY';
@@ -37,6 +41,7 @@ export function decodePng(buffer: Uint8Array): Image {
     default:
       throw new RangeError(`invalid number of channels: ${png.channels}`);
   }
+
   return new Image(png.width, png.height, {
     colorModel,
     bitDepth,
@@ -52,7 +57,7 @@ export function decodePng(buffer: Uint8Array): Image {
 function loadPalettePng(png: DecodedPng): Image {
   assert(png.palette);
   const pixels = png.width * png.height;
-  const data = new Uint8Array(pixels * 3);
+  const data = new Uint8Array(pixels * png.palette[0].length);
   const pixelsPerByte = 8 / png.depth;
   const factor = png.depth < 8 ? pixelsPerByte : 1;
   const mask = Number.parseInt('1'.repeat(png.depth), 2);
@@ -67,12 +72,39 @@ function loadPalettePng(png: DecodedPng): Image {
         mask;
     }
     const paletteValue = png.palette[value];
-    data[dataIndex++] = paletteValue[0];
-    data[dataIndex++] = paletteValue[1];
-    data[dataIndex++] = paletteValue[2];
+    for (const paletteChannel of paletteValue) {
+      data[dataIndex++] = paletteChannel;
+    }
   }
 
   return new Image(png.width, png.height, {
     data,
+    colorModel: png.palette[0].length === 4 ? 'RGBA' : 'RGB',
   });
 }
+
+function decodeBinary(png: DecodedPng): Uint8Array {
+  const totalPixels = png.width * png.height;
+  const result = new Uint8Array(totalPixels);
+  const pngData = png.data;
+  const padding = png.width % 8;
+  const bytesPerLine = Math.ceil(png.width / 8);
+  let pixelIndex = 0;
+  for (
+    let byteIndex = 0;
+    byteIndex < pngData.length && pixelIndex < totalPixels;
+    byteIndex++
+  ) {
+    const byte = pngData[byteIndex];
+    const limit = byteIndex % bytesPerLine === 0 ? 8 - padding : 0;
+    for (
+      let bitIndex = 7;
+      bitIndex >= limit && pixelIndex < totalPixels;
+      bitIndex--
+    ) {
+      const bit = (byte >> bitIndex) & 1;
+      result[pixelIndex++] = bit * 255;
+    }
+  }
+  return result;
+}

package/src/load/decodeTiff.ts

@@ -13,9 +13,8 @@ type TiffIfd = ReturnType<typeof decode>[number];
  * @returns The decoded image.
  */
 export function decodeTiff(buffer: Uint8Array): Image {
-  const result = decode(buffer);
+  const result = decode(buffer, { pages: [0] });
   return getImageFromIFD(result[0]);
-  // TODO: optimize not to decode whole file
 }
 
 /**
@@ -24,39 +23,71 @@ export function decodeTiff(buffer: Uint8Array): Image {
  * @returns The decoded image.
  */
 export function getImageFromIFD(ifd: TiffIfd): Image {
+  if (ifd.data instanceof Float32Array || ifd.data instanceof Float64Array) {
+    throw new Error('Float TIFF data is not supported.');
+  }
+
   if (ifd.type === 3) {
-    // Palette
-    const data = new Uint16Array(3 * ifd.width * ifd.height);
+    const hasAlpha = ifd.samplesPerPixel === 2;
+    const pixelLength = hasAlpha ? 4 : 3;
+    const data = new Uint16Array(pixelLength * ifd.width * ifd.height);
     const palette = ifd.palette as Array<[number, number, number]>;
     let ptr = 0;
-    for (const index of ifd.data) {
-      const color = palette[index];
-      data[ptr++] = color[0];
-      data[ptr++] = color[1];
-      data[ptr++] = color[2];
+    if (hasAlpha) {
+      for (
+        let index = 0;
+        index < ifd.data.length;
+        index += ifd.samplesPerPixel
+      ) {
+        const color = palette[ifd.data[index]];
+        data[ptr++] = color[0];
+        data[ptr++] = color[1];
+        data[ptr++] = color[2];
+        // To ensure that the value is 16 bits.
+        data[ptr++] = Math.round(
+          (ifd.data[index + 1] / 2 ** ifd.bitsPerSample) * 65535,
+        );
+      }
+    } else {
+      for (
+        let index = 0;
+        index < ifd.data.length;
+        index += ifd.samplesPerPixel
+      ) {
+        const color = palette[ifd.data[index]];
+        data[ptr++] = color[0];
+        data[ptr++] = color[1];
+        data[ptr++] = color[2];
+      }
     }
+
     return new Image(ifd.width, ifd.height, {
       data,
-      // TODO: handle alpha properly
-      colorModel: ifd.alpha ? 'RGBA' : 'RGB',
-      // TODO: handle other bit depths
+      colorModel: hasAlpha ? 'RGBA' : 'RGB',
       bitDepth: 16,
       meta: getMetadata(ifd),
     });
+  } else if (ifd.type === 1 || ifd.type === 0) {
+    if (ifd.bitsPerSample !== 1) {
+      return new Image(ifd.width, ifd.height, {
+        data: ifd.data,
+        bitDepth: ifd.bitsPerSample as BitDepth,
+        colorModel: ifd.alpha ? 'GREYA' : 'GREY',
+        meta: getMetadata(ifd),
+      });
+    } else {
+      return new Image(ifd.width, ifd.height, {
+        data: ifd.data.map((pixel) => pixel * 255),
+        bitDepth: 8 as BitDepth,
+        colorModel: 'GREY',
+        meta: getMetadata(ifd),
+      });
+    }
   } else {
     return new Image(ifd.width, ifd.height, {
-      // TODO: handle float data
-      // @ts-expect-error float data not handled yet
       data: ifd.data,
       bitDepth: ifd.bitsPerSample as BitDepth,
-      colorModel:
-        ifd.type === 2
-          ? ifd.alpha
-            ? 'RGBA'
-            : 'RGB'
-          : ifd.alpha
-            ? 'GREYA'
-            : 'GREY',
+      colorModel: ifd.alpha ? 'RGBA' : 'RGB',
       meta: getMetadata(ifd),
     });
   }

package/src/load/read.ts

@@ -17,7 +17,7 @@ export async function read(path: string | URL): Promise<Image> {
 }
 
 /**
- * Synchronous version of @see {@link read}.
+ * Synchronous version of {@link read}.
  * This method is only implemented for Node.js.
  * @param path - The path to the image.
  * @returns Image instance.

package/src/maskAnalysis/utils/getMbrAngle.ts

@@ -14,7 +14,8 @@ const topFirst = (mbrPoint1: Point, mbrPoint2: Point) =>
  * @returns The angle in degrees.
  */
 export function getMbrAngle(mbr: readonly Point[]): number {
-  const sorted = mbr.slice().sort(leftFirst);
+  const sorted = mbr.slice();
+  sorted.sort(leftFirst);
   const left = sorted.slice(0, 2);
   const right = sorted.slice(2, 4);
   left.sort(topFirst);

package/src/maskAnalysis/utils/monotoneChainConvexHull.ts

@@ -21,7 +21,8 @@ export function monotoneChainConvexHull(
 ): Point[] {
   const { sorted = false } = options;
   if (!sorted) {
-    points = points.slice().sort(byXThenY);
+    points = points.slice();
+    points.sort(byXThenY);
   }
 
   const n = points.length;

package/src/save/encodeBmp.ts

@@ -1,24 +1,31 @@
 import * as bmp from 'fast-bmp';
 
-import type { Image } from '../Image.js';
-import { Mask } from '../Mask.js';
+import { Image } from '../Image.js';
+import type { Mask } from '../Mask.js';
 
 /**
  * Creates a BMP buffer from a mask.
- * @param mask - The mask instance.
+ * @param image - The mask instance.
  * @returns The buffer.
  */
-export function encodeBmp(mask: Image | Mask) {
-  if (!(mask instanceof Mask)) {
-    throw new TypeError('Image bmp encoding is not implemented.');
+export function encodeBmp(image: Image | Mask) {
+  if (image instanceof Image) {
+    return bmp.encode({
+      width: image.width,
+      height: image.height,
+      components: image.components,
+      bitsPerPixel: image.channels * image.bitDepth,
+      channels: image.channels,
+      data: image.getRawImage().data,
+    });
+  } else {
+    return bmp.encode({
+      width: image.width,
+      height: image.height,
+      components: 1,
+      bitsPerPixel: 1,
+      channels: 1,
+      data: image.getRawImage().data,
+    });
   }
-  const imageData = mask.getRawImage();
-  return bmp.encode({
-    width: imageData.width,
-    height: imageData.height,
-    components: 1,
-    bitsPerPixel: 1,
-    channels: 1,
-    data: imageData.data,
-  });
 }

package/src/save/write.ts

@@ -106,7 +106,7 @@ export async function write(
 }
 
 /**
- * Synchronous version of @see {@link write}.
+ * Synchronous version of {@link write}.
  * This method is only implemented for Node.js.
  * @param path - Path where the image should be written.
  * @param image - Image to save.

package/src/stack/load/decodeApng.ts

@@ -0,0 +1,71 @@
+import type { IndexedColors } from 'fast-png';
+import { decodeApng } from 'fast-png';
+
+import { Image } from '../../Image.ts';
+import { Stack } from '../../Stack.ts';
+import type { ImageColorModel } from '../../utils/constants/colorModels.ts';
+
+/**
+ * Decodes APNG image into a Stack
+ * @param data - APNG data.
+ * @returns stack of frames.
+ */
+export function decodeStackFromApng(data: Uint8Array) {
+  const decodedApng = decodeApng(data);
+  const images: Image[] = [];
+  let colorModel: ImageColorModel;
+  switch (decodedApng.channels) {
+    case 1:
+      if (decodedApng.palette) {
+        colorModel = decodedApng.palette[0].length === 3 ? 'RGB' : 'RGBA';
+      } else {
+        colorModel = 'GREY';
+      }
+      break;
+    case 2:
+      colorModel = 'GREYA';
+      break;
+    case 3:
+      colorModel = 'RGB';
+      break;
+    default:
+      colorModel = 'RGBA';
+      break;
+  }
+  if (decodedApng.palette) {
+    for (const image of decodedApng.frames) {
+      images.push(
+        new Image(decodedApng.width, decodedApng.height, {
+          data: convertIndexedData(
+            image.data as Uint8Array,
+            decodedApng.palette,
+          ),
+          colorModel,
+        }),
+      );
+    }
+  } else {
+    for (const image of decodedApng.frames) {
+      images.push(
+        new Image(decodedApng.width, decodedApng.height, {
+          data: image.data,
+          colorModel,
+        }),
+      );
+    }
+  }
+
+  const stack = new Stack(images);
+
+  return stack;
+}
+
+function convertIndexedData(data: Uint8Array, palette: IndexedColors) {
+  const result = new Uint8Array(data.length * palette[0].length);
+  for (let i = 0; i < data.length; i++) {
+    for (let channel = 0; channel < palette[0].length; channel++) {
+      result[i * palette[0].length + channel] = palette[data[i]][channel];
+    }
+  }
+  return result;
+}

package/src/stack/load/decodeStack.ts

@@ -3,6 +3,7 @@ import { match } from 'ts-pattern';
 
 import type { Stack } from '../../Stack.js';
 
+import { decodeStackFromApng } from './decodeApng.ts';
 import { decodeStackFromTiff } from './decodeTiff.js';
 
 /**
@@ -20,6 +21,7 @@ export function decodeStack(data: ArrayBufferView): Stack {
   const type = imageType(typedArray);
   return match(type)
     .with({ mime: 'image/tiff' }, () => decodeStackFromTiff(typedArray))
+    .with({ mime: 'image/png' }, () => decodeStackFromApng(typedArray))
     .otherwise(() => {
       throw new RangeError(`invalid data format: ${type?.mime}`);
     });

package/src/utils/cross_platform.ts

@@ -1,13 +1,15 @@
+import type {
+  Canvas as SkiaCanvas,
+  CanvasRenderingContext2D as SkiaCanvasRenderingContext2D,
+} from 'skia-canvas';
+
 /**
  * Returns builtin Node.js modules or throws an error saying that the method is only implemented in Node.js.
  * @param methodName - Name of the method that calls this function
  * @returns - The `fs`, `path` and `url` Node.js modules.
  */
 export function getNodeApiOrThrow(methodName: string) {
-  if (
-    typeof process === 'undefined' ||
-    typeof process.getBuiltinModule !== 'function'
-  ) {
+  if (!isNode()) {
     throw new Error(`${methodName} is only implemented for Node.js`);
   }
   return {
@@ -16,3 +18,44 @@ export function getNodeApiOrThrow(methodName: string) {
     url: process.getBuiltinModule('node:url'),
   };
 }
+
+let CanvasCtorBrowser: typeof OffscreenCanvas;
+let CanvasCtorNode: typeof SkiaCanvas;
+
+/**
+ * Returns a 2D canvas context for rendering on the browser or Node.js.
+ * @param width - Width of the canvas.
+ * @param height - Height of the canvas.
+ * @returns The initialised canvas context.
+ */
+export function getCanvasContext(
+  width: number,
+  height: number,
+): OffscreenCanvasRenderingContext2D | SkiaCanvasRenderingContext2D {
+  if (isNode()) {
+    CanvasCtorNode ??= getRequireFn()('skia-canvas').Canvas;
+    return new CanvasCtorNode(width, height).getContext('2d');
+  } else {
+    CanvasCtorBrowser ??= globalThis.OffscreenCanvas;
+    const context = new CanvasCtorBrowser(width, height).getContext('2d');
+    if (!context) {
+      throw new Error('Failed to create canvas context');
+    }
+    return context;
+  }
+}
+
+function isNode() {
+  return (
+    typeof process !== 'undefined' &&
+    typeof process.getBuiltinModule === 'function'
+  );
+}
+
+let requireFn: NodeJS.Require;
+function getRequireFn() {
+  requireFn ??= process
+    .getBuiltinModule('node:module')
+    .createRequire(import.meta.url);
+  return requireFn;
+}

package/src/utils/geometry/points.ts

@@ -94,9 +94,11 @@ export function round(point: Point): Point {
  * @returns Sorted points.
  */
 export function sortByColumnRow(points: Point[]): Point[] {
-  return points.slice().sort((point1, point2) => {
+  const sortedPoints = points.slice();
+  sortedPoints.sort((point1, point2) => {
     if (point1.column < point2.column) return -1;
     if (point1.column > point2.column) return 1;
     return point1.row - point2.row;
   });
+  return sortedPoints;
 }

package/src/utils/geometry/removeClosePoints.ts

@@ -42,7 +42,8 @@ export function removeClosePoints(
   const channel = options?.channel || 0;
   const isMax = kind === 'maximum';
 
-  const sortedPoints = points.slice().sort(getSort(image, channel, isMax));
+  const sortedPoints = points.slice();
+  sortedPoints.sort(getSort(image, channel, isMax));
 
   if (distance > 0) {
     for (let i = 0; i < sortedPoints.length; i++) {

package/src/utils/setBlendedPixel.ts

@@ -9,7 +9,7 @@ import { assert } from './validators/assert.js';
  * @param image - The image with which to blend.
  * @param column - Column of the target pixel.
  * @param row - Row of the target pixel.
- * @param color - Color with which to blend the image pixel. @default `'Opaque black'`.
+ * @param color - Color with which to blend the image pixel. Default: `Opaque black`.
  */
 
 export function setBlendedPixel(

package/src/utils/setBlendedVisiblePixel.ts

@@ -8,7 +8,7 @@ import { setBlendedPixel } from './setBlendedPixel.js';
  * @param image - The image with which to blend.
  * @param column - Column of the target pixel.
  * @param row - Row of the target pixel.
- * @param color - Color with which to blend the image pixel. @default `'Opaque black'`.
+ * @param color - Color with which to blend the image pixel. Default: `Opaque black`.
  */
 export function setBlendedVisiblePixel(
   image: Image | Mask,

package/lib/ssim/compute_dssim.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"compute_dssim.d.ts","sourceRoot":"","sources":["../../src/ssim/compute_dssim.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AAEzC,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAGrD;;;;;;;GAOG;AACH,wBAAgB,YAAY,CAC1B,KAAK,EAAE,KAAK,EACZ,UAAU,EAAE,KAAK,EACjB,OAAO,GAAE,WAAgB,GACxB,MAAM,CAGR"}

package/lib/ssim/compute_dssim.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"compute_dssim.js","sourceRoot":"","sources":["../../src/ssim/compute_dssim.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAEhD;;;;;;;GAOG;AACH,MAAM,UAAU,YAAY,CAC1B,KAAY,EACZ,UAAiB,EACjB,UAAuB,EAAE;IAEzB,MAAM,IAAI,GAAG,WAAW,CAAC,KAAK,EAAE,UAAU,EAAE,OAAO,CAAC,CAAC,KAAK,CAAC;IAC3D,OAAO,CAAC,CAAC,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC;AACxB,CAAC"}

package/lib/ssim/compute_ssim.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"compute_ssim.d.ts","sourceRoot":"","sources":["../../src/ssim/compute_ssim.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AAIzC,MAAM,WAAW,WAAW;IAC1B;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,GAAG,UAAU,GAAG,WAAW,GAAG,OAAO,CAAC;CACzD;AAED,MAAM,WAAW,IAAI;IACnB;;;OAGG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;;OAGG;IACH,OAAO,EAAE;QAAE,IAAI,EAAE,MAAM,EAAE,CAAC;QAAC,KAAK,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,MAAM,CAAA;KAAE,CAAC;CAC5D;AAED;;;;;;;;;;GAUG;AACH,wBAAgB,WAAW,CACzB,KAAK,EAAE,KAAK,EACZ,UAAU,EAAE,KAAK,EACjB,OAAO,GAAE,WAAgB,GACxB,IAAI,CA8CN"}

package/lib/ssim/compute_ssim.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"compute_ssim.js","sourceRoot":"","sources":["../../src/ssim/compute_ssim.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,IAAI,UAAU,EAAE,MAAM,SAAS,CAAC;AAG7C,OAAO,gBAAgB,MAAM,yCAAyC,CAAC;AACvE,OAAO,EAAE,qBAAqB,EAAE,MAAM,mCAAmC,CAAC;AA4B1E;;;;;;;;;;GAUG;AACH,MAAM,UAAU,WAAW,CACzB,KAAY,EACZ,UAAiB,EACjB,UAAuB,EAAE;IAEzB,IAAI,EAAE,UAAU,EAAE,GAAG,OAAO,CAAC;IAC7B,MAAM,EAAE,SAAS,GAAG,UAAU,EAAE,GAAG,OAAO,CAAC;IAE3C,IAAI,UAAU,EAAE,CAAC;QACf,IAAI,UAAU,GAAG,KAAK,CAAC,KAAK,IAAI,UAAU,GAAG,KAAK,CAAC,MAAM,EAAE,CAAC;YAC1D,MAAM,IAAI,UAAU,CAAC,2CAA2C,CAAC,CAAC;QACpE,CAAC;IACH,CAAC;SAAM,CAAC;QACN,UAAU,GAAG,IAAI,CAAC,GAAG,CAAC,EAAE,EAAE,KAAK,CAAC,MAAM,EAAE,KAAK,CAAC,KAAK,CAAC,CAAC;IACvD,CAAC;IACD,gBAAgB,CAAC,KAAK,EAAE;QACtB,QAAQ,EAAE,CAAC,CAAC,CAAC;QACb,QAAQ,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC;KACpB,CAAC,CAAC;IAEH,qBAAqB,CAAC,KAAK,EAAE,UAAU,CAAC,CAAC;IAEzC,IAAI,KAAK,CAAC,UAAU,KAAK,MAAM,EAAE,CAAC;QAChC,KAAK,GAAG,KAAK,CAAC,YAAY,CAAC,MAAM,CAAC,CAAC;QACnC,UAAU,GAAG,UAAU,CAAC,YAAY,CAAC,MAAM,CAAC,CAAC;IAC/C,CAAC;IAED,MAAM,SAAS,GAAG,IAAI,iBAAiB,CAAC,KAAK,CAAC,WAAW,EAAE,CAAC,IAAI,CAAC,CAAC;IAClE,MAAM,WAAW,GAAG;QAClB,MAAM,EAAE,KAAK,CAAC,MAAM;QACpB,KAAK,EAAE,KAAK,CAAC,KAAK;QAClB,IAAI,EAAE,SAAS;KAChB,CAAC;IAEF,MAAM,SAAS,GAAG,IAAI,iBAAiB,CAAC,UAAU,CAAC,WAAW,EAAE,CAAC,IAAI,CAAC,CAAC;IACvE,MAAM,WAAW,GAAG;QAClB,MAAM,EAAE,UAAU,CAAC,MAAM;QACzB,KAAK,EAAE,UAAU,CAAC,KAAK;QACvB,IAAI,EAAE,SAAS;KAChB,CAAC;IAEF,MAAM,IAAI,GAAG,UAAU,CAAC,WAAW,EAAE,WAAW,EAAE;QAChD,UAAU;QACV,IAAI,EAAE,SAAS;KAChB,CAAC,CAAC;IAEH,OAAO;QACL,KAAK,EAAE,IAAI,CAAC,KAAK;QACjB,OAAO,EAAE,IAAI,CAAC,QAAQ;KACvB,CAAC;AACJ,CAAC"}

package/lib/ssim/index.d.ts

@@ -1,3 +0,0 @@
-export * from './compute_dssim.js';
-export * from './compute_ssim.js';
-//# sourceMappingURL=index.d.ts.map

package/lib/ssim/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/ssim/index.ts"],"names":[],"mappings":"AAAA,cAAc,oBAAoB,CAAC;AACnC,cAAc,mBAAmB,CAAC"}

package/lib/ssim/index.js

@@ -1,3 +0,0 @@
-export * from './compute_dssim.js';
-export * from './compute_ssim.js';
-//# sourceMappingURL=index.js.map

package/lib/ssim/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/ssim/index.ts"],"names":[],"mappings":"AAAA,cAAc,oBAAoB,CAAC;AACnC,cAAc,mBAAmB,CAAC"}

package/src/ssim/index.ts

@@ -1,2 +0,0 @@
-export * from './compute_dssim.js';
-export * from './compute_ssim.js';