hnininini

This commit is contained in:
Guillem George 2026-05-16 16:25:05 +02:00
parent 8cab4ac558
commit 50d46d0f0c
3 changed files with 59 additions and 33 deletions

View file

@ -37,13 +37,13 @@ socket.on("message", async (response) => {
} }
const pixels = await getCanvas(room); const pixels = await getCanvas(room);
if (!pixels) { if (!pixels) {
return; return;
} }
initCanvas(await getCurrentRoomConfig(), pixels);
console.debug("Loaded canvas")
initCanvas(await getCurrentRoomConfig(), pixels);
console.debug("Loaded canvas");
}); });
socket.on("pixel-update", async (msg) => { 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); console.error("Got server error: " + msg.error.json.message);
return; return;
} }
// console.debug("Here is msg.data") // console.debug("Here is msg.data")
// console.debug(msg.result.data.json) // console.debug(msg.result.data.json)
const { const {
roomSlug, // roomSlug,
posX, posX,
posY, posY,
color color,
} = msg.result.data.json } = msg.result.data.json;
const cfg = await getCurrentRoomConfig();
const cfg = await getCurrentRoomConfig()
if (!cfg || !cfg.settings || !cfg.settings.roomColors) { if (!cfg || !cfg.settings || !cfg.settings.roomColors) {
console.error("Internal error: Cannot access config after retrieving it") console.error(
console.debug(cfg) "Internal error: Cannot access config after retrieving it",
);
console.debug(cfg);
return; return;
} }
renderCanvasUpdate(color, posX, posY); renderCanvasUpdate(color, posX, posY);
}) });

View file

@ -14,8 +14,12 @@ async function fetchCanvas(room) {
method: "GET", method: "GET",
}); });
if (!response.ok) { if (!response || !response.ok) {
console.error("Could not retrieve room canvas: " + response.statusText); console.error(
"Could not retrieve room canvas: " + response
? response.statusText
: "null",
);
console.debug(await response.text()); console.debug(await response.text());
return null; return null;
} }
@ -29,38 +33,47 @@ async function fetchCanvas(room) {
} }
// Splits a string into fixed length substrings // Splits a string into fixed length substrings
String.prototype.chunk = function(size) { String.prototype.chunk = function (size) {
return [].concat.apply([], return [].concat.apply(
this.split('').map(function(x,i){ return i%size ? [] : this.slice(i,i+size) }, this) [],
) this.split("").map(function (x, i) {
} return i % size ? [] : this.slice(i, i + size);
}, this),
);
};
// get the canvas of a room and deserialize it // get the canvas of a room and deserialize it
async function getCanvas(room) { async function getCanvas(room) {
const raw_pixels = await fetchCanvas(room); const raw_pixels = await fetchCanvas(room);
if (!raw_pixels || !raw_pixels.pixels) { if (!raw_pixels || !raw_pixels.pixels) {
console.error("Aborting canvas deserialization") console.error("Aborting canvas deserialization");
return null; return null;
} }
// Convert to a an array of strings representing binary (beurk) // 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++) { 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) // console.debug(raw_binary_str)
// Chunk it to an array of fixed-length string (5) // Chunk it to an array of fixed-length string (5)
let pixel_array = raw_binary_str.chunk(5) let pixel_array = raw_binary_str.chunk(5);
if (pixel_array[pixel_array.length-1].length < 5)
pixel_array.pop() if (pixel_array[pixel_array.length - 1].length < 5) {
pixel_array.pop();
}
// console.debug(pixel_array) // console.debug(pixel_array)
// Convert into numbers // 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) // console.debug(pixel_array)
return pixel_array return pixel_array;
} }
// subscribe to the stream of a room // subscribe to the stream of a room

View file

@ -12,15 +12,16 @@ import { resetValues } from "./canvas/utils";
// - updateRoom (update a room's configuration) // - updateRoom (update a room's configuration)
// - deleteRoom (delete a room) // - deleteRoom (delete a room)
let roomConfig = null; let roomConfig = null;
function setCurrentRoomConfig(cfg) { function setCurrentRoomConfig(cfg) {
roomConfig = cfg; roomConfig = cfg;
} }
async function getCurrentRoomConfig() { async function getCurrentRoomConfig() {
if (!roomConfig) if (!roomConfig) {
await fetchRoomConfig(); await fetchRoomConfig();
}
return roomConfig; return roomConfig;
} }
async function joinRoom(room) { async function joinRoom(room) {
@ -45,8 +46,12 @@ async function joinRoom(room) {
async function listRooms() { async function listRooms() {
const response = await authedAPIRequest("/rooms/", { method: "GET" }); const response = await authedAPIRequest("/rooms/", { method: "GET" });
if (!response.ok) { if (!response || !response.ok) {
console.error("Could not retrieve rooms list: " + response.statusText); console.error(
"Could not retrieve rooms list: " + response
? response.statusText
: "null",
);
console.debug(await response.text()); console.debug(await response.text());
return; return;
} }
@ -80,8 +85,12 @@ async function fetchRoomConfig(room) {
method: "GET", method: "GET",
}); });
if (!response.ok) { if (!response || !response.ok) {
console.error("Could not retrieve room config: " + response.statusText); console.error(
"Could not retrieve room config" + response
? response.statusText
: "null",
);
console.debug(await response.text()); console.debug(await response.text());
return; return;
} }