diff options
Diffstat (limited to 'public')
| -rw-r--r-- | public/common/play.js | 2 | ||||
| -rw-r--r-- | public/join.js | 72 | ||||
| -rw-r--r-- | public/style.css | 5 |
3 files changed, 66 insertions, 13 deletions
diff --git a/public/common/play.js b/public/common/play.js index 054343c..964889b 100644 --- a/public/common/play.js +++ b/public/common/play.js @@ -343,7 +343,7 @@ function remove_resign_menu() { } function goto_rematch() { - window.location = "/rematch/" + params.game_id + "/" + params.role + window.location = "/rematch/" + params.game_id } function goto_replay() { diff --git a/public/join.js b/public/join.js index 5bb8b9c..72da646 100644 --- a/public/join.js +++ b/public/join.js @@ -3,6 +3,7 @@ let start_status = game.status let evtsrc = null let timer = 0 +let invite_role = null function confirm_delete() { let warning = `Are you sure you want to DELETE this game?` @@ -39,6 +40,25 @@ function kick(role) { post(`/part/${game.game_id}/${encodeURIComponent(role)}`) } +function accept(role) { + post(`/accept/${game.game_id}/${encodeURIComponent(role)}`) +} + +function send_invite() { + let invite_user = document.getElementById("invite_user").value + post(`/invite/${game.game_id}/${encodeURIComponent(invite_role)}/${encodeURIComponent(invite_user)}`) + document.getElementById("invite").close() +} + +function show_invite(role) { + invite_role = role + document.getElementById("invite").showModal() +} + +function hide_invite() { + document.getElementById("invite").close() +} + let blink_title = document.title let blink_timer = 0 @@ -115,6 +135,14 @@ function is_solo() { return players.every(p => p.user_id === players[0].user_id) } +function play_link(player) { + return `<a href="/${game.title_id}/play.html?game=${game.game_id}&role=${encodeURIComponent(player.role)}">${player.name}</a>` +} + +function action_link(player, action, color, text) { + return `<a class="${color}" href="javascript:${action}('${player.role}')">${text}</a>` +} + function update() { for (let i = 0; i < roles.length; ++i) { let role = roles[i] @@ -125,29 +153,47 @@ function update() { 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 2: if (player.user_id === user_id) - element.innerHTML = `<a href="/${game.title_id}/play.html?game=${game.game_id}&role=${encodeURIComponent(role)}">${player.name}</a>` + element.innerHTML = play_link(player) else element.innerHTML = player.name break case 1: element.classList.toggle("is_active", is_active(player, role)) if (player.user_id === user_id) - element.innerHTML = `<a href="/${game.title_id}/play.html?game=${game.game_id}&role=${encodeURIComponent(role)}">${player.name}</a><a class="red" href="javascript:part('${role}')">\u274c</a>` + element.innerHTML = play_link(player) + action_link(player, "part", "red", "\u274c") else if (game.owner_id === user_id) - element.innerHTML = `${player.name}<a class="red" href="javascript:kick('${role}')">\u274c</a>` + element.innerHTML = player.name + action_link(player, "kick", "red", "\u274c") else element.innerHTML = player.name break case 0: - if (player.user_id === user_id) - element.innerHTML = `${player.name}<a class="red" href="javascript:part('${role}')">\u274c</a>` - else if (game.owner_id === user_id) - element.innerHTML = `${player.name}<a class="red" href="javascript:kick('${role}')">\u274c</a>` - else - element.innerHTML = player.name + if (player.is_invite) { + element.classList.add("is_invite") + if (player.user_id === user_id) + element.innerHTML = player.name + " ?" + + action_link(player, "part", "red", "\u274c") + + action_link(player, "accept", "green", "\u2714") + else if (player.user_id === user_id) + element.innerHTML = player.name + " ?" + action_link(player, "part", "red", "\u274c") + else if (game.owner_id === user_id) + element.innerHTML = player.name + " ?" + action_link(player, "kick", "red", "\u274c") + else + element.innerHTML = player.name + " ?" + } else { + element.classList.remove("is_invite") + if (player.user_id === user_id && player.is_invite) + element.innerHTML = player.name + action_link(player, "part", "red", "\u274c") + else if (player.user_id === user_id) + element.innerHTML = player.name + action_link(player, "part", "red", "\u274c") + else if (game.owner_id === user_id) + element.innerHTML = player.name + action_link(player, "kick", "red", "\u274c") + else + element.innerHTML = player.name + } break } element.classList.toggle("friend", is_friend(player)) @@ -157,14 +203,20 @@ function update() { else element.title = "" } else { + element.classList.remove("is_invite") switch (game.status) { case 2: element.innerHTML = `<i>Empty</i>` break case 1: - case 0: element.innerHTML = `<a class="join" href="javascript:join('${role}')">Join</a>` break + case 0: + if (game.owner_id === user_id) + element.innerHTML = `<a class="join" href="javascript:join('${role}')">Join</a><a class="green" href="javascript:show_invite('${role}')">\u{2795}</a>` + else + element.innerHTML = `<a class="join" href="javascript:join('${role}')">Join</a>` + break } element.classList.remove("friend") element.classList.remove("enemy") diff --git a/public/style.css b/public/style.css index c4b0b9e..e530ef3 100644 --- a/public/style.css +++ b/public/style.css @@ -1,9 +1,9 @@ html, input, textarea { - font-family: "Source Serif", "Georgia", "Dingbats", "Noto Emoji", serif; + font-family: "Source Serif", "Georgia", "Noto Emoji", "Dingbats", serif; font-size: 16px; } button, select { - font-family: "Source Sans", "Verdana", "Dingbats", "Noto Emoji", sans-serif; + font-family: "Source Sans", "Verdana", "Noto Emoji", "Dingbats", sans-serif; font-size: 16px; } @@ -156,6 +156,7 @@ article hr + p { font-style: italic; } .game_item a:not(:hover) { text-decoration: none; color: black; } .game_item a.command { text-decoration: underline; font-weight: bold } .game_info .is_active { text-decoration: underline } +.game_info .is_invite { opacity: 0.5 } .game_info div { text-indent: -20px; padding-left: 20px; |