Transpile libimagequant

2018-07-30 15:49:38 +01:00
parent f2f467ecb8
commit 9d5ad83ff8
8 changed files with 1333 additions and 0 deletions
--- a/codecs/imagequant/example.html
+++ b/codecs/imagequant/example.html
@@ -0,0 +1,49 @@
+<!doctype html>
+<script src='imagequant.js'></script>
+<script>
+  const Module = imagequant();
+
+  async function loadImage(src) {
+    // Load image
+    const img = document.createElement('img');
+    img.src = src;
+    await new Promise(resolve => img.onload = resolve);
+    // Make canvas same size as image
+    const canvas = document.createElement('canvas');
+    [canvas.width, canvas.height] = [img.width, img.height];
+    // Draw image onto canvas
+    const ctx = canvas.getContext('2d');
+    ctx.drawImage(img, 0, 0);
+    return ctx.getImageData(0, 0, img.width, img.height);
+  }
+
+  Module.onRuntimeInitialized = async _ => {
+    const api = {
+      version: Module.cwrap('version', 'number', []),
+      create_buffer: Module.cwrap('create_buffer', 'number', ['number', 'number']),
+      destroy_buffer: Module.cwrap('destroy_buffer', '', ['number']),
+      quantize: Module.cwrap('quantize', '', ['number', 'number', 'number', 'number', 'number']),
+      free_result: Module.cwrap('free_result', '', ['number']),
+      get_result_pointer: Module.cwrap('get_result_pointer', 'number', []),
+      // get_result_size: Module.cwrap('get_result_size', 'number', []),
+    };
+    console.log('Version:', api.version().toString(16));
+    const image = await loadImage('../example.png');
+    const p = api.create_buffer(image.width, image.height);
+    Module.HEAP8.set(image.data, p);
+    api.quantize(p, image.width, image.height, 16, 1.0);
+    const resultPointer = api.get_result_pointer();
+    const resultView = new Uint8Array(Module.HEAP8.buffer, resultPointer, image.width * image.height * 4);
+    const result = new Uint8ClampedArray(resultView);
+    api.free_result();
+    api.destroy_buffer(p);
+
+    const imageData = new ImageData(result, image.width, image.height);
+    const canvas = document.createElement('canvas');
+    canvas.width = image.width;
+    canvas.height = image.height;
+    const ctx = canvas.getContext('2d');
+    ctx.putImageData(imageData, 0, 0);
+    document.body.appendChild(canvas);
+  };
+</script>