-
Notifications
You must be signed in to change notification settings - Fork 2
/
Copy pathindex.html
71 lines (67 loc) · 2.16 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
<html>
<head>
<meta content="text/html;charset=utf-8" http-equiv="Content-Type" />
</head>
<body>
<canvas id="game-canvas"></canvas>
<script type="module">
import init, { Universe } from "./pkg/ipi_game.js";
let universe;
let wasm;
const canvas = document.getElementById("game-canvas");
const ctx = canvas.getContext("2d");
let colors = ["#ff0000", "#00ff00", "#eaea8a", "#cbf1f2"];
function draw() {
window.requestAnimationFrame(draw);
ctx.fillStyle = "#070219";
ctx.fillRect(0, 0, window.innerWidth, window.innerHeight);
let ptr = universe.tick();
let data = new Uint32Array(wasm.memory.buffer, ptr);
ctx.font = "30px Arial";
ctx.strokeText("Score: " + data[1], 10, 40);
let index = 2;
if (data[index] > 0) {
ctx.strokeStyle = colors[0];
ctx.beginPath();
ctx.moveTo(data[index], data[index + 1]);
ctx.lineTo(data[index + 2], data[index + 3]);
ctx.stroke();
index += 4;
} else {
index += 1;
}
for (let c = 0; c < 4; c++) {
ctx.fillStyle = colors[c];
let n = data[index++];
for (let i = 0; i < n; i++) {
ctx.beginPath();
ctx.arc(
data[index],
data[index + 1],
data[index + 2],
0,
Math.PI * 2,
true
);
ctx.fill();
index += 3;
}
}
}
async function run() {
wasm = await init();
canvas.width = window.innerWidth;
canvas.height = window.innerHeight;
canvas.addEventListener("click", function () {
universe.free_packet();
});
universe = Universe.new(window.innerWidth, window.innerHeight, 3);
alert(
"Game objective: Transmit the packet from source planet to destination planet and then back again to the source planet.\nBoth source and destination are marked green.\nControls: Click to transmit packet"
);
window.requestAnimationFrame(draw);
}
run();
</script>
</body>
</html>