<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>nightshade-api example</title>
<base data-trunk-public-url />
<style type="text/css">
:focus {
outline: none;
}
body,
html {
margin: 0;
padding: 0;
width: 100%;
height: 100%;
overflow: hidden;
background: #000;
}
.root {
width: 100%;
height: 100%;
display: flex;
justify-content: center;
align-items: center;
}
.main-canvas {
display: block;
width: 100%;
height: 100%;
}
</style>
</head>
<body>
<link data-trunk rel="rust" href="Cargo.toml" data-cargo-profile-release="wasm-release" data-wasm-opt="3" data-wasm-opt-params="--enable-bulk-memory --enable-nontrapping-float-to-int --enable-reference-types --enable-sign-ext --enable-mutable-globals" />
<div class="root">
<canvas class="main-canvas" id="canvas"></canvas>
</div>
<script>
function resizeCanvas() {
const canvas = document.getElementById("canvas");
const dpr = window.devicePixelRatio || 1;
const width = window.innerWidth;
const height = window.innerHeight;
canvas.width = Math.round(width * dpr);
canvas.height = Math.round(height * dpr);
canvas.style.width = width + "px";
canvas.style.height = height + "px";
}
resizeCanvas();
window.addEventListener("resize", resizeCanvas);
</script>
</body>
</html>