From f8aadba85b24b0dcfb0168aedb0c08ca20b4b067 Mon Sep 17 00:00:00 2001
From: Davor Hrg <hrgdavor@gmail.com>
Date: Sat, 17 Jul 2021 10:22:11 +0200
Subject: [PATCH 1/2] Update viewer.js

---
 packages/web/src/ui/views/viewer.js | 18 +++++++++++++++++-
 1 file changed, 17 insertions(+), 1 deletion(-)

diff --git a/packages/web/src/ui/views/viewer.js b/packages/web/src/ui/views/viewer.js
index 6e75bc650..f7bb8daee 100644
--- a/packages/web/src/ui/views/viewer.js
+++ b/packages/web/src/ui/views/viewer.js
@@ -191,13 +191,29 @@ const viewer = (state, i18n) => {
   return el
 }
 
+const createContext = (canvas, contextAttributes) => {
+  const get = (name) => {
+    try {
+      return canvas.getContext(name, contextAttributes)
+    } catch (e) {
+      return null
+    }
+  }
+  return (
+    get('webgl2') ||
+    get('webgl') ||
+    get('experimental-webgl') ||
+    get('webgl-experimental')
+  )
+}
+
 const setup = (element) => {
   // prepare the camera
   const camera = Object.assign({}, perspectiveCamera.defaults)
   camera.position = [150, -180, 233]
 
   const viewerOptions = {
-    glOptions: { canvas: element },
+    glOptions: { gl: createContext(element) },
     camera,
     drawCommands: {
       // draw commands bootstrap themselves the first time they are run

From 0ff4ae0e950e1eaf25de15bd786669b1f5d23751 Mon Sep 17 00:00:00 2001
From: Davor Hrg <hrgdavor@gmail.com>
Date: Tue, 20 Jul 2021 22:45:08 +0200
Subject: [PATCH 2/2] webgl2 and OES_element_index_uint requirement

---
 packages/web/src/ui/views/viewer.js | 19 +++++++++++++++----
 1 file changed, 15 insertions(+), 4 deletions(-)

diff --git a/packages/web/src/ui/views/viewer.js b/packages/web/src/ui/views/viewer.js
index f7bb8daee..1fe0a09ba 100644
--- a/packages/web/src/ui/views/viewer.js
+++ b/packages/web/src/ui/views/viewer.js
@@ -53,6 +53,7 @@ const viewer = (state, i18n) => {
 
   if (!render) {
     const options = setup(el)
+    if (options.error) return html`<b style="color:red; background:white; position:fixed; z-index:10; top:50%">${options.error}</b>`
     viewerOptions = options.viewerOptions
     camera = options.camera
     render = prepareRender(viewerOptions)
@@ -192,9 +193,9 @@ const viewer = (state, i18n) => {
 }
 
 const createContext = (canvas, contextAttributes) => {
-  const get = (name) => {
+  const get = (type) => {
     try {
-      return canvas.getContext(name, contextAttributes)
+      return { gl: canvas.getContext(type, contextAttributes), type }
     } catch (e) {
       return null
     }
@@ -209,11 +210,14 @@ const createContext = (canvas, contextAttributes) => {
 
 const setup = (element) => {
   // prepare the camera
+  let error
   const camera = Object.assign({}, perspectiveCamera.defaults)
   camera.position = [150, -180, 233]
 
+  const { gl, type } = createContext(element)
+
   const viewerOptions = {
-    glOptions: { gl: createContext(element) },
+    glOptions: { gl },
     camera,
     drawCommands: {
       // draw commands bootstrap themselves the first time they are run
@@ -225,7 +229,14 @@ const setup = (element) => {
     // data
     entities: []
   }
-  return { viewerOptions, camera }
+  if (type === 'webgl') {
+    if (!gl.getExtension('OES_element_index_uint')) {
+      error = 'Your browser uses an old version of WebGL without OES_element_index_uint. Please upgrade your browser to use this application'
+    }
+
+    viewerOptions.glOptions.optionalExtensions = ['oes_element_index_uint']
+  }
+  return { viewerOptions, camera, error }
 }
 
 const resize = (viewerElement) => {