Added Join button
This commit is contained in:
+49
-8
@@ -2,10 +2,15 @@ document.addEventListener("DOMContentLoaded", async () => {
|
||||
const logoutButton = document.getElementById("logout");
|
||||
const balance = document.getElementById("balance");
|
||||
const hostButton = document.getElementById("host");
|
||||
const joinButton = document.getElementById("join");
|
||||
const joinForm = document.getElementById("join-form");
|
||||
const joinCodeInput = document.getElementById("join-code");
|
||||
const joinSubmit = document.getElementById("submit-join");
|
||||
|
||||
|
||||
const getUsernameFromToken = async () => {
|
||||
try {
|
||||
const res = await fetch("/verify", { method: "POST" });
|
||||
const res = await fetch("/verify", {method: "POST"});
|
||||
const data = await res.json();
|
||||
return data.user?.username;
|
||||
} catch (err) {
|
||||
@@ -13,10 +18,8 @@ document.addEventListener("DOMContentLoaded", async () => {
|
||||
return null;
|
||||
}
|
||||
};
|
||||
|
||||
// Get and display user balance
|
||||
try {
|
||||
const balanceRes = await fetch('/balance', { method: "GET" });
|
||||
const balanceRes = await fetch('/balance', {method: "GET"});
|
||||
if (balanceRes.ok) {
|
||||
const balanceData = await balanceRes.json();
|
||||
balance.innerHTML = balanceData.balance;
|
||||
@@ -29,7 +32,7 @@ document.addEventListener("DOMContentLoaded", async () => {
|
||||
logoutButton.addEventListener("click", async (e) => {
|
||||
e.preventDefault();
|
||||
try {
|
||||
const logoutRes = await fetch('/logout', { method: "DELETE" });
|
||||
const logoutRes = await fetch('/logout', {method: "DELETE"});
|
||||
if (logoutRes.ok) {
|
||||
document.cookie = "authorization=; Max-Age=0; path=/;";
|
||||
window.location.href = "/login";
|
||||
@@ -49,12 +52,10 @@ document.addEventListener("DOMContentLoaded", async () => {
|
||||
try {
|
||||
const res = await fetch(`/lobby/create?username=${username}`);
|
||||
if (res.redirected) {
|
||||
// If server redirects to join, follow the URL manually
|
||||
const joinURL = new URL(res.url);
|
||||
const lobbyId = joinURL.searchParams.get("lobbyId");
|
||||
|
||||
const joinRes = await fetch(joinURL.href);
|
||||
const { lobbyId: finalLobbyId } = await joinRes.json();
|
||||
const {lobbyId: finalLobbyId} = await joinRes.json();
|
||||
|
||||
document.getElementById("lobby-id").textContent = finalLobbyId;
|
||||
document.getElementById("lobby-room").classList.remove("hidden");
|
||||
@@ -70,4 +71,44 @@ document.addEventListener("DOMContentLoaded", async () => {
|
||||
console.error("Lobby create/join error:", err);
|
||||
}
|
||||
});
|
||||
joinButton.addEventListener("click", (e) => {
|
||||
e.preventDefault();
|
||||
if (joinForm.classList.contains("hidden")) {
|
||||
joinForm.classList.remove("hidden");
|
||||
joinCodeInput.focus();
|
||||
} else {
|
||||
joinForm.classList.add("hidden");
|
||||
}
|
||||
});
|
||||
joinSubmit.addEventListener("click", async (e) => {
|
||||
e.preventDefault();
|
||||
const lobbyId = joinCodeInput.value.trim();
|
||||
if (!lobbyId) return alert("Please enter a lobby ID");
|
||||
const username = await getUsernameFromToken();
|
||||
if (!username) return alert("User not authenticated");
|
||||
|
||||
try {
|
||||
const joinRes = await fetch(`/lobby/join?lobbyId=${lobbyId}&username=${username}`);
|
||||
if (joinRes.ok) {
|
||||
const {lobbyId: finalLobbyId} = await joinRes.json();
|
||||
|
||||
document.getElementById("lobby-id").textContent = finalLobbyId;
|
||||
document.getElementById("lobby-room").classList.remove("hidden");
|
||||
joinForm.classList.add("hidden");
|
||||
|
||||
setInterval(async () => {
|
||||
const res = await fetch(`/lobby/players?lobbyId=${finalLobbyId}`);
|
||||
const data = await res.json();
|
||||
const playerList = document.getElementById("player-list");
|
||||
playerList.innerHTML = data.players.map(p => `<p>${p}</p>`).join("") || "<p>No players yet</p>";
|
||||
}, 3000);
|
||||
} else {
|
||||
const error = await joinRes.json();
|
||||
alert("Failed to join lobby: " + (error.error || "Unknown error"));
|
||||
}
|
||||
} catch (err) {
|
||||
console.error("Join lobby error:", err);
|
||||
alert("Could not join lobby.");
|
||||
}
|
||||
});
|
||||
});
|
||||
Reference in New Issue
Block a user