cross-image 0.2.0 → 0.2.2

package/esm/src/utils/image_processing.js

@@ -229,3 +229,233 @@ export function crop(data, width, height, x, y, cropWidth, cropHeight) {
     }
     return { data: result, width: actualWidth, height: actualHeight };
 }
+/**
+ * Apply a box blur filter to an image
+ * @param data Image data (RGBA)
+ * @param width Image width
+ * @param height Image height
+ * @param radius Blur radius (default: 1)
+ * @returns New image data with box blur applied
+ */
+export function boxBlur(data, width, height, radius = 1) {
+    const result = new Uint8Array(data.length);
+    const clampedRadius = Math.max(1, Math.floor(radius));
+    for (let y = 0; y < height; y++) {
+        for (let x = 0; x < width; x++) {
+            let r = 0, g = 0, b = 0, a = 0;
+            let count = 0;
+            // Iterate over kernel
+            for (let ky = -clampedRadius; ky <= clampedRadius; ky++) {
+                for (let kx = -clampedRadius; kx <= clampedRadius; kx++) {
+                    const px = x + kx;
+                    const py = y + ky;
+                    // Check bounds
+                    if (px >= 0 && px < width && py >= 0 && py < height) {
+                        const idx = (py * width + px) * 4;
+                        r += data[idx];
+                        g += data[idx + 1];
+                        b += data[idx + 2];
+                        a += data[idx + 3];
+                        count++;
+                    }
+                }
+            }
+            const outIdx = (y * width + x) * 4;
+            result[outIdx] = Math.round(r / count);
+            result[outIdx + 1] = Math.round(g / count);
+            result[outIdx + 2] = Math.round(b / count);
+            result[outIdx + 3] = Math.round(a / count);
+        }
+    }
+    return result;
+}
+/**
+ * Generate a Gaussian kernel for blur
+ * @param radius Kernel radius
+ * @param sigma Standard deviation (if not provided, calculated from radius)
+ * @returns Gaussian kernel as 1D array
+ */
+function generateGaussianKernel(radius, sigma) {
+    const size = radius * 2 + 1;
+    const kernel = new Array(size);
+    const s = sigma ?? radius / 3;
+    const s2 = 2 * s * s;
+    let sum = 0;
+    for (let i = 0; i < size; i++) {
+        const x = i - radius;
+        kernel[i] = Math.exp(-(x * x) / s2);
+        sum += kernel[i];
+    }
+    // Normalize
+    for (let i = 0; i < size; i++) {
+        kernel[i] /= sum;
+    }
+    return kernel;
+}
+/**
+ * Apply Gaussian blur to an image
+ * @param data Image data (RGBA)
+ * @param width Image width
+ * @param height Image height
+ * @param radius Blur radius (default: 1)
+ * @param sigma Optional standard deviation (if not provided, calculated from radius)
+ * @returns New image data with Gaussian blur applied
+ */
+export function gaussianBlur(data, width, height, radius = 1, sigma) {
+    const clampedRadius = Math.max(1, Math.floor(radius));
+    const kernel = generateGaussianKernel(clampedRadius, sigma);
+    // Apply horizontal pass
+    const temp = new Uint8Array(data.length);
+    for (let y = 0; y < height; y++) {
+        for (let x = 0; x < width; x++) {
+            let r = 0, g = 0, b = 0, a = 0;
+            for (let kx = -clampedRadius; kx <= clampedRadius; kx++) {
+                const px = Math.max(0, Math.min(width - 1, x + kx));
+                const idx = (y * width + px) * 4;
+                const weight = kernel[kx + clampedRadius];
+                r += data[idx] * weight;
+                g += data[idx + 1] * weight;
+                b += data[idx + 2] * weight;
+                a += data[idx + 3] * weight;
+            }
+            const outIdx = (y * width + x) * 4;
+            temp[outIdx] = Math.round(r);
+            temp[outIdx + 1] = Math.round(g);
+            temp[outIdx + 2] = Math.round(b);
+            temp[outIdx + 3] = Math.round(a);
+        }
+    }
+    // Apply vertical pass
+    const result = new Uint8Array(data.length);
+    for (let y = 0; y < height; y++) {
+        for (let x = 0; x < width; x++) {
+            let r = 0, g = 0, b = 0, a = 0;
+            for (let ky = -clampedRadius; ky <= clampedRadius; ky++) {
+                const py = Math.max(0, Math.min(height - 1, y + ky));
+                const idx = (py * width + x) * 4;
+                const weight = kernel[ky + clampedRadius];
+                r += temp[idx] * weight;
+                g += temp[idx + 1] * weight;
+                b += temp[idx + 2] * weight;
+                a += temp[idx + 3] * weight;
+            }
+            const outIdx = (y * width + x) * 4;
+            result[outIdx] = Math.round(r);
+            result[outIdx + 1] = Math.round(g);
+            result[outIdx + 2] = Math.round(b);
+            result[outIdx + 3] = Math.round(a);
+        }
+    }
+    return result;
+}
+/**
+ * Apply sharpen filter to an image
+ * @param data Image data (RGBA)
+ * @param width Image width
+ * @param height Image height
+ * @param amount Sharpening amount (0-1, default: 0.5)
+ * @returns New image data with sharpening applied
+ */
+export function sharpen(data, width, height, amount = 0.5) {
+    const result = new Uint8Array(data.length);
+    const clampedAmount = Math.max(0, Math.min(1, amount));
+    // Sharpen kernel (Laplacian-based)
+    // Center weight is 1 + 4*amount, neighbors are -amount
+    const center = 1 + 4 * clampedAmount;
+    const neighbor = -clampedAmount;
+    for (let y = 0; y < height; y++) {
+        for (let x = 0; x < width; x++) {
+            const idx = (y * width + x) * 4;
+            let r = data[idx] * center;
+            let g = data[idx + 1] * center;
+            let b = data[idx + 2] * center;
+            // Apply kernel to neighbors (4-connected)
+            const neighbors = [
+                { dx: 0, dy: -1 }, // top
+                { dx: -1, dy: 0 }, // left
+                { dx: 1, dy: 0 }, // right
+                { dx: 0, dy: 1 }, // bottom
+            ];
+            for (const { dx, dy } of neighbors) {
+                const nx = x + dx;
+                const ny = y + dy;
+                if (nx >= 0 && nx < width && ny >= 0 && ny < height) {
+                    const nIdx = (ny * width + nx) * 4;
+                    r += data[nIdx] * neighbor;
+                    g += data[nIdx + 1] * neighbor;
+                    b += data[nIdx + 2] * neighbor;
+                }
+            }
+            result[idx] = Math.max(0, Math.min(255, Math.round(r)));
+            result[idx + 1] = Math.max(0, Math.min(255, Math.round(g)));
+            result[idx + 2] = Math.max(0, Math.min(255, Math.round(b)));
+            result[idx + 3] = data[idx + 3]; // Alpha unchanged
+        }
+    }
+    return result;
+}
+/**
+ * Apply sepia tone effect to an image
+ * @param data Image data (RGBA)
+ * @returns New image data with sepia tone applied
+ */
+export function sepia(data) {
+    const result = new Uint8Array(data.length);
+    for (let i = 0; i < data.length; i += 4) {
+        const r = data[i];
+        const g = data[i + 1];
+        const b = data[i + 2];
+        // Sepia transformation matrix
+        result[i] = Math.min(255, Math.round(r * 0.393 + g * 0.769 + b * 0.189));
+        result[i + 1] = Math.min(255, Math.round(r * 0.349 + g * 0.686 + b * 0.168));
+        result[i + 2] = Math.min(255, Math.round(r * 0.272 + g * 0.534 + b * 0.131));
+        result[i + 3] = data[i + 3]; // Alpha unchanged
+    }
+    return result;
+}
+/**
+ * Apply median filter to reduce noise
+ * @param data Image data (RGBA)
+ * @param width Image width
+ * @param height Image height
+ * @param radius Filter radius (default: 1)
+ * @returns New image data with median filter applied
+ */
+export function medianFilter(data, width, height, radius = 1) {
+    const result = new Uint8Array(data.length);
+    const clampedRadius = Math.max(1, Math.floor(radius));
+    for (let y = 0; y < height; y++) {
+        for (let x = 0; x < width; x++) {
+            const rValues = [];
+            const gValues = [];
+            const bValues = [];
+            const aValues = [];
+            // Collect values in kernel window
+            for (let ky = -clampedRadius; ky <= clampedRadius; ky++) {
+                for (let kx = -clampedRadius; kx <= clampedRadius; kx++) {
+                    const px = x + kx;
+                    const py = y + ky;
+                    if (px >= 0 && px < width && py >= 0 && py < height) {
+                        const idx = (py * width + px) * 4;
+                        rValues.push(data[idx]);
+                        gValues.push(data[idx + 1]);
+                        bValues.push(data[idx + 2]);
+                        aValues.push(data[idx + 3]);
+                    }
+                }
+            }
+            // Sort and get median
+            rValues.sort((a, b) => a - b);
+            gValues.sort((a, b) => a - b);
+            bValues.sort((a, b) => a - b);
+            aValues.sort((a, b) => a - b);
+            const mid = Math.floor(rValues.length / 2);
+            const outIdx = (y * width + x) * 4;
+            result[outIdx] = rValues[mid];
+            result[outIdx + 1] = gValues[mid];
+            result[outIdx + 2] = bValues[mid];
+            result[outIdx + 3] = aValues[mid];
+        }
+    }
+    return result;
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "cross-image",
-  "version": "0.2.0",
+  "version": "0.2.2",
   "description": "A pure JavaScript, dependency-free, cross-runtime image processing library for Deno, Node.js, and Bun.",
   "keywords": [
     "image",

package/script/mod.d.ts

@@ -2,7 +2,7 @@
  * @module @cross/image
  *
  * A pure JavaScript, dependency-free, cross-runtime image processing library.
- * Supports decoding, resizing, and encoding common image formats (PNG, JPEG, WebP, GIF, TIFF, BMP, DNG, PAM, PCX).
+ * Supports decoding, resizing, and encoding common image formats (PNG, APNG, JPEG, WebP, GIF, TIFF, BMP, ICO, DNG, PAM, PPM, PCX).
  * Includes image processing capabilities like compositing, level adjustments, and pixel manipulation.
  *
  * @example
@@ -45,13 +45,16 @@
 export { Image } from "./src/image.js";
 export type { ASCIIOptions, FrameMetadata, ImageData, ImageFormat, ImageFrame, ImageMetadata, MultiFrameImageData, ResizeOptions, WebPEncodeOptions, } from "./src/types.js";
 export { PNGFormat } from "./src/formats/png.js";
+export { APNGFormat } from "./src/formats/apng.js";
 export { JPEGFormat } from "./src/formats/jpeg.js";
 export { WebPFormat } from "./src/formats/webp.js";
 export { GIFFormat } from "./src/formats/gif.js";
 export { type TIFFEncodeOptions, TIFFFormat } from "./src/formats/tiff.js";
 export { BMPFormat } from "./src/formats/bmp.js";
+export { ICOFormat } from "./src/formats/ico.js";
 export { DNGFormat } from "./src/formats/dng.js";
 export { PAMFormat } from "./src/formats/pam.js";
 export { PCXFormat } from "./src/formats/pcx.js";
+export { PPMFormat } from "./src/formats/ppm.js";
 export { ASCIIFormat } from "./src/formats/ascii.js";
 //# sourceMappingURL=mod.d.ts.map

package/script/mod.js

@@ -3,7 +3,7 @@
  * @module @cross/image
  *
  * A pure JavaScript, dependency-free, cross-runtime image processing library.
- * Supports decoding, resizing, and encoding common image formats (PNG, JPEG, WebP, GIF, TIFF, BMP, DNG, PAM, PCX).
+ * Supports decoding, resizing, and encoding common image formats (PNG, APNG, JPEG, WebP, GIF, TIFF, BMP, ICO, DNG, PAM, PPM, PCX).
  * Includes image processing capabilities like compositing, level adjustments, and pixel manipulation.
  *
  * @example
@@ -44,11 +44,13 @@
  * ```
  */
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.ASCIIFormat = exports.PCXFormat = exports.PAMFormat = exports.DNGFormat = exports.BMPFormat = exports.TIFFFormat = exports.GIFFormat = exports.WebPFormat = exports.JPEGFormat = exports.PNGFormat = exports.Image = void 0;
+exports.ASCIIFormat = exports.PPMFormat = exports.PCXFormat = exports.PAMFormat = exports.DNGFormat = exports.ICOFormat = exports.BMPFormat = exports.TIFFFormat = exports.GIFFormat = exports.WebPFormat = exports.JPEGFormat = exports.APNGFormat = exports.PNGFormat = exports.Image = void 0;
 var image_js_1 = require("./src/image.js");
 Object.defineProperty(exports, "Image", { enumerable: true, get: function () { return image_js_1.Image; } });
 var png_js_1 = require("./src/formats/png.js");
 Object.defineProperty(exports, "PNGFormat", { enumerable: true, get: function () { return png_js_1.PNGFormat; } });
+var apng_js_1 = require("./src/formats/apng.js");
+Object.defineProperty(exports, "APNGFormat", { enumerable: true, get: function () { return apng_js_1.APNGFormat; } });
 var jpeg_js_1 = require("./src/formats/jpeg.js");
 Object.defineProperty(exports, "JPEGFormat", { enumerable: true, get: function () { return jpeg_js_1.JPEGFormat; } });
 var webp_js_1 = require("./src/formats/webp.js");
@@ -59,11 +61,15 @@ var tiff_js_1 = require("./src/formats/tiff.js");
 Object.defineProperty(exports, "TIFFFormat", { enumerable: true, get: function () { return tiff_js_1.TIFFFormat; } });
 var bmp_js_1 = require("./src/formats/bmp.js");
 Object.defineProperty(exports, "BMPFormat", { enumerable: true, get: function () { return bmp_js_1.BMPFormat; } });
+var ico_js_1 = require("./src/formats/ico.js");
+Object.defineProperty(exports, "ICOFormat", { enumerable: true, get: function () { return ico_js_1.ICOFormat; } });
 var dng_js_1 = require("./src/formats/dng.js");
 Object.defineProperty(exports, "DNGFormat", { enumerable: true, get: function () { return dng_js_1.DNGFormat; } });
 var pam_js_1 = require("./src/formats/pam.js");
 Object.defineProperty(exports, "PAMFormat", { enumerable: true, get: function () { return pam_js_1.PAMFormat; } });
 var pcx_js_1 = require("./src/formats/pcx.js");
 Object.defineProperty(exports, "PCXFormat", { enumerable: true, get: function () { return pcx_js_1.PCXFormat; } });
+var ppm_js_1 = require("./src/formats/ppm.js");
+Object.defineProperty(exports, "PPMFormat", { enumerable: true, get: function () { return ppm_js_1.PPMFormat; } });
 var ascii_js_1 = require("./src/formats/ascii.js");
 Object.defineProperty(exports, "ASCIIFormat", { enumerable: true, get: function () { return ascii_js_1.ASCIIFormat; } });

package/script/src/formats/apng.d.ts

@@ -0,0 +1,50 @@
+import type { ImageData, ImageFormat, MultiFrameImageData } from "../types.js";
+import { PNGBase } from "./png_base.js";
+/**
+ * APNG (Animated PNG) format handler
+ * Implements support for animated PNG images with multiple frames
+ * APNG extends PNG with animation control chunks (acTL, fcTL, fdAT)
+ */
+export declare class APNGFormat extends PNGBase implements ImageFormat {
+    /** Format name identifier */
+    readonly name = "apng";
+    /** MIME type for APNG images */
+    readonly mimeType = "image/apng";
+    /**
+     * Check if this format supports multiple frames (animations)
+     * @returns true for APNG format
+     */
+    supportsMultipleFrames(): boolean;
+    /**
+     * Check if the given data is an APNG image
+     * @param data Raw image data to check
+     * @returns true if data has PNG signature and contains acTL chunk
+     */
+    canDecode(data: Uint8Array): boolean;
+    /**
+     * Decode APNG image data to RGBA (first frame only)
+     * @param data Raw APNG image data
+     * @returns Decoded image data with RGBA pixels of first frame
+     */
+    decode(data: Uint8Array): Promise<ImageData>;
+    /**
+     * Decode all frames from APNG image
+     * @param data Raw APNG image data
+     * @returns Decoded multi-frame image data
+     */
+    decodeFrames(data: Uint8Array): Promise<MultiFrameImageData>;
+    /**
+     * Encode RGBA image data to APNG format (single frame)
+     * @param imageData Image data to encode
+     * @returns Encoded APNG image bytes
+     */
+    encode(imageData: ImageData): Promise<Uint8Array>;
+    /**
+     * Encode multi-frame image data to APNG format
+     * @param imageData Multi-frame image data to encode
+     * @returns Encoded APNG image bytes
+     */
+    encodeFrames(imageData: MultiFrameImageData): Promise<Uint8Array>;
+    private decodeFrameData;
+}
+//# sourceMappingURL=apng.d.ts.map