added the WebGL build with multithreads and simd enabled.

EnoxSoftware · Apr 7, 2024 · aacc920 · aacc920
1 parent be1d6b8
commit aacc920
Show file tree

Hide file tree

Showing 168 changed files with 1,742,651 additions and 26 deletions.
diff --git a/webgl_example/Build/opencvforunityexample.data.unityweb b/webgl_example/Build/opencvforunityexample.data.unityweb
diff --git a/webgl_example/Build/opencvforunityexample.framework.js.unityweb b/webgl_example/Build/opencvforunityexample.framework.js.unityweb
diff --git a/webgl_example/Build/opencvforunityexample.loader.js b/webgl_example/Build/opencvforunityexample.loader.js
diff --git a/webgl_example/Build/opencvforunityexample.wasm.unityweb b/webgl_example/Build/opencvforunityexample.wasm.unityweb
diff --git a/webgl_example/TemplateData/MemoryProfiler.png b/webgl_example/TemplateData/MemoryProfiler.png
diff --git a/webgl_example/TemplateData/style.css b/webgl_example/TemplateData/style.css
@@ -1,7 +1,7 @@
 body { padding: 0; margin: 0 }
 #unity-container { position: absolute }
 #unity-container.unity-desktop { left: 50%; top: 50%; transform: translate(-50%, -50%) }
-#unity-container.unity-mobile { width: 100%; height: 100% }
+#unity-container.unity-mobile { position: fixed; width: 100%; height: 100% }
 #unity-canvas { background: #231F20 }
 .unity-mobile #unity-canvas { width: 100%; height: 100% }
 #unity-loading-bar { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); display: none }
@@ -10,7 +10,7 @@ body { padding: 0; margin: 0 }
 #unity-progress-bar-full { width: 0%; height: 18px; margin-top: 10px; background: url('progress-bar-full-dark.png') no-repeat center }
 #unity-footer { position: relative }
 .unity-mobile #unity-footer { display: none }
-#unity-webgl-logo { float:left; width: 204px; height: 38px; background: url('webgl-logo.png') no-repeat center }
+#unity-logo-title-footer { float:left; width: 102px; height: 38px; background: url('unity-logo-title-footer.png') no-repeat center }
 #unity-build-title { float: right; margin-right: 10px; line-height: 38px; font-family: arial; font-size: 18px }
-#unity-fullscreen-button { float: right; width: 38px; height: 38px; background: url('fullscreen-button.png') no-repeat center }
+#unity-fullscreen-button { cursor:pointer; float: right; width: 38px; height: 38px; background: url('fullscreen-button.png') no-repeat center }
 #unity-warning { position: absolute; left: 50%; top: 5%; transform: translate(-50%); background: white; padding: 10px; display: none }
diff --git a/webgl_example/TemplateData/unity-logo-title-footer.png b/webgl_example/TemplateData/unity-logo-title-footer.png
diff --git a/webgl_example/TemplateData/webgl-logo.png b/webgl_example/TemplateData/webgl-logo.png
diff --git a/webgl_example/TemplateData/webmemd-icon.png b/webgl_example/TemplateData/webmemd-icon.png
diff --git a/webgl_example/index.html b/webgl_example/index.html
@@ -3,13 +3,13 @@
   <head>
     <meta charset="utf-8">
     <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
-    <title>Unity WebGL Player | OpenCVForUnityExample2.5.9</title>
+    <title>Unity Web Player | OpenCVForUnityExample2.5.9</title>
     <link rel="shortcut icon" href="TemplateData/favicon.ico">
     <link rel="stylesheet" href="TemplateData/style.css">
   </head>
   <body>
     <div id="unity-container" class="unity-desktop">
-      <canvas id="unity-canvas" width=960 height=600></canvas>
+      <canvas id="unity-canvas" width=960 height=600 tabindex="-1"></canvas>
       <div id="unity-loading-bar">
         <div id="unity-logo"></div>
         <div id="unity-progress-bar-empty">
