Add the OpenVINO.js framework

examples/image_classification/ImageClassificationExample.js

@@ -20,6 +20,8 @@ class ImageClassificationExample extends BaseCameraExample {
       case 'OpenCV.js':
         runner = new ImageClassificationOpenCVRunner();
         break;
+      case 'OpenVINO.js':
+        runner = new ImageClassificationOpenVINORunner();
     }
     runner.setProgressHandler(updateLoadingProgressComponent);
     return runner;
@@ -28,6 +30,7 @@ class ImageClassificationExample extends BaseCameraExample {
   /** @override */
   _processExtra = (output) => {
     let labelClasses;
+    console.log(output);
     switch (this._currentFramework) {
       case 'WebNN':
         const deQuantizeParams =  this._runner.getDeQuantizeParams();
@@ -36,6 +39,8 @@ class ImageClassificationExample extends BaseCameraExample {
       case 'OpenCV.js':
         labelClasses = getTopClasses(output.tensor, output.labels, 3);
         break;
+      case 'OpenVINO.js':
+        labelClasses = getTopClasses(output.tensor, output.labels, 3);
     }
     $('#inferenceresult').show();
     labelClasses.forEach((c, i) => {

examples/image_classification/ImageClassificationOpenVINORunner.js

@@ -0,0 +1,17 @@
+class ImageClassificationOpenVINORunner extends OpenVINORunner {
+    constructor() {
+      super();
+    }
+
+    /** @override */
+    _getOutputTensor = () => {
+      const postSoftmax = this._postOptions.softmax || false;
+      let outputTensor;
+      if(postSoftmax) {
+        outputTensor = softmax(this._output);
+      } else {
+        outputTensor = this._output;
+      }
+      return outputTensor;
+    };
+}

examples/image_classification/index.html

@@ -371,6 +371,15 @@ <h5 class="modal-title" id="modaltitle">Subgraphs Summary</h5>
     </div>
   </div>
 
+  <script>
+      try {
+        window.nodeRequire = require;
+        delete window.exports;
+        delete window.module;
+      } catch(e) {
+        console.log("Node module is not supported");
+      }
+  </script>
   <script src='../static/lib/jquery/jquery.min.js'></script>
   <script src='../static/lib/jquery/jquery-migrate-3.0.1.min.js'></script>
   <script src='../static/lib/superfish/superfish.min.js'></script>
@@ -390,6 +399,7 @@ <h5 class="modal-title" id="modaltitle">Subgraphs Summary</h5>
   <script src='../util/BaseRunner.js'></script>
   <script src='../util/WebNNRunner.js'></script>
   <script src='../util/OpenCVRunner.js'></script>
+  <script src='../util/OpenVINORunner.js'></script>
   <script src='../util/BaseApp.js'></script>
   <script src='../util/BaseExample.js'></script>
   <script src='../util/BaseCameraExample.js'></script>
@@ -408,6 +418,7 @@ <h5 class="modal-title" id="modaltitle">Subgraphs Summary</h5>
   <script src='../util/caffe2/Caffe2ModelUtils.js'></script>
   <script src='../util/caffe2/Caffe2ModelImporter.js'></script>
   <script src='ImageClassificationOpenCVRunner.js'></script>
+  <script src='ImageClassificationOpenVINORunner.js'></script>
   <script src='ImageClassificationExample.js'></script>
   <script src='main.js'></script>
 

examples/image_classification/main.js

@@ -1,6 +1,7 @@
 const example = new ImageClassificationExample({model: imageClassificationModels});
 
 let specialoffer = () => {
+  //http://localhost:8080/examples/image_classification_opencv/?prefer=none&b=WASM&m=resnet50_v1_openvino&s=image&d=0&f=WebNN
   let f = parseSearchParams('f')
   let url = location.href.replace('image_classification/', 'image_classification_opencv/')
   let urlimg = url.replace('s=camera', 's=image')
@@ -27,6 +28,11 @@ $(document).ready(() => {
   $('#frameworkWebNN').click(function() {
     $('#opencvspecial').hide()
   })
+
+  $('#frameworkOpenVINOjs').click(function() {
+    $('#opencvspecial').hide()
+  })
+
 });
 
 $(window).load(() => {

examples/index.html

@@ -496,6 +496,15 @@ <h3>
     </svg>
   </a>
 
+  <script>
+    try {
+      window.nodeRequire = require;
+      delete window.exports;
+      delete window.module;
+    } catch(e) {
+      console.log("Node module is not supported");
+    }
+  </script>
   <script src='static/lib/jquery/jquery.min.js'></script>
   <script src='static/lib/jquery/jquery-migrate-3.0.1.min.js'></script>
   <script src='static/lib/superfish/superfish.min.js'></script>

examples/semantic_segmentation/SemanticSegmentationExample.js

@@ -149,6 +149,9 @@ class SemanticSegmentationExample extends BaseCameraExample {
       case 'OpenCV.js':
         runner = new SemanticSegmentationOpenCVRunner();
         break;
+      case 'OpenVINO.js':
+        runner = new SemanticSegmentationOpenVINORunner();
+        break;
     }
     runner.setProgressHandler(updateLoadingProgressComponent);
     return runner;

examples/semantic_segmentation/SemanticSegmentationOpenVINORunner.js

@@ -0,0 +1,17 @@
+class SemanticSegmentationOpenVINORunner extends OpenVINORunner {
+    constructor() {
+        super();
+    }
+
+    /** @override */
+    _getOutputTensorTypedArray = () => {
+        return Int32Array;
+    };
+
+    /** @override */
+    _getOutputTensor = () => {
+        let outputTensor = this._output;
+        return outputTensor;
+    };
+
+}

examples/semantic_segmentation/index.html

@@ -390,6 +390,15 @@ <h5 class='modal-title' id='modaltitle'>Subgraphs Summary</h5>
     </div>
   </div>
 
+  <script>
+      try {
+        window.nodeRequire = require;
+        delete window.exports;
+        delete window.module;
+      } catch(e) {
+        console.log("Node module is not supported");
+      }
+  </script>
   <script src='../static/lib/jquery/jquery.min.js'></script>
   <script src='../static/lib/jquery/jquery-migrate-3.0.1.min.js'></script>
   <script src='../static/lib/superfish/superfish.min.js'></script>
@@ -411,6 +420,7 @@ <h5 class='modal-title' id='modaltitle'>Subgraphs Summary</h5>
   <script src='../util/BaseRunner.js'></script>
   <script src='../util/WebNNRunner.js'></script>
   <script src='../util/OpenCVRunner.js'></script>
+  <script src='../util/OpenVINORunner.js'></script>
   <script src='../util/BaseApp.js'></script>
   <script src='../util/BaseExample.js'></script>
   <script src='../util/BaseCameraExample.js'></script>
@@ -436,6 +446,7 @@ <h5 class='modal-title' id='modaltitle'>Subgraphs Summary</h5>
   <script src='SemanticSegmentationRunner.js'></script>
   <script src='SemanticSegmentationExample.js'></script>
   <script src='SemanticSegmentationOpenCVRunner.js'></script>
+  <script src='SemanticSegmentationOpenVINORunner.js'></script>
   <script src='main.js'></script>
 
 

examples/speech_commands/SpeechCommandsExample.js

@@ -33,7 +33,14 @@ class SpeechCommandsExample extends BaseMircophoneExample {
 
   /** @override */
   _createRunner = () => {
-    const runner = new WebNNRunner();
+    let runner;
+    switch (this._currentFramework) {
+      case 'WebNN':
+        runner = new WebNNRunner();
+        break;
+      case 'OpenVINO.js':
+        runner = new OpenVINORunner();
+    }
     runner.setProgressHandler(updateLoadingProgressComponent);
     return runner;
   };

examples/speech_commands/index.html

@@ -402,6 +402,16 @@ <h5 class='modal-title' id='modaltitle'>Subgraphs Summary</h5>
       </div>
     </div>
   </div>
+
+  <script>
+      try {
+        window.nodeRequire = require;
+        delete window.exports;
+        delete window.module;
+      } catch(e) {
+        console.log("Node module is not supported");
+      }
+  </script>
   <script src='../static/lib/jquery/jquery.min.js'></script>
   <script src='../static/lib/jquery/jquery-migrate-3.0.1.min.js'></script>
   <script src='../static/lib/superfish/superfish.min.js'></script>
@@ -420,6 +430,7 @@ <h5 class='modal-title' id='modaltitle'>Subgraphs Summary</h5>
   <script src='../util/modelZoo.js'></script>
   <script src='../util/BaseRunner.js'></script>
   <script src='../util/WebNNRunner.js'></script>
+  <script src='../util/OpenVINORunner.js'></script>
   <script src='../util/BaseApp.js'></script>
   <script src='../util/BaseExample.js'></script>
   <script src='../util/BaseMircophoneExample.js'></script>

examples/speech_recognition/SpeechRecognitionExample.js

@@ -19,7 +19,14 @@ class SpeechRecognitionExample extends BaseMircophoneExample {
 
   /** @override */
   _createRunner = () => {
-    const runner = new SpeechRecognitionRunner();
+    let runner;
+    switch (this._currentFramework) {
+      case 'WebNN':
+        runner = new SpeechRecognitionRunner();
+        break;
+      case 'OpenVINO.js':
+        runner = new SpeechRecognitionOpenVINORunner();
+    }
     runner.setProgressHandler(updateLoadingProgressComponent);
     return runner;
   };

examples/speech_recognition/SpeechRecognitionOpenVINORunner.js

@@ -0,0 +1,22 @@
+class SpeechRecognitionOpenVINORunner extends OpenVINORunner {
+    constructor() {
+      super();
+    }
+
+    _getInputTensor = (input) => {
+      let infer_req = this._execNet.createInferRequest();
+      const input_blob = infer_req.getBlob(this._inputInfo.name());
+      const input_data = new Float32Array(input_blob.wmap());
+
+      for(let index = 0; index < input.length; index++) {
+        input_data[index] = input[index];
+      }
+      input_blob.unmap();
+      this._inferReq = infer_req;
+    };
+
+    _getOutputTensor = () => {
+      let outputTensor = this._output;
+      return outputTensor;
+    };
+  }

examples/speech_recognition/index.html

@@ -302,6 +302,16 @@ <h5 class='modal-title' id='modaltitle'>Subgraphs Summary</h5>
       </div>
     </div>
   </div>
+
+  <script>
+      try {
+        window.nodeRequire = require;
+        delete window.exports;
+        delete window.module;
+      } catch(e) {
+        console.log("Node module is not supported");
+      }
+  </script>
   <script src='../static/lib/jquery/jquery.min.js'></script>
   <script src='../static/lib/jquery/jquery-migrate-3.0.1.min.js'></script>
   <script src='../static/lib/superfish/superfish.min.js'></script>
@@ -320,6 +330,7 @@ <h5 class='modal-title' id='modaltitle'>Subgraphs Summary</h5>
   <script src='../util/modelZoo.js'></script>
   <script src='../util/BaseRunner.js'></script>
   <script src='../util/WebNNRunner.js'></script>
+  <script src='../util/OpenVINORunner.js'></script>
   <script src='../util/BaseApp.js'></script>
   <script src='../util/BaseExample.js'></script>
   <script src='../util/BaseMircophoneExample.js'></script>
@@ -330,6 +341,7 @@ <h5 class='modal-title' id='modaltitle'>Subgraphs Summary</h5>
   <script src='../util/openvino/OpenVINOModelImporter.js'></script>
 
   <script src='SpeechRecognitionRunner.js'></script>
+  <script src='SpeechRecognitionOpenVINORunner.js'></script>
   <script src='SpeechRecognitionExample.js'></script>
   <script src='main.js'></script>
 

examples/static/js/ui.common.js

@@ -176,7 +176,7 @@ const singleModelTable = (modelList, category) => {
 const setModelComponents = (models, selectedModelIdStr) => {
   $('.model').remove();
   let formatTypes = [];
-
+  console.log(models);
   for (let [category, modelList] of Object.entries(models)) {
     let formats = singleModelTable(modelList, category);
     formatTypes.push(...formats);