diff options
author | Samuel Johnson <[email protected]> | 2025-05-07 00:08:29 -0400 |
---|---|---|
committer | Samuel Johnson <[email protected]> | 2025-05-07 00:08:29 -0400 |
commit | 5f383da62c7a80526634b68c28d7ba9d9e693e75 (patch) | |
tree | 7a8e1e8b6d4dcc07126f9e65ca2618aee0c920be /wrapper.html | |
parent | 4223fb686b99a5db73da79fb73123568b75822ed (diff) |
Diffstat (limited to 'wrapper.html')
-rw-r--r-- | wrapper.html | 91 |
1 files changed, 91 insertions, 0 deletions
diff --git a/wrapper.html b/wrapper.html new file mode 100644 index 0000000..0bd537b --- /dev/null +++ b/wrapper.html @@ -0,0 +1,91 @@ +<!DOCTYPE html> +<html> +<head> + <meta charset="utf-8"> + <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> + <style> + body { + color: white; + background-color: black; + } + + header { + text-align: center; + } + + #loading_bg { + position: absolute; + left: 25%; + top: 50%; + + width: 50%; + background-color: grey; + } + + #loading_bar { + width: 0%; + padding: 2px; + background-color: red; + } + + .game_canvas { + display: none; + margin: auto; + outline-style: double; + outline-color: red; + } + </style> +</head> +<body> + <header> + <h1>This Starless Sky</h1> + <p>we are deserving of no gifts.</p? + </header> + <main> + <div id="loading_bg"> + <div id="loading_bar"></div> + </div> + <canvas class="game_canvas" id="canvas" oncontextmenu="event.preventDefault()" tabindex=-1></canvas> + </main> + <script> + let progressBar = document.getElementById("loading_bar"); + let canvas = document.getElementById("canvas"); + + function convertStatusToNumeric (status) { + if (status === "Running...") { + return 100; + } else if (status.length === 0) { + return 0; + } + + // Ungodly regex from the depths of hell, see + // https://github.com/emscripten-core/emscripten/issues/16278#issuecomment-2178303577 + const regExp = RegExp(/([^(]+)\((\d+(\.\d+)?)\/(\d+)\)/); + const matches = regExp.exec(status); + + if (matches) { + const currentValue = parseInt(matches[2]); + const maxValue = parseInt(matches[4]); + return (currentValue * 100) / maxValue; + } else { + return NaN; + } + } + + var Module = { + setStatus (status) { + if (progressBar.style.width !== "100%") { + const percentage = convertStatusToNumeric(status); + progressBar.style.width = percentage + "%"; + } else { + progressBar.style.display = "none"; + canvas.style.display = "block"; + } + }, + + }; + </script> + {{{ SCRIPT }}} +</body> +</html> + |