Display an error message if WebGL is not supported.

Change-Id: I244f572737b5a118752970e928ea3fefbefffe52
Reviewed-by: Andras Becsi <andras.becsi@digia.com>

2 files changed, 13 insertions, 2 deletions

diff --git a/basicsuite/webengine/content/webgl/helloqt.html b/basicsuite/webengine/content/webgl/helloqt.html
index 56c336c..95f0a44 100644
--- a/basicsuite/webengine/content/webgl/helloqt.html
+++ b/basicsuite/webengine/content/webgl/helloqt.html
@@ -7,6 +7,7 @@
       body {
         margin: 0px;
         overflow: hidden;
+        background-color: black;
       }
       canvas {
 /*        -webkit-transform: scale3d(2.0, 2.0, 1.0);
diff --git a/basicsuite/webengine/content/webgl/helloqt.js b/basicsuite/webengine/content/webgl/helloqt.js
index d0ae216..b514628 100644
--- a/basicsuite/webengine/content/webgl/helloqt.js
+++ b/basicsuite/webengine/content/webgl/helloqt.js
@@ -2,8 +2,8 @@ var shadow = false;
 
 var container = document.getElementById("container");
 var camera = null;
-var scene = new THREE.Scene();
-var renderer = new THREE.WebGLRenderer({ antialias: false /*true*/ });
+var scene;
+var renderer;
 var cbTexture;
 var cbScene;
 var cbCamera;
@@ -196,6 +196,16 @@ var onMouseMove = function (e) {
 };
 
 var main = function () {
+    scene = new THREE.Scene();
+    try {
+        renderer = new THREE.WebGLRenderer({ antialias: false /*true*/ });
+    } catch (e) {
+        console.log("Could not create WebGLRenderer.");
+        container.innerHTML = noWebGLMessage= "<div style=\"font-family: monospace; font-size: 13px; margin: 5em auto 0px; padding: 2em; width: 400px; "
+            + "height 100px; text-align: center; background-color: rgb(238, 238, 238);\">WebGLRenderer could not be created.</div>";
+        return;
+    }
+
     container.appendChild(renderer.domElement);
     onResize();
     window.addEventListener("resize", onResize);