73 lines
2.7 KiB
HTML
73 lines
2.7 KiB
HTML
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8" />
|
|
<title>Play of the Game</title>
|
|
<style>
|
|
html,
|
|
body,
|
|
canvas {
|
|
margin: 0px;
|
|
padding: 0px;
|
|
width: 100%;
|
|
height: 100%;
|
|
overflow: hidden;
|
|
position: absolute;
|
|
z-index: 0;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body style="margin: 0; padding: 0; height: 100vh; width: 100vw">
|
|
<canvas id="glcanvas" tabindex="1" hidden></canvas>
|
|
<script src="https://not-fl3.github.io/miniquad-samples/mq_js_bundle.js"></script>
|
|
<script type="module">
|
|
import init, { set_wasm } from "./static/frontend.js";
|
|
async function impl_run() {
|
|
let wbg = await init();
|
|
miniquad_add_plugin({
|
|
register_plugin: (a) => (a.wbg = wbg),
|
|
on_init: () => set_wasm(wasm_exports),
|
|
version: "0.0.1",
|
|
name: "wbg",
|
|
});
|
|
load("./static/frontend_bg.wasm");
|
|
}
|
|
window.run = function (join_type) {
|
|
console.log("Joining as: ", join_type);
|
|
var xhr = new XMLHttpRequest();
|
|
xhr.open("POST", "./login/" + join_type);
|
|
xhr.onload = function (event) {
|
|
console.log("Starting game...", event.target);
|
|
document.getElementById("run-container").remove();
|
|
document
|
|
.getElementById("glcanvas")
|
|
.removeAttribute("hidden");
|
|
document.getElementById("glcanvas").focus();
|
|
impl_run();
|
|
};
|
|
// or onerror, onabort
|
|
var formData = new FormData(document.getElementById("login"));
|
|
xhr.send(JSON.stringify(Object.fromEntries(formData));
|
|
};
|
|
</script>
|
|
<div
|
|
id="run-container"
|
|
style="
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
height: 100%;
|
|
flex-direction: column;
|
|
"
|
|
>
|
|
<form id="login">
|
|
<label for="username">Username:</label><br />
|
|
<input type="text" id="username" name="username" /><br />
|
|
<label for="gamecode">Gamecode:</label><br />
|
|
<input type="text" id="gamecode" name="gamecode" /><br />
|
|
</form>
|
|
<button onclick="run('join')">Join Game</button>
|
|
<button onclick="run('host')">Host Game</button>
|
|
</div>
|
|
</body>
|
|
</html>
|