fix imagefx and add dev builds

demo/browser.js

@@ -12,10 +12,10 @@ const userConfig = {}; // add any user configuration overrides
 
 /*
 const userConfig = {
-  // backend: 'humangl',
+  backend: 'wasm',
   async: false,
   videoOptimized: false,
-  face: { enabled: true, detector: { modelPath: '../models/faceboxes.json' }, iris: { enabled: false }, mesh: { enabled: false }, age: { enabled: false }, gender: { enabled: false }, emotion: { enabled: true } },
+  face: { enabled: true, iris: { enabled: false }, mesh: { enabled: true }, age: { enabled: true }, gender: { enabled: true }, emotion: { enabled: true } },
   body: { enabled: false },
   hand: { enabled: false },
 };

package.json

@@ -33,13 +33,13 @@
     "@tensorflow/tfjs-layers": "^3.1.0",
     "@tensorflow/tfjs-node": "^3.1.0",
     "@tensorflow/tfjs-node-gpu": "^3.1.0",
-    "@types/node": "^14.14.30",
+    "@types/node": "^14.14.31",
     "@typescript-eslint/eslint-plugin": "^4.15.1",
     "@typescript-eslint/parser": "^4.15.1",
     "@vladmandic/pilogger": "^0.2.14",
     "chokidar": "^3.5.1",
     "dayjs": "^1.10.4",
-    "esbuild": "^0.8.49",
+    "esbuild": "^0.8.50",
     "eslint": "^7.20.0",
     "eslint-config-airbnb-base": "^14.2.1",
     "eslint-plugin-import": "^2.22.1",
@@ -50,7 +50,7 @@
     "seedrandom": "^3.0.5",
     "simple-git": "^2.35.1",
     "tslib": "^2.1.0",
-    "typescript": "^4.3.0-dev.20210219"
+    "typescript": "^4.3.0-dev.20210221"
   },
   "scripts": {
     "start": "node --trace-warnings --unhandled-rejections=strict --trace-uncaught --no-deprecation src/node.js",

src/human.ts

@@ -346,13 +346,15 @@ class Human {
     return faceRes;
   }
 
-  async image(input, userConfig = {}) {
+  /*
+  async processImage(input, userConfig = {}) {
     this.state = 'image';
     this.config = mergeDeep(this.config, userConfig);
     const process = image.process(input, this.config);
     process?.tensor?.dispose();
     return process?.canvas;
   }
+  */
 
   // main detect function
   async detect(input, userConfig = {}) {

src/image.ts

@@ -7,6 +7,8 @@ import * as fxImage from './imagefx';
 // internal temp canvases
 let inCanvas = null;
 let outCanvas = null;
+// instance of fximage
+let fx = null;
 
 // process input image and return tensor
 // input can be tensor, imagedata, htmlimageelement, htmlvideoelement
@@ -37,29 +39,30 @@ export function process(input, config) {
     if (input instanceof ImageData) ctx.putImageData(input, 0, 0);
     else ctx.drawImage(input, 0, 0, originalWidth, originalHeight, 0, 0, inCanvas.width, inCanvas.height);
     if (config.filter.enabled) {
-      if (!this.fx || !outCanvas || (inCanvas.width !== outCanvas.width) || (inCanvas.height !== outCanvas.height)) {
+      if (!fx || !outCanvas || (inCanvas.width !== outCanvas.width) || (inCanvas.height !== outCanvas.height)) {
         outCanvas = (typeof OffscreenCanvas !== 'undefined') ? new OffscreenCanvas(inCanvas.width, inCanvas.height) : document.createElement('canvas');
         if (outCanvas.width !== inCanvas.width) outCanvas.width = inCanvas.width;
         if (outCanvas.height !== inCanvas.height) outCanvas.height = inCanvas.height;
-        this.fx = tf.ENV.flags.IS_BROWSER ? new fxImage.GLImageFilter({ canvas: outCanvas }) : null; // && (typeof document !== 'undefined')
+        log('created FX filter');
+        fx = tf.ENV.flags.IS_BROWSER ? new fxImage.GLImageFilter({ canvas: outCanvas }) : null; // && (typeof document !== 'undefined')
       }
-      if (!this.fx) return inCanvas;
-      this.fx.reset();
-      this.fx.addFilter('brightness', config.filter.brightness); // must have at least one filter enabled
-      if (config.filter.contrast !== 0) this.fx.addFilter('contrast', config.filter.contrast);
-      if (config.filter.sharpness !== 0) this.fx.addFilter('sharpen', config.filter.sharpness);
-      if (config.filter.blur !== 0) this.fx.addFilter('blur', config.filter.blur);
-      if (config.filter.saturation !== 0) this.fx.addFilter('saturation', config.filter.saturation);
-      if (config.filter.hue !== 0) this.fx.addFilter('hue', config.filter.hue);
-      if (config.filter.negative) this.fx.addFilter('negative');
-      if (config.filter.sepia) this.fx.addFilter('sepia');
-      if (config.filter.vintage) this.fx.addFilter('brownie');
-      if (config.filter.sepia) this.fx.addFilter('sepia');
-      if (config.filter.kodachrome) this.fx.addFilter('kodachrome');
-      if (config.filter.technicolor) this.fx.addFilter('technicolor');
-      if (config.filter.polaroid) this.fx.addFilter('polaroid');
-      if (config.filter.pixelate !== 0) this.fx.addFilter('pixelate', config.filter.pixelate);
-      this.fx.apply(inCanvas);
+      if (!fx) return inCanvas;
+      fx.reset();
+      fx.addFilter('brightness', config.filter.brightness); // must have at least one filter enabled
+      if (config.filter.contrast !== 0) fx.addFilter('contrast', config.filter.contrast);
+      if (config.filter.sharpness !== 0) fx.addFilter('sharpen', config.filter.sharpness);
+      if (config.filter.blur !== 0) fx.addFilter('blur', config.filter.blur);
+      if (config.filter.saturation !== 0) fx.addFilter('saturation', config.filter.saturation);
+      if (config.filter.hue !== 0) fx.addFilter('hue', config.filter.hue);
+      if (config.filter.negative) fx.addFilter('negative');
+      if (config.filter.sepia) fx.addFilter('sepia');
+      if (config.filter.vintage) fx.addFilter('brownie');
+      if (config.filter.sepia) fx.addFilter('sepia');
+      if (config.filter.kodachrome) fx.addFilter('kodachrome');
+      if (config.filter.technicolor) fx.addFilter('technicolor');
+      if (config.filter.polaroid) fx.addFilter('polaroid');
+      if (config.filter.pixelate !== 0) fx.addFilter('pixelate', config.filter.pixelate);
+      fx.apply(inCanvas);
       // read pixel data
       /*
       const gl = outCanvas.getContext('webgl');
@@ -83,7 +86,7 @@ export function process(input, config) {
       */
     } else {
       outCanvas = inCanvas;
-      if (this.fx) this.fx = null;
+      if (fx) fx = null;
     }
     let pixels;
     if (outCanvas.data) {

src/imagefx.js

@@ -97,8 +97,6 @@ export function GLImageFilter(params) {
       // eslint-disable-next-line no-unused-expressions
       (_vertexBuffer = gl.createBuffer(), gl.bindBuffer(gl.ARRAY_BUFFER, _vertexBuffer));
       gl.bufferData(gl.ARRAY_BUFFER, vertices, gl.STATIC_DRAW);
-      // Note sure if this is a good idea; at least it makes texture loading
-      // in Ejecta instant.
       gl.pixelStorei(gl.UNPACK_PREMULTIPLY_ALPHA_WEBGL, true);
     }
     gl.viewport(0, 0, _width, _height);