Commit of png-js fork

LICENSE

@@ -0,0 +1,22 @@
+MIT License
+
+Copyright (c) 2017 Devon Govett
+Copyright (c) 2019 MindFire Games, LLC
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package.json

@@ -0,0 +1,44 @@
+{
+  "name": "@mindfire/png-js",
+  "description": "A PNG decoder in ES6 JavaScript.",
+  "version": "1.2.0",
+  "main": "dist/png-js.cjs.js",
+  "module": "dist/png-js.es.js",
+  "browser": {
+    "./dist/png-js.es.js": "./dist/png-js.browser.es.js",
+    "./dist/png-js.cjs.js": "./dist/png-js.browser.cjs.js"
+  },
+  "author": {
+    "name": "Mindfire Games, LLC",
+    "email": "founders@mindfire.games",
+    "url": "https://mindfire.games/"
+  },
+  "scripts": {
+    "build": "rollup -c",
+    "prepublish": "npm run build",
+    "test:size": "bundlesize"
+  },
+  "devDependencies": {
+    "babel-plugin-external-helpers": "^6.22.0",
+    "babel-preset-es2015": "^6.24.1",
+    "bundlesize": "^0.17.0",
+    "rollup": "^0.52.2",
+    "rollup-plugin-babel": "^2.7.1",
+    "rollup-plugin-ignore": "^1.0.3",
+    "rollup-plugin-replace": "^1.1.1",
+    "rollup-plugin-uglify": "^3.0.0"
+  },
+  "files": [
+    "dist"
+  ],
+  "bundlesize": [
+    {
+      "path": "./dist/png-js.cjs.min.js",
+      "maxSize": "2kB"
+    },
+    {
+      "path": "./dist/png-js.browser.cjs.min.js",
+      "maxSize": "2kB"
+    }
+  ]
+}

rollup.config.js

@@ -0,0 +1,82 @@
+import babel from 'rollup-plugin-babel';
+import uglify from 'rollup-plugin-uglify';
+import replace from 'rollup-plugin-replace'
+import ignore from 'rollup-plugin-ignore'
+
+const cjs = {
+  exports: 'named',
+  format: 'cjs'
+}
+
+const esm = {
+  format: 'es'
+}
+
+const getCJS = override => Object.assign({}, cjs, override)
+const getESM = override => Object.assign({}, esm, override)
+
+const configBase = {
+  input: 'src/index.js',
+  plugins: [
+    babel({
+      babelrc: false,
+      presets: [['es2015', { modules: false }]],
+      plugins: ['external-helpers'],
+      runtimeHelpers: true
+    })
+  ],
+}
+
+const serverConfig = Object.assign({}, configBase, {
+  output: [
+    getESM({ file: 'dist/png-js.es.js' }),
+    getCJS({ file: 'dist/png-js.cjs.js' }),
+  ],
+  plugins: configBase.plugins.concat(
+    replace({
+      BROWSER: JSON.stringify(false),
+    })
+  ),
+  external: ['fs']
+})
+
+const serverProdConfig = Object.assign({}, serverConfig, {
+  output: [
+    getESM({ file: 'dist/png-js.es.min.js' }),
+    getCJS({ file: 'dist/png-js.cjs.min.js' }),
+  ],
+  plugins: serverConfig.plugins.concat(
+    uglify()
+  ),
+})
+
+const browserConfig = Object.assign({}, configBase, {
+  output: [
+    getESM({ file: 'dist/png-js.browser.es.js' }),
+    getCJS({ file: 'dist/png-js.browser.cjs.js' }),
+  ],
+  plugins: configBase.plugins.concat(
+    replace({
+      BROWSER: JSON.stringify(true),
+      "png-js": "png-js/png.js"
+    }),
+    ignore(['fs'])
+  )
+})
+
+const browserProdConfig = Object.assign({}, browserConfig, {
+  output: [
+    getESM({ file: 'dist/png-js.browser.es.min.js' }),
+    getCJS({ file: 'dist/png-js.browser.cjs.min.js' }),
+  ],
+  plugins: browserConfig.plugins.concat(
+    uglify()
+  ),
+})
+
+export default [
+  serverConfig,
+  serverProdConfig,
+  browserConfig,
+  browserProdConfig
+]

src/index.js

