diff --git a/src/pages/index.js b/src/pages/index.js index c555a68..d65784a 100644 --- a/src/pages/index.js +++ b/src/pages/index.js @@ -37,13 +37,13 @@ socket.on("message", async (response) => { } const pixels = await getCanvas(room); + if (!pixels) { return; } - - initCanvas(await getCurrentRoomConfig(), pixels); - console.debug("Loaded canvas") + initCanvas(await getCurrentRoomConfig(), pixels); + console.debug("Loaded canvas"); }); socket.on("pixel-update", async (msg) => { @@ -53,21 +53,25 @@ socket.on("pixel-update", async (msg) => { console.error("Got server error: " + msg.error.json.message); return; } + // console.debug("Here is msg.data") // console.debug(msg.result.data.json) const { - roomSlug, + // roomSlug, posX, posY, - color - } = msg.result.data.json + color, + } = msg.result.data.json; + + const cfg = await getCurrentRoomConfig(); - const cfg = await getCurrentRoomConfig() if (!cfg || !cfg.settings || !cfg.settings.roomColors) { - console.error("Internal error: Cannot access config after retrieving it") - console.debug(cfg) + console.error( + "Internal error: Cannot access config after retrieving it", + ); + console.debug(cfg); return; } - + renderCanvasUpdate(color, posX, posY); -}) +}); diff --git a/src/rooms/canvas/index.js b/src/rooms/canvas/index.js index 67d735e..7af13c2 100644 --- a/src/rooms/canvas/index.js +++ b/src/rooms/canvas/index.js @@ -14,8 +14,12 @@ async function fetchCanvas(room) { method: "GET", }); - if (!response.ok) { - console.error("Could not retrieve room canvas: " + response.statusText); + if (!response || !response.ok) { + console.error( + "Could not retrieve room canvas: " + response + ? response.statusText + : "null", + ); console.debug(await response.text()); return null; } @@ -29,38 +33,47 @@ async function fetchCanvas(room) { } // Splits a string into fixed length substrings -String.prototype.chunk = function(size) { - return [].concat.apply([], - this.split('').map(function(x,i){ return i%size ? [] : this.slice(i,i+size) }, this) - ) -} +String.prototype.chunk = function (size) { + return [].concat.apply( + [], + this.split("").map(function (x, i) { + return i % size ? [] : this.slice(i, i + size); + }, this), + ); +}; // get the canvas of a room and deserialize it async function getCanvas(room) { const raw_pixels = await fetchCanvas(room); + if (!raw_pixels || !raw_pixels.pixels) { - console.error("Aborting canvas deserialization") + console.error("Aborting canvas deserialization"); return null; } // Convert to a an array of strings representing binary (beurk) - let raw_binary_str = "" + let raw_binary_str = ""; + for (let i = 0; i < raw_pixels.pixels.length; i++) { - raw_binary_str = raw_binary_str.concat(raw_pixels.pixels.charCodeAt(i).toString(2).padStart(8, "0")) + raw_binary_str = raw_binary_str.concat( + raw_pixels.pixels.charCodeAt(i).toString(2).padStart(8, "0"), + ); } // console.debug(raw_binary_str) - + // Chunk it to an array of fixed-length string (5) - let pixel_array = raw_binary_str.chunk(5) - if (pixel_array[pixel_array.length-1].length < 5) - pixel_array.pop() + let pixel_array = raw_binary_str.chunk(5); + + if (pixel_array[pixel_array.length - 1].length < 5) { + pixel_array.pop(); + } // console.debug(pixel_array) // Convert into numbers - pixel_array = pixel_array.map((pixel) => parseInt( pixel, 2 )) + pixel_array = pixel_array.map((pixel) => parseInt(pixel, 2)); // console.debug(pixel_array) - return pixel_array + return pixel_array; } // subscribe to the stream of a room diff --git a/src/rooms/index.js b/src/rooms/index.js index 9fccaf8..c383c17 100644 --- a/src/rooms/index.js +++ b/src/rooms/index.js @@ -12,15 +12,16 @@ import { resetValues } from "./canvas/utils"; // - updateRoom (update a room's configuration) // - deleteRoom (delete a room) - let roomConfig = null; function setCurrentRoomConfig(cfg) { roomConfig = cfg; } async function getCurrentRoomConfig() { - if (!roomConfig) + if (!roomConfig) { await fetchRoomConfig(); + } + return roomConfig; } async function joinRoom(room) { @@ -45,8 +46,12 @@ async function joinRoom(room) { async function listRooms() { const response = await authedAPIRequest("/rooms/", { method: "GET" }); - if (!response.ok) { - console.error("Could not retrieve rooms list: " + response.statusText); + if (!response || !response.ok) { + console.error( + "Could not retrieve rooms list: " + response + ? response.statusText + : "null", + ); console.debug(await response.text()); return; } @@ -80,8 +85,12 @@ async function fetchRoomConfig(room) { method: "GET", }); - if (!response.ok) { - console.error("Could not retrieve room config: " + response.statusText); + if (!response || !response.ok) { + console.error( + "Could not retrieve room config" + response + ? response.statusText + : "null", + ); console.debug(await response.text()); return; }