bouaaaaaaaaaaaah

src/pages/index.js

@@ -1,7 +1,7 @@
 import { initSocket, socket, subscribe } from "../utils/streams";
 import { calculateLayout } from "./utils";
 import { authenticate, refreshToken } from "../utils/auth";
-import { initCanvas } from "../rooms/canvas/utils";
+import { initCanvas, renderCanvasUpdate } from "../rooms/canvas/utils";
 import { getCanvas } from "../rooms/canvas/index";
 import { fetchRoomConfig, getCurrentRoomConfig } from "../rooms/index";
 
@@ -20,7 +20,7 @@ await initSocket();
 await subscribe(room, "pixel-update");
 // Main event
 socket.on("message", async (response) => {
-    console.debug("Received server evemt: ");
+    console.debug("Received server event on message: ");
     console.debug(response);
     if (response.error) {
         console.error("Got server error: " + response.error.json.message);
@@ -36,11 +36,38 @@ socket.on("message", async (response) => {
         await fetchRoomConfig(room);
     }
 
-    const canvasResp = getCanvas(room);
-
-    if (!canvasResp || canvasResp.pixels) {
+    const pixels = await getCanvas(room);
+    if (!pixels) {
         return;
     }
+    
+    initCanvas(await getCurrentRoomConfig(), pixels);
+    console.debug("Loaded canvas")
 
-    initCanvas(getCurrentRoomConfig(), canvasResp.pixels);
 });
+
+socket.on("pixel-update", async (msg) => {
+    // console.debug("Received server event on pixel-update: ");
+    // console.debug(msg);
+    if (msg.error) {
+        console.error("Got server error: " + msg.error.json.message);
+        return;
+    }
+    // console.debug("Here is msg.data")
+    // console.debug(msg.result.data.json)
+    const {
+        roomSlug,
+        posX,
+        posY,
+        color
+    } = msg.result.data.json
+
+    const cfg = await getCurrentRoomConfig()
+    if (!cfg || !cfg.settings || !cfg.settings.roomColors) {
+        console.error("Internal error: Cannot access config after retrieving it")
+        console.debug(cfg)
+        return;
+    }
+    
+    renderCanvasUpdate(color, posX, posY);
+})