@@ -0,0 +1,320 @@
+import fs from 'fs';
+import zlib from 'zlib';
+import range from './range';
+import { promisify } from 'util';
+
+const inflateAsync = promisify(zlib.inflate);
+const readFileAsync = promisify(fs.readFile)
+
+class IndexedPNG {
+  constructor(data) {
+    this.data = data;
+    this.pos = 8; // Skip the default header
+
+    this.palette = [];
+    this.imgData = [];
+    this.transparency = {};
+    this.text = {};
+
+    this.process()
+  }
+
+  process() {
+    let i;
+    while (true) {
+      var end;
+      const chunkSize = this.readUInt32();
+      const section = ((() => {
+        const result = [];
+        for (i = 0; i < 4; i++) {
+          result.push(String.fromCharCode(this.data[this.pos++]));
+        }
+        return result;
+      })()).join('');
+  
+      switch (section) {
+        case 'IHDR':
+          // we can grab  interesting values from here (like width, height, etc)
+          this.width = this.readUInt32();
+          this.height = this.readUInt32();
+          this.bits = this.data[this.pos++];
+          this.colorType = this.data[this.pos++];
+          this.compressionMethod = this.data[this.pos++];
+          this.filterMethod = this.data[this.pos++];
+          this.interlaceMethod = this.data[this.pos++];
+          break;
+  
+        case 'PLTE':
+          this.palette = this.read(chunkSize);
+          break;
+  
+        case 'IDAT':
+          for (i = 0, end = chunkSize; i < end; i++) {
+            this.imgData.push(this.data[this.pos++]);
+          }
+          break;
+  
+        case 'tRNS':
+          // This chunk can only occur once and it must occur after the
+          // PLTE chunk and before the IDAT chunk.
+          this.transparency = {};
+          switch (this.colorType) {
+            case 3:
+              // Indexed color, RGB. Each byte in this chunk is an alpha for
+              // the palette index in the PLTE ("palette") chunk up until the
+              // last non-opaque entry. Set up an array, stretching over all
+              // palette entries which will be 0 (opaque) or 1 (transparent).
+              this.transparency.indexed = this.read(chunkSize);
+              //var short = 255 - this.transparency.indexed.length;
+              var short = this.transparency.indexed.length-1;
+              if (short > 0) {
+                var asc,
+                  end1;
+                for (
+                  i = 0, end1 = short, asc = 0 <= end1; asc
+                    ? i < end1
+                    : i > end1; asc
+                  ? i++
+                  : i--) {
+                  this.transparency.indexed.push(255);
+                }
+              }
+              break;
+            case 0:
+              // Greyscale. Corresponding to entries in the PLTE chunk.
+              // Grey is two bytes, range 0 .. (2 ^ bit-depth) - 1
+              this.transparency.grayscale = this.read(chunkSize)[0];
+              break;
+            case 2:
+              // True color with proper alpha channel.
+              this.transparency.rgb = this.read(chunkSize);
+              break;
+          }
+          break;
+  
+        case 'tEXt':
+          var text = this.read(chunkSize);
+          var index = text.indexOf(0);
+          var key = String.fromCharCode(...Array.from(text.slice(0, index) || []));
+          this.text[key] = String.fromCharCode(...Array.from(text.slice(index + 1) || []));
+          break;
+  
+        case 'IEND':
+          // we've got everything we need!
+          this.colors = (() => {
+            switch (this.colorType) {
+              case 0:
+              case 3:
+              case 4:
+                return 1;
+              case 2:
+              case 6:
+                return 3;
+            }
+          })();
+  
+          this.hasAlphaChannel = [4, 6].includes(this.colorType);
+          var colors = this.colors + (
+            this.hasAlphaChannel
+            ? 1
+            : 0);
+          this.pixelBitlength = this.bits * colors;
+  
+          this.colorSpace = (() => {
+            switch (this.colors) {
+              case 1:
+                return 'DeviceGray';
+              case 3:
+                return 'DeviceRGB';
+            }
+          })();
+  
+          this.imgData = Buffer.from(this.imgData);
+          return;
+          break;
+  
+        default:
+          // unknown (or unimportant) section, skip it
+          this.pos += chunkSize;
+      }
+  
+      this.pos += 4; // Skip the CRC
+  
+      if (this.pos > this.data.length) {
+        throw new Error("Incomplete or corrupt IndexedPNG file");
+      }
+    }
+  }
+
+  read(bytes) {
+    return (range(0, bytes, false).map((i) => this.data[this.pos++]));
+  }
+
+  readUInt32() {
+    const b1 = this.data[this.pos++] << 24;
+    const b2 = this.data[this.pos++] << 16;
+    const b3 = this.data[this.pos++] << 8;
+    const b4 = this.data[this.pos++];
+    return b1 | b2 | b3 | b4;
+  }
+
+  readUInt16() {
+    const b1 = this.data[this.pos++] << 8;
+    const b2 = this.data[this.pos++];
+    return b1 | b2;
+  }
+
+  async decodePixels() {
+    let data
+    try { 
+      data = await inflateAsync(this.imgData)
+    } catch (err) {
+      throw err
+    }
+    const pixelBytes = this.pixelBitlength / 8;
+    const scanlineLength = pixelBytes * this.width;
+
+    const pixels = Buffer.allocUnsafe(scanlineLength * this.height);
+    const {length} = data;
+    let row = 0;
+    let pos = 0;
+    let c = 0;
+
+    while (pos < length) {
+      var byte,
+        col,
+        i,
+        left,
+        upper;
+      var end;
+      var end1;
+      var end2;
+      var end3;
+      var end4;
+      switch (data[pos++]) {
+        case 0: // None
+          for (i = 0, end = scanlineLength; i < end; i++) {
+            pixels[c++] = data[pos++];
+          }
+          break;
+
+        case 1: // Sub
+          for (i = 0, end1 = scanlineLength; i < end1; i++) {
+            byte = data[pos++];
+            left = i < pixelBytes
+              ? 0
+              : pixels[c - pixelBytes];
+            pixels[c++] = (byte + left) % 256;
+          }
+          break;
+
+        case 2: // Up
+          for (i = 0, end2 = scanlineLength; i < end2; i++) {
+            byte = data[pos++];
+            col = (i - (i % pixelBytes)) / pixelBytes;
+            upper = row && pixels[((row - 1) * scanlineLength) + (col * pixelBytes) + (i % pixelBytes)];
+            pixels[c++] = (upper + byte) % 256;
+          }
+          break;
+
+        case 3: // Average
+          for (i = 0, end3 = scanlineLength; i < end3; i++) {
+            byte = data[pos++];
+            col = (i - (i % pixelBytes)) / pixelBytes;
+            left = i < pixelBytes
+              ? 0
+              : pixels[c - pixelBytes];
+            upper = row && pixels[((row - 1) * scanlineLength) + (col * pixelBytes) + (i % pixelBytes)];
+            pixels[c++] = (byte + Math.floor((left + upper) / 2)) % 256;
+          }
+          break;
+
+        case 4: // Paeth
+          for (i = 0, end4 = scanlineLength; i < end4; i++) {
+            var paeth,
+              upperLeft;
+            byte = data[pos++];
+            col = (i - (i % pixelBytes)) / pixelBytes;
+            left = i < pixelBytes
+              ? 0
+              : pixels[c - pixelBytes];
+
+            if (row === 0) {
+              upper = (upperLeft = 0);
+            } else {
+              upper = pixels[((row - 1) * scanlineLength) + (col * pixelBytes) + (i % pixelBytes)];
+              upperLeft = col && pixels[((row - 1) * scanlineLength) + ((col - 1) * pixelBytes) + (i % pixelBytes)];
+            }
+
+            const p = (left + upper) - upperLeft;
+            const pa = Math.abs(p - left);
+            const pb = Math.abs(p - upper);
+            const pc = Math.abs(p - upperLeft);
+
+            if ((pa <= pb) && (pa <= pc)) {
+              paeth = left;
+            } else if (pb <= pc) {
+              paeth = upper;
+            } else {
+              paeth = upperLeft;
+            }
+
+            pixels[c++] = (byte + paeth) % 256;
+          }
+          break;
+
+        default:
+          throw new Error(`Invalid filter algorithm: ${data[pos - 1]}`);
+      }
+
+      row++;
+    }
+
+    return pixels
+  }
+
+  decodePalette() {
+    const {palette} = this;
+    const transparency = this.transparency.indexed || [];
+    const ret = Buffer.allocUnsafe((palette.length/3) * 4);
+    let pos = 0;
+    const {length} = palette;
+    let c = 0;
+
+    for (let i = 0, end = palette.length; i < end; i += 3) {
+      var left;
+      ret[pos++] = palette[i];
+      ret[pos++] = palette[i + 1];
+      ret[pos++] = palette[i + 2];
+      ret[pos++] = (left = transparency[c++]) != null
+        ? left
+        : 255;
+    }
+
+    return ret;
+  }
+
+  async toImageData(palette = this.decodePalette()) {
+    if (!this.decodedPixels) {
+      await this.decode()
+    }
+    // Allocate RGBA buffer
+    const pixels = new Uint8ClampedArray(this.decodedPixels.length * 4)
+    let j = 0
+    for (let i = 0; i < this.decodedPixels.length; i++) {
+      let index = this.decodedPixels[i] * 4
+      pixels[j++] = palette[index]    // R
+      pixels[j++] = palette[index+1]  // G
+      pixels[j++] = palette[index+2]  // B
+      pixels[j++] = palette[index+3]  // A
+    }
+    return new ImageData(pixels, this.width)
+  }
+
+  async decode() {
+    this.decodedPalette = this.decodePalette()
+    this.decodedPixels  = await this.decodePixels()
+  }
+};
+
+export default IndexedPNG;

src/range.js

@@ -0,0 +1,13 @@
+const range = (left, right, inclusive) => {
+  let range = [];
+  let ascending = left < right;
+  let end = !inclusive ? right : ascending ? right + 1 : right - 1;
+
+  for (let i = left; ascending ? i < end : i > end; ascending ? i++ : i--) {
+    range.push(i);
+  }
+
+  return range;
+}
+
+export default range;