Skip to content

Instantly share code, notes, and snippets.

Last active September 14, 2022 13:39
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
Star You must be signed in to star a gist
What would you like to do?
<!DOCTYPE html>
<meta charset="utf-8">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<style type="text/css">
* {
margin: 0;
padding: 0;
background-color: #222;
canvas {
border: 0px none;
outline: none;
background-color: black;
width: 100%;
height: 100%;
display: block;
margin-left: auto;
margin-right: auto;
.overlay {
position: absolute;
top: 10px;
left: 10px;
z-index: 1;
font-size: 30px;
color: white;
background-color: black;
<dir class="overlay" id="overlay-text">Loading...</dir>
<script type='text/javascript'>
var Module = {};
.then(response =>
).then(buffer => {
Module.canvas = document.getElementById("canvas");
Module.wasmBinary = buffer;
var script = document.createElement('script');
script.src = "index.js";
script.onload = function() {
console.log("Emscripten boilerplate loaded.")
// When you click outside the canvas on input stops working, this fixes it
Module.canvas.onclick = function() {
Module.setStatus = function(text) {
console.log('status:', text);
document.getElementById("overlay-text").innerHTML = text;
<canvas id="canvas" tabindex=0></canvas>
Copy link

The above .html file is a free and unencumbered software released into the public domain.
For more information, please refer to <>

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment