Added joining rooms and logic to start game by votes

1 files changed, 32 insertions, 10 deletions

diff --git a/frontend/ts/startGame.ts b/frontend/ts/startGame.ts
index 50ef068..a14742f 100644
--- a/frontend/ts/startGame.ts
+++ b/frontend/ts/startGame.ts
@@ -1,23 +1,45 @@
+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");
+    throw new Error("Player is using browser older that his mom");
   } else return [canvas, ctx];
 }
-function setOpponents(data: object, body: string) {
-  let a = [
-    {
-      id: 1,
-      color: "red",
+
+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";
     }
-  ]
-  document.body.innerHTML = body;
+    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 startGame (data: object) {
+
+export default async function (data: Data) {
+  console.log(data);
   let body = await (await fetch("/map.html")).text();
-  setOpponents(data, body);
+  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;