From 36e17b7cc92002d325d7f6fa93767f6189c51444 Mon Sep 17 00:00:00 2001 From: Tor Andersson Date: Sun, 10 Dec 2023 00:55:11 +0100 Subject: Show "join" page when not logged in. Static page showing limited info and a call to action to login or sign up. --- public/join.js | 93 ++++++++++++++++++++++++++++++++++++++++++++++------------ server.js | 19 ++++++++---- views/join.pug | 38 ++++++++++++++---------- 3 files changed, 109 insertions(+), 41 deletions(-) diff --git a/public/join.js b/public/join.js index e51b548..cc8d325 100644 --- a/public/join.js +++ b/public/join.js @@ -120,11 +120,11 @@ function start_event_source() { } function is_friend(p) { - return whitelist.includes(p.user_id) + return whitelist && whitelist.includes(p.user_id) } function is_enemy(p) { - return blacklist.includes(p.user_id) + return blacklist && blacklist.includes(p.user_id) } function is_active(player, role) { @@ -148,10 +148,81 @@ function action_link(player, action, color, text) { } function update() { + update_common() + if (user_id) + update_login() + else + update_no_login() +} + +function update_common() { if (game.scenario !== "Standard") document.querySelector("h1").textContent = game.title_name + " - " + game.scenario else document.querySelector("h1").textContent = game.title_name + + let message = window.message + if (game.status === 0) { + if (ready && (game.owner_id === user_id)) + message.innerHTML = "Ready to start..." + else if (ready) + message.innerHTML = `Waiting for ${game.owner_name} to start the game...` + else + message.innerHTML = "Waiting for players to join..." + } else if (game.status === 1) { + message.innerHTML = `Observe` + } else if (game.status === 2) { + message.innerHTML = `Review` + } else if (game.status === 3) { + message.innerHTML = "Archived" + } +} + +function update_no_login() { + for (let i = 0; i < roles.length; ++i) { + let role = roles[i] + let role_id = "role_" + role.replace(/ /g, "_") + if (game.is_random && game.status === 0) + role = "Random " + (i+1) + document.getElementById(role_id + "_name").textContent = role + let player = players.find(p => p.role === role) + let element = document.getElementById(role_id) + + if (player) { + element.classList.remove("is_invite") + switch (game.status) { + case 3: + element.innerHTML = player.name + break + case 2: + element.innerHTML = user_link(player) + break + case 1: + if (player.is_invite) { + element.classList.add("is_invite") + element.innerHTML = user_link(player) + " ?" + } else { + element.classList.toggle("is_active", is_active(player, role)) + element.innerHTML = user_link(player) + } + break + case 0: + if (player.is_invite) { + element.classList.add("is_invite") + element.innerHTML = user_link(player) + " ?" + } else { + element.innerHTML = user_link(player) + } + break + } + } else { + element.classList.remove("is_invite") + element.innerHTML = `Empty` + } + } +} + +function update_login() { for (let i = 0; i < roles.length; ++i) { let role = roles[i] let role_id = "role_" + role.replace(/ /g, "_") @@ -257,22 +328,6 @@ function update() { } } - let message = window.message - if (game.status === 0) { - if (ready && (game.owner_id === user_id)) - message.innerHTML = "Ready to start..." - else if (ready) - message.innerHTML = `Waiting for ${game.owner_name} to start the game...` - else - message.innerHTML = "Waiting for players to join..." - } else if (game.status === 1) { - message.innerHTML = `Observe` - } else if (game.status === 2) { - message.innerHTML = `Review` - } else if (game.status === 3) { - message.innerHTML = "Archived" - } - if (game.owner_id === user_id) { window.start_button.disabled = !ready window.start_button.classList = (game.status === 0) ? "" : "hide" @@ -291,7 +346,7 @@ function update() { window.onload = function () { update() - if (game.status < 2) { + if (user_id && game.status < 2) { start_event_source() timer = setInterval(start_event_source, 15000) } diff --git a/server.js b/server.js index 7f87bf5..d964048 100644 --- a/server.js +++ b/server.js @@ -1789,7 +1789,7 @@ function update_join_clients_players(game_id) { } } -app.get('/join/:game_id', must_be_logged_in, function (req, res) { +app.get('/join/:game_id', function (req, res) { let game_id = req.params.game_id | 0 let game = SQL_SELECT_GAME_VIEW.get(game_id) if (!game) @@ -1800,17 +1800,24 @@ app.get('/join/:game_id', must_be_logged_in, function (req, res) { let roles = get_game_roles(game.title_id, game.scenario, options) let players = SQL_SELECT_PLAYERS_JOIN.all(game_id) - let whitelist = SQL_SELECT_CONTACT_WHITELIST.all(req.user.user_id) - let blacklist = SQL_SELECT_CONTACT_BLACKLIST.all(req.user.user_id) + + let whitelist = null + let blacklist = null let friends = null - if (game.owner_id === req.user.user_id) - friends = SQL_SELECT_CONTACT_FRIEND_NAMES.all(req.user.user_id) + + if (req.user) { + whitelist = SQL_SELECT_CONTACT_WHITELIST.all(req.user.user_id) + blacklist = SQL_SELECT_CONTACT_BLACKLIST.all(req.user.user_id) + if (game.owner_id === req.user.user_id) + friends = SQL_SELECT_CONTACT_FRIEND_NAMES.all(req.user.user_id) + } + let ready = (game.status === STATUS_OPEN) && is_game_ready(game.player_count, players) game.ctime = human_date(game.ctime) game.mtime = human_date(game.mtime) res.render('join.pug', { user: req.user, game, roles, players, ready, whitelist, blacklist, friends, - limit: check_join_game_limit(req.user) + limit: req.user ? check_join_game_limit(req.user) : null }) }) diff --git a/views/join.pug b/views/join.pug index d75ef4d..280e2e6 100644 --- a/views/join.pug +++ b/views/join.pug @@ -22,7 +22,7 @@ html let game = !{ JSON.stringify(game) } let roles = !{ JSON.stringify(roles) } let players = !{ JSON.stringify(players) } - let user_id = !{ user.user_id } + let user_id = !{ user ? user.user_id : 0 } let whitelist = !{ JSON.stringify(whitelist) } let blacklist = !{ JSON.stringify(blacklist) } let friends = !{ JSON.stringify(friends) } @@ -37,13 +37,15 @@ html else h1 #{game.title_name} - #{game.scenario} + div.logo + +gamecover(game.title_id) + if limit && game.status < 1 p.error= limit + if !user + p.error You are not logged in! p.error#error - div.logo - +gamecover(game.title_id) - if game.owner_id if game.is_private p Created #{game.ctime} by #{game.owner_name} (private). @@ -54,7 +56,7 @@ html if game.status > 1 p Finished #{game.mtime}. - else if game.mtime !== "never" + else if game.status > 0 p Last changed #{game.mtime}. unless game.human_options === "None" @@ -72,17 +74,18 @@ html p i= game.notice - dialog(id="invite") - | Invite a friend: - br - input(id="invite_user" type="text" list="friends" onchange="send_invite()") - datalist(id="friends") - if friends - each who in friends - option= who - br - button(onclick="send_invite()") Invite - button(onclick="hide_invite()") Cancel + if user + dialog(id="invite") + | Invite a friend: + br + input(id="invite_user" type="text" list="friends" onchange="send_invite()") + datalist(id="friends") + if friends + each who in friends + option= who + br + button(onclick="send_invite()") Invite + button(onclick="hide_invite()") Cancel p table @@ -98,3 +101,6 @@ html p button.hide#delete_button(onclick="confirm_delete()") Delete button.hide#start_button(onclick="start()" disabled) Start + + if !user && !ready + p Login or sign up to play this game. -- cgit v1.2.3