Made the Access Part hide after connecting and also added a Leave Room button

This commit is contained in:
abrendan 2024-01-29 17:55:53 +00:00
parent 1970e36448
commit 7ce73ce036
2 changed files with 20 additions and 0 deletions

View File

@ -38,6 +38,7 @@
<label id = "MessageLabel"> Message </label> <label id = "MessageLabel"> Message </label>
<input id = "ComposedMessage" class="input" type = "text"> <input id = "ComposedMessage" class="input" type = "text">
<input id = "SendMessage" onclick="Send()" value = "Send your message" class="button2" type = "submit"> <input id = "SendMessage" onclick="Send()" value = "Send your message" class="button2" type = "submit">
<input id="LeaveRoomButton" class="button2" type="submit" value="Leave Room" onclick="LeaveRoom()">
</div> </div>
<div class = "other"> <div class = "other">
<button id="darkModeToggle" onclick="toggleDarkMode()" class="button">Toggle Dark Mode</button> <button id="darkModeToggle" onclick="toggleDarkMode()" class="button">Toggle Dark Mode</button>

View File

@ -57,11 +57,30 @@ function Connect(){
chatRoom.innerHTML = "Chatroom : " + room; chatRoom.innerHTML = "Chatroom : " + room;
// Hide the chat div initially when attempting to connect // Hide the chat div initially when attempting to connect
document.getElementById("Chat").style.display = "none"; document.getElementById("Chat").style.display = "none";
document.getElementById('AccessPort').style.display = 'none';
} else { } else {
// Maybe show an error message to the user that they need to fill in both fields // Maybe show an error message to the user that they need to fill in both fields
} }
} }
function LeaveRoom(){
// Show access port to join another chat room.
document.getElementById('AccessPort').style.display = 'block';
// Hide the chat div as the user is leaving the room.
document.getElementById('Chat').style.display = 'none';
// Reset chatRoom text to indicate no room connection.
chatRoom.innerHTML = "Chatroom : None";
// If the user is in a room, emit a leave event.
if (rooms[socket.id]) {
socket.emit('leave', rooms[socket.id], usernames[socket.id]);
rooms[socket.id] = null;
usernames[socket.id] = null;
}
}
function Send(){ function Send(){
if (delay && messageInput.value.replace(/\s/g, "") != ""){ if (delay && messageInput.value.replace(/\s/g, "") != ""){
delay = false; delay = false;