@pixzle/browser 0.0.19 → 0.0.21

package/README.md

@@ -0,0 +1,31 @@
+# @pixzle/browser
+
+Browser implementation of Pixzle image restoration.
+
+## Installation
+
+```bash
+npm i @pixzle/browser
+```
+
+## Usage
+
+```typescript
+import { BrowserImageRestorer } from '@pixzle/browser';
+
+const restorer = new BrowserImageRestorer();
+
+const restoredBitmap = await restorer.restoreImage(
+  'path/to/shuffled.png', // or URL, Blob, HTMLImageElement, ImageBitmap
+  8, // blockSize
+  72411, // seed
+  { w: 500, h: 500 } // imageInfo
+);
+
+// Draw to canvas
+const canvas = document.createElement('canvas');
+canvas.width = restoredBitmap.width;
+canvas.height = restoredBitmap.height;
+const ctx = canvas.getContext('2d');
+ctx.drawImage(restoredBitmap, 0, 0);
+```

package/dist/block.d.ts

@@ -0,0 +1,8 @@
+/**
+ * Split an image (HTMLImageElement or ImageBitmap) into blocks
+ */
+export declare function splitImageToBlocks(image: HTMLImageElement | ImageBitmap, blockSize: number): Uint8Array[];
+/**
+ * Create an ImageBitmap from blocks
+ */
+export declare function blocksToImage(blocks: Uint8Array[], width: number, height: number, blockSize: number): Promise<ImageBitmap>;

package/dist/block.js

@@ -0,0 +1,34 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.splitImageToBlocks = splitImageToBlocks;
+exports.blocksToImage = blocksToImage;
+const core_1 = require("@pixzle/core");
+/**
+ * Split an image (HTMLImageElement or ImageBitmap) into blocks
+ */
+function splitImageToBlocks(image, blockSize) {
+    const canvas = document.createElement("canvas");
+    canvas.width = image.width;
+    canvas.height = image.height;
+    const ctx = canvas.getContext("2d");
+    if (!ctx)
+        throw new Error("Could not get 2D context");
+    ctx.drawImage(image, 0, 0);
+    const imageData = ctx.getImageData(0, 0, image.width, image.height);
+    // imageData.data is Uint8ClampedArray, we need Uint8Array
+    // We create a copy to avoid issues if the canvas is reused or garbage collected in weird ways,
+    // though here it's local.
+    // coreSplitImageToBlocks expects Uint8Array.
+    const buffer = new Uint8Array(imageData.data.buffer);
+    return (0, core_1.splitImageToBlocks)(buffer, image.width, image.height, blockSize);
+}
+/**
+ * Create an ImageBitmap from blocks
+ */
+async function blocksToImage(blocks, width, height, blockSize) {
+    const buffer = (0, core_1.blocksToImageBuffer)(blocks, width, height, blockSize);
+    // Create ImageData
+    const imageData = new ImageData(new Uint8ClampedArray(buffer.buffer, buffer.byteOffset, buffer.byteLength), width, height);
+    return createImageBitmap(imageData);
+}
+//# sourceMappingURL=block.js.map

package/dist/block.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"block.js","sourceRoot":"","sources":["../src/block.ts"],"names":[],"mappings":";;AAQA,gDAoBC;AAKD,sCAoBC;AArDD,uCAGsB;AAEtB;;GAEG;AACH,SAAgB,kBAAkB,CAChC,KAAqC,EACrC,SAAiB;IAEjB,MAAM,MAAM,GAAG,QAAQ,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAC;IAChD,MAAM,CAAC,KAAK,GAAG,KAAK,CAAC,KAAK,CAAC;IAC3B,MAAM,CAAC,MAAM,GAAG,KAAK,CAAC,MAAM,CAAC;IAC7B,MAAM,GAAG,GAAG,MAAM,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC;IACpC,IAAI,CAAC,GAAG;QAAE,MAAM,IAAI,KAAK,CAAC,0BAA0B,CAAC,CAAC;IAEtD,GAAG,CAAC,SAAS,CAAC,KAAK,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC;IAC3B,MAAM,SAAS,GAAG,GAAG,CAAC,YAAY,CAAC,CAAC,EAAE,CAAC,EAAE,KAAK,CAAC,KAAK,EAAE,KAAK,CAAC,MAAM,CAAC,CAAC;IAEpE,0DAA0D;IAC1D,+FAA+F;IAC/F,0BAA0B;IAC1B,6CAA6C;IAC7C,MAAM,MAAM,GAAG,IAAI,UAAU,CAAC,SAAS,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;IAErD,OAAO,IAAA,yBAAsB,EAAC,MAAM,EAAE,KAAK,CAAC,KAAK,EAAE,KAAK,CAAC,MAAM,EAAE,SAAS,CAAC,CAAC;AAC9E,CAAC;AAED;;GAEG;AACI,KAAK,UAAU,aAAa,CACjC,MAAoB,EACpB,KAAa,EACb,MAAc,EACd,SAAiB;IAEjB,MAAM,MAAM,GAAG,IAAA,0BAAuB,EAAC,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,SAAS,CAAC,CAAC;IAEzE,mBAAmB;IACnB,MAAM,SAAS,GAAG,IAAI,SAAS,CAC7B,IAAI,iBAAiB,CACnB,MAAM,CAAC,MAAqB,EAC5B,MAAM,CAAC,UAAU,EACjB,MAAM,CAAC,UAAU,CAClB,EACD,KAAK,EACL,MAAM,CACP,CAAC;IAEF,OAAO,iBAAiB,CAAC,SAAS,CAAC,CAAC;AACtC,CAAC"}

