hnininini
This commit is contained in:
parent
8cab4ac558
commit
50d46d0f0c
3 changed files with 59 additions and 33 deletions
|
|
@ -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);
|
||||||
})
|
});
|
||||||
|
|
|
||||||
|
|
@ -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
|
||||||
|
|
|
||||||
|
|
@ -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;
|
||||||
}
|
}
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue