diff --git a/package.json b/package.json index 308d879..5817062 100644 --- a/package.json +++ b/package.json @@ -15,7 +15,7 @@ "bower": "~1.8.0", "browserify": "~14.4.0", "cross-spawn": "~5.1.0", - "deeplearn": "0.3.4", + "deeplearn": "0.3.6", "http-server": "~0.10.0", "jasmine-core": "~2.6.4", "polymer-bundler": "~3.0.1", diff --git a/src/support.js b/src/support.js index fd21912..5070c4c 100644 --- a/src/support.js +++ b/src/support.js @@ -50,26 +50,43 @@ function isWebGLEnabled() { } function isNotSupported() { - return isMobile() || isSafari() || !isWebGLEnabled(); + return isMobile() || isSafari(); +} + +function buildAndShowDialog(title, content) { + var dialogContainer = document.createElement('div'); + dialogContainer.innerHTML = ` + + ${title} + + ${content} + + + `; + document.body.appendChild(dialogContainer); + var dialog = document.getElementById('dialog'); + dialog.style.width = '430px'; + dialogPolyfill.registerDialog(dialog); + dialog.showModal(); } function inializePolymerPage() { document.addEventListener('WebComponentsReady', function(event) { if (isNotSupported()) { - var dialogContainer = document.createElement('div'); - dialogContainer.innerHTML = ` - - This device is not yet supported - - We do not yet support your device, please try to load this demo on a desktop computer with Chrome. We are working hard to add support for other devices. Check back soon! - - + const title = `This device is not yet supported`; + const content = ` + We do not yet support your device, please try to load this demo on a desktop computer with Chrome. + We are working hard to add support for other devices. Check back soon! + `; + buildAndShowDialog(title, content); + } else if (!isWebGLEnabled()) { + const title = `Check if hardware acceleration is enabled`; + const content = ` + Looks like your device is supported but settings aren't in place. + Please check if WebGL is enabled for your browser. + See: How can I enable WebGL in my browser? `; - document.body.appendChild(dialogContainer); - var dialog = document.getElementById('dialog'); - dialog.style.width = '400px'; - dialogPolyfill.registerDialog(dialog); - dialog.showModal(); + buildAndShowDialog(title, content); } else { var bundleScript = document.createElement('script'); bundleScript.src = 'bundle.js';
${content}
We do not yet support your device, please try to load this demo on a desktop computer with Chrome. We are working hard to add support for other devices. Check back soon!