package/dist/index.d.ts

@@ -0,0 +1,2 @@
+export * from "./restorer";
+export * from "./block";

package/dist/index.js

@@ -0,0 +1,19 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./restorer"), exports);
+__exportStar(require("./block"), exports);
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAAA,6CAA2B;AAC3B,0CAAwB"}

package/dist/restorer.d.ts

@@ -0,0 +1,13 @@
+import type { ImageInfo } from "@pixzle/core";
+export declare class BrowserImageRestorer {
+    /**
+     * Restore a single image from a shuffled source
+     * @param imageSource The shuffled image (URL, Blob, HTMLImageElement, or ImageBitmap)
+     * @param blockSize The block size used for fragmentation
+     * @param seed The seed used for shuffling
+     * @param imageInfo Information about the original image (dimensions)
+     * @returns Promise resolving to the restored ImageBitmap
+     */
+    restoreImage(imageSource: string | URL | Blob | HTMLImageElement | ImageBitmap, blockSize: number, seed: number | string, imageInfo: ImageInfo): Promise<ImageBitmap>;
+    private _loadImage;
+}

package/dist/restorer.js

@@ -0,0 +1,56 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.BrowserImageRestorer = void 0;
+const seeded_shuffle_1 = require("@tuki0918/seeded-shuffle");
+const block_1 = require("./block");
+class BrowserImageRestorer {
+    /**
+     * Restore a single image from a shuffled source
+     * @param imageSource The shuffled image (URL, Blob, HTMLImageElement, or ImageBitmap)
+     * @param blockSize The block size used for fragmentation
+     * @param seed The seed used for shuffling
+     * @param imageInfo Information about the original image (dimensions)
+     * @returns Promise resolving to the restored ImageBitmap
+     */
+    async restoreImage(imageSource, blockSize, seed, imageInfo) {
+        const image = await this._loadImage(imageSource);
+        const blocks = (0, block_1.splitImageToBlocks)(image, blockSize);
+        const restoredBlocks = (0, seeded_shuffle_1.unshuffle)(blocks, seed);
+        return (0, block_1.blocksToImage)(restoredBlocks, imageInfo.w, imageInfo.h, blockSize);
+    }
+    async _loadImage(sourceInput) {
+        let source = sourceInput;
+        if (typeof URL !== "undefined" && source instanceof URL) {
+            source = source.toString();
+        }
+        if (typeof HTMLImageElement !== "undefined" &&
+            source instanceof HTMLImageElement) {
+            if (source.complete)
+                return source;
+            await new Promise((resolve, reject) => {
+                source.onload = resolve;
+                source.onerror = reject;
+            });
+            return source;
+        }
+        if (typeof ImageBitmap !== "undefined" && source instanceof ImageBitmap) {
+            return source;
+        }
+        if (typeof Blob !== "undefined" && source instanceof Blob) {
+            return createImageBitmap(source);
+        }
+        if (typeof source === "string") {
+            const img = new Image();
+            img.crossOrigin = "Anonymous";
+            img.src = source;
+            await new Promise((resolve, reject) => {
+                img.onload = resolve;
+                img.onerror = reject;
+            });
+            return img;
+        }
+        throw new Error("Unsupported image source");
+    }
+}
+exports.BrowserImageRestorer = BrowserImageRestorer;
+//# sourceMappingURL=restorer.js.map