@@ -18,18 +18,13 @@
       </div>
       <div id="unity-warning"> </div>
       <div id="unity-footer">
-        <div id="unity-webgl-logo"></div>
+        <div id="unity-logo-title-footer"></div>
         <div id="unity-fullscreen-button"></div>
         <div id="unity-build-title">OpenCVForUnityExample2.5.9</div>
       </div>
     </div>
     <script>
-      var container = document.querySelector("#unity-container");
       var canvas = document.querySelector("#unity-canvas");
-      var loadingBar = document.querySelector("#unity-loading-bar");
-      var progressBarFull = document.querySelector("#unity-progress-bar-full");
-      var fullscreenButton = document.querySelector("#unity-fullscreen-button");
-      var warningBanner = document.querySelector("#unity-warning");
 
       // Shows a temporary message banner/ribbon for a few seconds, or
       // a permanent error message on top of the canvas if type=='error'.
@@ -38,6 +33,7 @@
       // way that non-critical warnings and error messages are presented to the
       // user.
       function unityShowBanner(msg, type) {
+        var warningBanner = document.querySelector("#unity-warning");
         function updateBannerVisibility() {
           warningBanner.style.display = warningBanner.children.length ? 'block' : 'none';
         }
@@ -58,6 +54,7 @@
       var buildUrl = "Build";
       var loaderUrl = buildUrl + "/opencvforunityexample.loader.js";
       var config = {
+        arguments: [],
         dataUrl: buildUrl + "/opencvforunityexample.data.unityweb",
         frameworkUrl: buildUrl + "/opencvforunityexample.framework.js.unityweb",
         codeUrl: buildUrl + "/opencvforunityexample.wasm.unityweb",
@@ -82,38 +79,40 @@
         meta.name = 'viewport';
         meta.content = 'width=device-width, height=device-height, initial-scale=1.0, user-scalable=no, shrink-to-fit=yes';
         document.getElementsByTagName('head')[0].appendChild(meta);
-        container.className = "unity-mobile";
+        document.querySelector("#unity-container").className = "unity-mobile";
         canvas.className = "unity-mobile";
 
         // To lower canvas resolution on mobile devices to gain some
         // performance, uncomment the following line:
         // config.devicePixelRatio = 1;
 
-        unityShowBanner('WebGL builds are not supported on mobile devices.');
+
       } else {
         // Desktop style: Render the game canvas in a window that can be maximized to fullscreen:
-
         canvas.style.width = "960px";
         canvas.style.height = "600px";
       }
 
-      loadingBar.style.display = "block";
+      document.querySelector("#unity-loading-bar").style.display = "block";
 
       var script = document.createElement("script");
       script.src = loaderUrl;
       script.onload = () => {
         createUnityInstance(canvas, config, (progress) => {
-          progressBarFull.style.width = 100 * progress + "%";
-        }).then((unityInstance) => {
-          loadingBar.style.display = "none";
-          fullscreenButton.onclick = () => {
-            unityInstance.SetFullscreen(1);
-          };
-        }).catch((message) => {
-          alert(message);
-        });
-      };
+          document.querySelector("#unity-progress-bar-full").style.width = 100 * progress + "%";
+              }).then((unityInstance) => {
+                document.querySelector("#unity-loading-bar").style.display = "none";
+                document.querySelector("#unity-fullscreen-button").onclick = () => {
+                  unityInstance.SetFullscreen(1);
+                };
+
+              }).catch((message) => {
+                alert(message);
+              });
+            };
+
       document.body.appendChild(script);
+
     </script>
   </body>
 </html>
diff --git a/webgl_example_threads/Build/opencvforunityexample.data b/webgl_example_threads/Build/opencvforunityexample.data
diff --git a/webgl_example_threads/Build/opencvforunityexample.framework.js b/webgl_example_threads/Build/opencvforunityexample.framework.js