Web: Disable WebGPU button if WebGPU is not supported (close #216)

DiligentGraphics · Aug 28, 2024 · c632314 · c632314
1 parent 12428ec
commit c632314
Showing 1 changed file with 10 additions and 2 deletions.
diff --git a/SampleBase/src/Emscripten/resources/emscripten_template.html.in b/SampleBase/src/Emscripten/resources/emscripten_template.html.in
@@ -201,8 +201,8 @@
         <div class="card">
             <h1>Select Graphics API</h1>
             <div class="button-container">
-                <button class="webgl" onclick="loadWasm('gles')" @DILIGENT_DISABLE_WEBGL@ >WebGL</button>
-                <button class="webgpu" onclick="loadWasm('wgpu')">WebGPU</button>
+                <button class="webgl" id="webgl-button" onclick="loadWasm('gles')" @DILIGENT_DISABLE_WEBGL@>WebGL</button>
+                <button class="webgpu" id="webgpu-button" onclick="loadWasm('wgpu')">WebGPU</button>
             </div>
         </div>
         <div class="loading-indicator" id="loading-indicator">
@@ -223,6 +223,13 @@
             }
         }
 
+        function checkWebGPUSupport() {
+            const webgpuButton = document.getElementById('webgpu-button');
+            if (!navigator.gpu) {
+                webgpuButton.disabled = true;
+            }
+        }
+
         var initWebGPUDevice = (async () => {
             const requiredFeatures = [
                 "depth-clip-control",
@@ -308,6 +315,7 @@
         };
 
         detectBrowser();
+        checkWebGPUSupport()
 
         window.onerror = function () {
             console.log("onerror: " + event);