package/dist/restorer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"restorer.js","sourceRoot":"","sources":["../src/restorer.ts"],"names":[],"mappings":";;;AACA,6DAAqD;AACrD,mCAA4D;AAE5D,MAAa,oBAAoB;IAC/B;;;;;;;OAOG;IACH,KAAK,CAAC,YAAY,CAChB,WAAiE,EACjE,SAAiB,EACjB,IAAqB,EACrB,SAAoB;QAEpB,MAAM,KAAK,GAAG,MAAM,IAAI,CAAC,UAAU,CAAC,WAAW,CAAC,CAAC;QAEjD,MAAM,MAAM,GAAG,IAAA,0BAAkB,EAAC,KAAK,EAAE,SAAS,CAAC,CAAC;QAEpD,MAAM,cAAc,GAAG,IAAA,0BAAS,EAAC,MAAM,EAAE,IAAI,CAAiB,CAAC;QAE/D,OAAO,IAAA,qBAAa,EAAC,cAAc,EAAE,SAAS,CAAC,CAAC,EAAE,SAAS,CAAC,CAAC,EAAE,SAAS,CAAC,CAAC;IAC5E,CAAC;IAEO,KAAK,CAAC,UAAU,CACtB,WAAiE;QAEjE,IAAI,MAAM,GAAG,WAAW,CAAC;QACzB,IAAI,OAAO,GAAG,KAAK,WAAW,IAAI,MAAM,YAAY,GAAG,EAAE,CAAC;YACxD,MAAM,GAAG,MAAM,CAAC,QAAQ,EAAE,CAAC;QAC7B,CAAC;QAED,IACE,OAAO,gBAAgB,KAAK,WAAW;YACvC,MAAM,YAAY,gBAAgB,EAClC,CAAC;YACD,IAAI,MAAM,CAAC,QAAQ;gBAAE,OAAO,MAAM,CAAC;YACnC,MAAM,IAAI,OAAO,CAAC,CAAC,OAAO,EAAE,MAAM,EAAE,EAAE;gBACpC,MAAM,CAAC,MAAM,GAAG,OAAO,CAAC;gBACxB,MAAM,CAAC,OAAO,GAAG,MAAM,CAAC;YAC1B,CAAC,CAAC,CAAC;YACH,OAAO,MAAM,CAAC;QAChB,CAAC;QAED,IAAI,OAAO,WAAW,KAAK,WAAW,IAAI,MAAM,YAAY,WAAW,EAAE,CAAC;YACxE,OAAO,MAAM,CAAC;QAChB,CAAC;QAED,IAAI,OAAO,IAAI,KAAK,WAAW,IAAI,MAAM,YAAY,IAAI,EAAE,CAAC;YAC1D,OAAO,iBAAiB,CAAC,MAAM,CAAC,CAAC;QACnC,CAAC;QAED,IAAI,OAAO,MAAM,KAAK,QAAQ,EAAE,CAAC;YAC/B,MAAM,GAAG,GAAG,IAAI,KAAK,EAAE,CAAC;YACxB,GAAG,CAAC,WAAW,GAAG,WAAW,CAAC;YAC9B,GAAG,CAAC,GAAG,GAAG,MAAM,CAAC;YACjB,MAAM,IAAI,OAAO,CAAC,CAAC,OAAO,EAAE,MAAM,EAAE,EAAE;gBACpC,GAAG,CAAC,MAAM,GAAG,OAAO,CAAC;gBACrB,GAAG,CAAC,OAAO,GAAG,MAAM,CAAC;YACvB,CAAC,CAAC,CAAC;YACH,OAAO,GAAG,CAAC;QACb,CAAC;QAED,MAAM,IAAI,KAAK,CAAC,0BAA0B,CAAC,CAAC;IAC9C,CAAC;CACF;AAjED,oDAiEC"}

package/package.json

@@ -1,22 +1,43 @@
 {
   "name": "@pixzle/browser",
-  "version": "0.0.19",
-  "description": "Browser implementation of image fragmentation and restoration (RESERVED)",
+  "version": "0.0.21",
+  "description": "Browser implementation of image fragmentation and restoration",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "default": "./dist/index.js"
+    }
+  },
+  "sideEffects": false,
   "files": [
     "dist"
   ],
+  "keywords": [],
+  "author": "tuki0918",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/tuki0918/pixzle.git",
+    "directory": "packages/browser"
+  },
+  "license": "MIT",
+  "publishConfig": {
+    "access": "public"
+  },
   "dependencies": {
-    "@pixzle/core": "0.0.19"
+    "@tuki0918/seeded-shuffle": "^1.0.0",
+    "@pixzle/core": "0.0.21"
   },
   "devDependencies": {
+    "happy-dom": "^20.0.11",
     "typescript": "^5.7.2",
     "vitest": "^3.1.4"
   },
   "scripts": {
-    "build": "echo 'Browser implementation not yet available'",
-    "build:check": "echo 'Browser implementation not yet available'",
-    "test": "echo 'Browser implementation not yet available'"
+    "build": "tsc -p tsconfig.build.json",
+    "build:check": "tsc -p tsconfig.build.json --noEmit",
+    "test": "vitest run",
+    "test:watch": "vitest"
   }
 }