From 2de35be8d9823f7afb4fa5f928cb702dbc2c5276 Mon Sep 17 00:00:00 2001
From: UnknownShadow200 <unknownshadow200@gmail.com>
Date: Sat, 22 Aug 2020 16:18:39 +1000
Subject: [PATCH] Fix hosting-webclient.md not working with very recent
 emscripten

Emscripten doesn't special case '#canvas' to Module['canvas'] anymore, instead it does document.querySelector('#canvas'). So give the canvas element the id of 'canvas' instead of 'GameCanvas' to make it work.

Also change the 'exception thrown' message to include the actual javascript error message.
---
 doc/hosting-webclient.md | 13 +++++--------
 1 file changed, 5 insertions(+), 8 deletions(-)

diff --git a/doc/hosting-webclient.md b/doc/hosting-webclient.md
index b88ae06ce..2b43bf98f 100644
--- a/doc/hosting-webclient.md
+++ b/doc/hosting-webclient.md
@@ -20,11 +20,8 @@ The play.html page is the trickiest part, because how to implement this is websi
 
 You are required to have this HTML code somewhere in the page:
 ```HTML
-<style>
-/* the canvas *must not* have any border or padding, or mouse coords will be wrong */
-#GameCanvas { display:block; border:0; padding:0; background-color: black; }
-</style>
-<canvas id="GameCanvas" oncontextmenu="event.preventDefault()" tabindex=-1></canvas>
+<!-- the canvas *must not* have any border or padding, or mouse coords will be wrong -->
+<canvas id="canvas" style="display:block; border:0; padding:0; background-color: black;" oncontextmenu="event.preventDefault()" tabindex=-1></canvas>
 <span id="logmsg"></span>
 
 <script type='text/javascript'>
@@ -51,7 +48,7 @@ You are required to have this HTML code somewhere in the page:
       if (arguments.length > 1) text = Array.prototype.slice.call(arguments).join(' ');
       console.error(text);
     },
-    canvas: (function() { return document.getElementById('GameCanvas'); })(),
+    canvas: (function() { return document.getElementById('canvas'); })(),
     setStatus: function(text) {
       console.log(text);
       document.getElementById('logmsg').innerHTML = text;
@@ -63,9 +60,9 @@ You are required to have this HTML code somewhere in the page:
     }
   };
   Module.setStatus('Downloading...');
-  window.onerror = function(event) {
+  window.onerror = function(msg) {
     // TODO: do not warn on ok events like simulating an infinite loop or exitStatus
-    Module.setStatus('Exception thrown, see JavaScript console');
+    Module.setStatus('Exception thrown, see JavaScript console (' + msg + ')');
     Module.setStatus = function(text) {
       if (text) Module.printErr('[post-exception status] ' + text);
     };