lobby system functional

This commit is contained in:
Ben Kyd
2021-03-17 21:21:33 +00:00
parent 62dc952566
commit d21ea5dd43
10 changed files with 70 additions and 21 deletions

0
client/README Normal file
View File

13
client/game.html Normal file
View File

@@ -0,0 +1,13 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Scrabble!</title>
</head>
<body>
</body>
</html>

View File

@@ -74,6 +74,9 @@
</div>
<textarea id="log-console" rows="10" cols=auto placeholder="log console" disabled></textarea>
<script src="index.js"></script>
<script src="init.js"></script>
<script src="lobbies.js"></script>

View File

@@ -1,16 +1,15 @@
// page control logic
function pageLog(message)
{
document.querySelector('#log-console').value += message + "\n"
document.querySelector('#log-console').scrollTop = document.querySelector('#log-console').scrollHeight
}
function onConnect()
{
initLobbies();
}
function onLobbyJoin(lobby)
{
}
function onDisconnect()

View File

@@ -41,6 +41,8 @@ function showActive()
ActiveLobbyBlock.style.display = 'block';
}
// TODO: Lobbylist & buttons
function drawLobby(lobby)
{
const lobbyDiv = document.createElement('div');
@@ -114,7 +116,7 @@ function createLobby()
document.querySelector('#lobby-error').remove();
}
socket.on('lobby-create-success', lobby => {
socket.on('lobby-create-success', obj => {
if (document.querySelector('#lobby-success'))
document.querySelector('#lobby-success').innerHTML = "";
@@ -122,6 +124,7 @@ socket.on('lobby-create-success', lobby => {
successDiv.id = 'lobby-success';
successDiv.innerHTML = 'SUCCESS: Lobby created, Joining...';
CreateLobbyBlock.appendChild(successDiv);
pageLog(`created lobby ${obj.lobby.uid} (${(obj.lobby.name)})`);
});
socket.on('lobby-create-error', obj => {
@@ -133,15 +136,16 @@ socket.on('lobby-create-error', obj => {
errorDiv.innerHTML = 'ERROR: An error occured while creating the lobby' + JSON.stringify(args);
errorDiv.classList.add('red');
CreateLobbyBlock.appendChild(errorDiv);
pageLog('ERROR: An error occured while creating the lobby ' + JSON.stringify(args));
});
function joinLobby()
{
const lobbyID = document.querySelector('#lobby-input-join-id').value;
const lobbyuid = document.querySelector('#lobby-input-join-id').value;
const joinAsSpectator = document.querySelector('#lobby-input-join-spectator').checked;
if (lobbyID === '')
if (lobbyuid === '')
{
const errorDiv = document.createElement('div');
errorDiv.id = 'lobby-error';
@@ -167,17 +171,21 @@ function joinLobby()
user: {
uid: user.uid
},
lobbyID: lobbyID,
lobbyuid: lobbyuid,
joinAsSpectator: joinAsSpectator
});
if (document.querySelector('#lobby-error'))
document.querySelector('#lobby-error').remove();
pageLog(`joining lobby ${lobbyuid}`);
}
socket.on('lobby-join-success', lobby => {
showActive();
drawLobby(lobby);
pageLog(`joined lobby ${lobby.uid} (${(lobby.name)})`);
});
socket.on('lobby-join-error', obj => {
@@ -186,12 +194,12 @@ socket.on('lobby-join-error', obj => {
const errorDiv = document.createElement('div');
errorDiv.id = 'lobby-error';
errorDiv.innerHTML = 'ERROR: An error occured while joining the lobby ' + JSON.stringify(args);
errorDiv.innerHTML = 'ERROR: An error occured while joining the lobby ' + JSON.stringify(obj);
errorDiv.classList.add('red');
JoinLobbyBlock.appendChild(errorDiv);
pageLog('ERROR: An error occured while joining the lobby ' + JSON.stringify(obj));
});
socket.on('lobby-update', obj => {
if (!obj) return;
if (!obj.state) return;
@@ -199,13 +207,25 @@ socket.on('lobby-update', obj => {
if (!obj.lobby) return;
drawLobby(obj.lobby);
});
if (obj.state === 'lobby-join')
pageLog(`${obj.updateuser.username} joined`);
if (obj.state ==='lobby-leave')
pageLog(`${obj.updateuser.username} left`);
if (obj.state === 'lobby-deregister')
{
pageLog(`${obj.updateuser.username} deregistered lobby`);
leaveLobby();
}
});
function leaveLobby()
{
// TODO: error check
socket.emit('lobby-leave');
pageLog('left lobby');
showBack();
}

View File

@@ -1,8 +1,22 @@
textarea {
resize: none;
}
#log-console {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
width: 100%;
position: fixed;
bottom: 0;
}
.lobby-type {
display: block;
/* display: block;
margin-left: auto;
margin-right: auto;
border: 1px solid green ;
border: 1px solid green ;*/
}

View File

@@ -6,7 +6,7 @@
<link rel="stylesheet" href="./main.css">
<title>Bruh online</title>
<title>Scrabble online</title>
</head>
<body>
<form id="input-username">

0
server/README Normal file
View File

View File

@@ -138,7 +138,7 @@ function UserJoinLobby(lobbyuid, useruid, callback)
if (!Lobbies[lobbyuid]) return false;
if (!Registrar.GetUserByUID(useruid)) return false;
// check users and change lobby status
// TODO: check users and change lobby status
const user = Registrar.GetUserByUID(useruid);
Lobbies[lobbyuid].players.push({uid: useruid, name: user.username});

View File

@@ -182,7 +182,7 @@ function LobbyJoin(socket, args)
return;
}
if (!args.lobbyID || args.joinAsSpectator === undefined)
if (!args.lobbyuid || args.joinAsSpectator === undefined)
{
err.addError(400, 'Bad Request', 'Lobby malformed');
socket.emit('lobby-join-error', err.toError);
@@ -206,7 +206,7 @@ function LobbyJoin(socket, args)
return;
}
const lobby = Game.Lobbies.GetLobbyByUID(args.lobbyID);
const lobby = Game.Lobbies.GetLobbyByUID(args.lobbyuid);
if (!lobby)
{
err.addError(400, 'Bad Request', 'Lobby does not exist');