Join us

src/rooms/canvas/index.js

@@ -1,7 +1,35 @@
-// FIXME: This file should handle the room canvas API
-// Link buttons to their respective functions
-// Functions may include:
-// - getCanvas (get the canvas of a room and deserialize it)
-// - subscribeToRoom (subscribe to the stream of a room)
-// - getPixelInfo (get the pixel info of a room)
-// - placePixel (place a pixel in a room)
+import { authedAPIRequest } from "../../utils/auth";
+
+// get the canvas of a room and deserialize it
+async function getCanvas(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.ok) {
+        console.error("Could not retrieve room canvas: " + response.statusText);
+        console.debug(await response.text());
+        return null;
+    }
+
+    const res = await response.json();
+
+    console.debug(`Retrieved canvas for room ${room}:`);
+    console.debug(res);
+
+    return res;
+}
+
+// subscribe to the stream of a room
+function subscribeToRoom() {}
+// get the pixel info of a room
+function getPixelInfo() {}
+// place a pixel in a room
+function placePixel() {}
+
+export { getCanvas, subscribeToRoom, getPixelInfo, placePixel };

src/rooms/index.js

@@ -1,5 +1,6 @@
 import { authedAPIRequest } from "../utils/auth";
-import { socket } from "../pages/index";
+import { subscribe } from "../utils/streams";
+import { resetValues } from "./canvas/utils";
 // FIXME: This file should handle the rooms API
 // Functions may include:
 // - fetchRoomConfig (get the configuration of a room)
@@ -11,7 +12,7 @@ import { socket } from "../pages/index";
 // - updateRoom (update a room's configuration)
 // - deleteRoom (delete a room)
 
-const roomsConfig = null;
+const roomsConfig = {};
 
 function setCurrentRoomConfig(room, cfg) {
     roomsConfig[room] = cfg;
@@ -20,26 +21,42 @@ function getCurrentRoomConfig(room) {
     return roomsConfig[room];
 }
 async function joinRoom(room) {
-    socket.on("connection", (sockett) => {
-        sockett.join(room);
+    // socket.on('connection', (sockett) => {
+    //   sockett.join(room);
+    // broadcast to all connected clients in the room
+    // socket.to('some room').emit('hello', 'world');
+    // broadcast to all connected clients except those in the room
+    // socket.except('some room').emit('hello', 'world');
+    // });
 
-        // broadcast to all connected clients in the room
-        // socket.to('some room').emit('hello', 'world');
-
-        // broadcast to all connected clients except those in the room
-        // socket.except('some room').emit('hello', 'world');
-    });
+    resetValues();
+    subscribe(room);
 }
 
 // async function leaveRoom(room) {
-//   io.on('connection', (socket) => {
+//   socket.on('connection', (socket) => {
 //     socket.leave(room);
 //   })
 // }
 
-// async function listRooms() {
+async function listRooms() {
+    const response = await authedAPIRequest("/rooms/", { method: "GET" });
 
-// }
+    if (!response.ok) {
+        console.error("Could not retrieve rooms list: " + response.statusText);
+        console.debug(await response.text());
+        return;
+    }
+
+    const res = await response.json();
+
+    console.debug("Retrieved rooms list");
+    console.debug(res);
+
+    // Update HTML
+    // const roomNameElt = document.getElementById("room-name");
+    // roomNameElt.innerText = res.metadata.name;
+}
 // async function createRoom() {
 
 // }
@@ -84,7 +101,7 @@ export {
     setCurrentRoomConfig,
     getCurrentRoomConfig,
     joinRoom,
-    // listRooms,
+    listRooms,
     // createRoom,
     // updateRoom,
     // deleteRoom