124 lines
3.2 KiB
JavaScript
124 lines
3.2 KiB
JavaScript
import { authedAPIRequest } from "../../utils/auth";
|
|
|
|
/**
|
|
* @param {string} room
|
|
* @return {Promise<Object?>} The response Json object
|
|
*/
|
|
async function fetchCanvas(room) {
|
|
if (!room) {
|
|
console.error("Cannot fetch canvas of an undefined room");
|
|
return null;
|
|
}
|
|
|
|
const response = await authedAPIRequest("/rooms/" + room + "/canvas", {
|
|
method: "GET",
|
|
});
|
|
|
|
if (!response || !response.ok) {
|
|
console.error(
|
|
"Could not retrieve room canvas: " + response && response.statusText
|
|
? response.statusText
|
|
: "no more informations",
|
|
);
|
|
// console.debug(await response.text());
|
|
return null;
|
|
}
|
|
|
|
const res = await response.json();
|
|
|
|
console.debug(`Retrieved canvas for room ${room}:`);
|
|
// console.debug(res);
|
|
|
|
return res;
|
|
}
|
|
|
|
// 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),
|
|
);
|
|
};
|
|
|
|
// 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");
|
|
return null;
|
|
}
|
|
|
|
// Convert to a an array of strings representing binary (beurk)
|
|
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"),
|
|
);
|
|
}
|
|
// 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();
|
|
}
|
|
// console.debug(pixel_array)
|
|
|
|
// Convert into numbers
|
|
pixel_array = pixel_array.map((pixel) => parseInt(pixel, 2));
|
|
// console.debug(pixel_array)
|
|
|
|
return pixel_array;
|
|
}
|
|
|
|
// subscribe to the stream of a room
|
|
function subscribeToRoom() {}
|
|
|
|
// get the pixel info of a room
|
|
function getPixelInfo() {}
|
|
|
|
// place a pixel in a room
|
|
async function placePixel(room, posX, posY, color) {
|
|
if (!room) {
|
|
console.error("Cannot place pixel on an undefined room");
|
|
return null;
|
|
}
|
|
|
|
const response = await authedAPIRequest(
|
|
"/rooms/" + room + "/canvas/pixels",
|
|
{
|
|
method: "POST",
|
|
body: JSON.stringify({
|
|
posX: posX,
|
|
posY: posY,
|
|
color: color,
|
|
}),
|
|
},
|
|
);
|
|
|
|
if (!response || !response.ok) {
|
|
console.error(
|
|
"Could not place pixel on map: " + response && response.statusText
|
|
? response.statusText
|
|
: "no more informations",
|
|
);
|
|
// console.debug(await response.text());
|
|
return null;
|
|
}
|
|
|
|
const res = await response.json();
|
|
|
|
console.debug(
|
|
`Placed pixel on map at ${posX}:${posY} (${color}) in room ${room}:`,
|
|
);
|
|
// console.debug(res);
|
|
|
|
return res;
|
|
}
|
|
|
|
export { getCanvas, subscribeToRoom, getPixelInfo, placePixel };
|