lobyign almost done

client/public/game/index.js

@@ -10,12 +10,12 @@ function onConnect()
 
 function onLobbyJoin(lobby)
 {
-    
+
 }
 
 function onDisconnect()
 {
     destructLobbies();
     
-
+    document.location.href = document.location.href + '../';
 }

client/public/game/lobbies.js

@@ -48,11 +48,11 @@ function createLobby()
     const lobbyPrivate = document.querySelector('#lobby-input-private').checked;
     const lobbySpectators = document.querySelector('#lobby-input-spectators').checked;
 
-    if (lobbyName === "")
+    if (lobbyName === '')
     {
         const errorDiv = document.createElement('div');
-        errorDiv.id = "lobby-error";
-        errorDiv.innerHTML = "ERROR: LobbyName is required";
+        errorDiv.id = 'lobby-error';
+        errorDiv.innerHTML = 'ERROR: LobbyName is required';
         errorDiv.classList.add('red');
         CreateLobbyBlock.appendChild(errorDiv);
         return;
@@ -83,12 +83,38 @@ function createLobby()
         document.querySelector('#lobby-error').remove();
 }
 
-socket.on('lobby-create-success', (...args) => {
-    console.log(args);
+socket.on('lobby-create-success', lobby => {
+    showActive();
+    const lobbyDiv = document.createElement('div');
+    lobbyDiv.id = lobby.id;
+
+    // TODO: Make drawlobby function
+    lobbyDiv.innerHTML += `<h2>Lobby ${lobby.name}</h2><p><h3>Join Code: <b>${lobby.uid}</b></h3><p>Players:`;
+    
+    for (const player of lobby.players)
+        lobbyDiv.innerHTML += player.name + ' ';
+
+    if (lobby.allowspectators)
+    {
+        lobbyDiv.innerHTML += '<p>Spectators:';
+        for (const player of lobby.spectators)
+            lobbyDiv.innerHTML += player.name + ' '; 
+    }
+
+    lobbyDiv.innerHTML += `<p>Visibility: ${lobby.visibility}<p>State: ${lobby.state}`
+
+    lobbyDiv.innerHTML += '<input type="button" value="Start Game" onclick="" disabled>'
+    lobbyDiv.innerHTML += '<input type="button" value="Leave Lobby" onclick="destructLobbies()">'
+
+    ActiveLobbyBlock.appendChild(lobbyDiv);
 });
 
 socket.on('lobby-create-error', (...args) => {
-    console.log('ERROR:', args);
+    const errorDiv = document.createElement('div');
+    errorDiv.id = 'lobby-error';
+    errorDiv.innerHTML = 'ERROR: An error occured while creating the lobby' + JSON.stringify(args);
+    errorDiv.classList.add('red');
+    CreateLobbyBlock.appendChild(errorDiv);
 });
 
 
@@ -97,11 +123,11 @@ function joinLobby()
     const lobbyID = document.querySelector('#lobby-input-join-id').value;
     const joinAsSpectator = document.querySelector('#lobby-input-join-spectator').checked;
 
-    if (lobbyID === "")
+    if (lobbyID === '')
     {
         const errorDiv = document.createElement('div');
-        errorDiv.id = "lobby-error";
-        errorDiv.innerHTML = "ERROR: A Lobby ID is required";
+        errorDiv.id = 'lobby-error';
+        errorDiv.innerHTML = 'ERROR: A Lobby ID is required';
         errorDiv.classList.add('red');
         JoinLobbyBlock.appendChild(errorDiv);
         return;
@@ -140,9 +166,23 @@ socket.on('lobby-join-error', (...args) => {
 });
 
 
+socket.on('lobby-update');
+
+
+function leaveLobby()
+{
+    // TODO: if in lobby AND owner of lobby
+    socket.emit('lobby-destroy');
+
+    // TODO: if in lobby
+    socket.emit('lobby-leave');
+
+}
+
 function destructLobbies()
 {
     LobbiesBlock.style.display = 'none';
     CreateLobbyBlock.style.display = 'none';
     JoinLobbyBlock.style.display = 'none';
+    ActiveLobbyBlock.style.display = 'none';
 }

server/src/lobbies.js

@@ -7,8 +7,8 @@ LOBBY OBJECT
     uid: uid,
     name: string
     owneruid: useruid,
-    players: [uids],
-    spectators: [uids],
+    players: [{uid, name}],
+    spectators: [{uid, name}],
     // PUBLIC, PRIVATE
     visibility: 'PUBLIC',
     allowspectators: bool,

server/src/socketserver.js

@@ -50,7 +50,10 @@ async function Router(socket)
     socket.on('identify', args => ClientIdentify(socket, args));
 
     socket.on('lobby-create', args => LobbyCreate(socket, args));
+    socket.on('lobby-destroy');
+
     socket.on('lobby-join', args => LobbyJoin(socket, args));
+    socket.on('lobby-leave');
 
 
     socket.on('disconnect', args => HandleDisconnect(socket, ...args));
@@ -114,8 +117,7 @@ function LobbyCreate(socket, args)
         return;
     }
 
-    console.log(args);
-    if (!args.lobbyName || args.lobbyPrivate === undefined || args.lobbySpectators === undefined)
+        if (!args.lobbyName || args.lobbyPrivate === undefined || args.lobbySpectators === undefined)
     {
         err.addError(400, 'Bad Request', 'Lobby malformed');
         socket.emit('lobby-create-error', err.toError);