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
|
import { Data, checkApiRes, mFetch } from "../../helpers/helpers";
function getCanvasAndCtx(): [HTMLCanvasElement, CanvasRenderingContext2D] {
let canvas = document.getElementsByTagName("canvas")[0],
ctx = canvas.getContext("2d");
if (ctx === null) {
document.write("ur muther is fat, stop using IE");
throw new Error("Player is using browser older that his mom");
} else return [canvas, ctx];
}
function setOpponents(data: Data) {
// Start game
console.log("startGame.ts: data: ", data)
let tds = document.getElementsByClassName("player-name"),
colors = ["primary", "danger", "success", "warning"],
replacement = { name: "", color: "" };
for (let i = 0; i < 4; i++) {
if (data[i] !== undefined) {
replacement.name = data[i].name;
replacement.color = colors[i];
} else {
replacement.name = "?";
replacement.color = "secondary";
}
tds[i].innerHTML = replacement.name;
tds[i].classList.add("bg-" + replacement.color);
}
}
function readyStateToggle(e: MouseEvent) {
mFetch("/readyStateToggle", { state: (e.target as any).checked });
}
export default async function (data: Data) {
console.log(data);
let body = await (await fetch("/map.html")).text();
document.body.innerHTML = body;
setOpponents(data);
document.getElementsByTagName("input")[0].onclick = readyStateToggle;
let [canvas, ctx] = getCanvasAndCtx();
let img = new Image(600, 600);
img.width = 600;
img.height = 600;
img.src = "https://www.egierki.pl/app/uploads/2020/05/Ludo-Play.jpg";
img.onload = () => ctx.drawImage(img, 0, 0);
}
|
