Add ability to pass an HTMLImageElement

Author: Kevin Scott

package.json

@@ -1,6 +1,6 @@
 {
   "name": "ml-classifier",
-  "version": "0.3.6",
+  "version": "0.3.7",
   "description": "A machine learning engine for quickly training image classification models in your browser",
   "main": "dist/index.js",
   "typings": "dist/index.d.ts",

src/translateImages.ts

@@ -1,5 +1,29 @@
-const translateImages = async (origImages: Array<tf.Tensor3D | HTMLImageElement>) => {
-  return origImages;
+const loadImage = async (src: string) => new Promise<HTMLImageElement>((resolve, reject) => {
+  const image = new Image();
+  image.src = src;
+  image.onload = () => resolve(image);
+  image.onerror = (err) => reject(err);
+});
+
+const translateImages = async (origImages: Array<tf.Tensor3D | HTMLImageElement | string>) => {
+  const images = [];
+
+  for (let i = 0; i < origImages.length; i++) {
+    let image = origImages[i];
+
+    if (typeof image === 'string') {
+      const loadedImage = await loadImage(image);
+      image = tf.fromPixels(loadedImage);
+    } else if (image.src) {
+      const loadedImage = await loadImage(image.src);
+      image = tf.fromPixels(loadedImage);
+    }
+    // else, it is a tensor
+
+    images.push(image);
+  }
+
+  return images;
 }
 
 export translateImages;