From f5ea88328ef1b4dabd5f58b4c78ad4e175c96765 Mon Sep 17 00:00:00 2001 From: Tor Andersson Date: Mon, 11 Sep 2023 15:21:24 +0200 Subject: Add user links to join page. --- public/join.js | 32 +++++++++++++++----------------- public/style.css | 12 ++++++------ views/contacts.pug | 4 ++-- views/forum_search.pug | 4 ++-- views/forum_view.pug | 8 ++++---- views/head.pug | 7 ++++--- views/join.pug | 46 ++++++++++++++++++++++------------------------ views/message_inbox.pug | 4 ++-- views/message_outbox.pug | 4 ++-- views/stats.pug | 2 +- 10 files changed, 60 insertions(+), 63 deletions(-) diff --git a/public/join.js b/public/join.js index 85445dc..362800d 100644 --- a/public/join.js +++ b/public/join.js @@ -135,8 +135,12 @@ function is_solo() { return players.every(p => p.user_id === players[0].user_id) } +function user_link(player) { + return `${player.name}` +} + function play_link(player) { - return `${player.name}` + return `\xbb Play` } function action_link(player, action, color, text) { @@ -162,16 +166,16 @@ function update() { if (player.user_id === user_id) element.innerHTML = play_link(player) else - element.innerHTML = player.name + element.innerHTML = user_link(player) break case 1: element.classList.toggle("is_active", is_active(player, role)) if (player.user_id === user_id) element.innerHTML = play_link(player) + action_link(player, "part", "red", "\u274c") else if (game.owner_id === user_id) - element.innerHTML = player.name + action_link(player, "kick", "red", "\u274c") + element.innerHTML = user_link(player) + action_link(player, "kick", "red", "\u274c") else - element.innerHTML = player.name + element.innerHTML = user_link(player) break case 0: if (player.is_invite) { @@ -180,22 +184,18 @@ function update() { 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") + element.innerHTML = user_link(player) + " ?" + action_link(player, "kick", "red", "\u274c") else - element.innerHTML = player.name + " ?" + element.innerHTML = user_link(player) + " ?" } 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) + 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") + element.innerHTML = user_link(player) + action_link(player, "kick", "red", "\u274c") else - element.innerHTML = player.name + element.innerHTML = user_link(player) } break } @@ -212,13 +212,11 @@ function update() { element.innerHTML = `Empty` break case 1: - element.innerHTML = `Join` - break case 0: if (game.owner_id === user_id) - element.innerHTML = `Join\u{2795}` + element.innerHTML = `\xbb Join\u{2795}` else - element.innerHTML = `Join` + element.innerHTML = `\xbb Join` break } element.classList.remove("friend") diff --git a/public/style.css b/public/style.css index 5d8940c..0a950e6 100644 --- a/public/style.css +++ b/public/style.css @@ -12,6 +12,8 @@ h1 { margin: 16px 0 16px -1px; font-size: 24px; } h2 { margin: 16px 0 16px -1px; font-size: 20px; } h3 { margin: 16px 0 8px -1px; font-size: 16px; } a { color: blue; } +a.black { text-decoration: none; color: black; } +a.black:hover { text-decoration: underline; color: blue; } .w { white-space: nowrap; } .r { text-align: right; } @@ -31,8 +33,8 @@ header nav { flex-wrap: wrap; justify-content: end; } -header nav a { display: block; margin: 0 16px; color: black; } -header nav a:hover { color: blue; } +header nav a { display: block; margin: 0 12px; color: black } +header nav a:hover { color: blue } article { margin: 2em; } article p, article dl, article ul { max-width: 50rem; } @@ -47,6 +49,7 @@ div.logo img { input[type="checkbox"], input[type="radio"] { margin-right: 7px; + accent-color: black; } input[type="text"], input[type="password"], input[type="email"], textarea { padding: 5px; @@ -106,8 +109,6 @@ th, td { tbody tr:nth-child(2n) { background-color: whitesmoke; } -table a:not(:hover) { text-decoration: none; color: black; } -td.command a { text-decoration: underline; color: blue; } td.is_active { background-color: lemonchiffon; } /* FORUM AND MESSAGE POSTS */ @@ -154,6 +155,7 @@ article hr + p { font-style: italic; } } .game_head { border-bottom: 1px solid black; + line-height: 23px; } .game_info { font-family: "Source Serif SmText", "Georgia", "Noto Emoji", "Dingbats", serif; @@ -207,8 +209,6 @@ article hr + p { font-style: italic; } .game_item.your_turn .game_main { background-color: lightyellow } .game_item.your_turn a:hover { color: #860 } -.game_item.unread .game_head div::after { content: " \1f4dd "; } - /* DARK MODE */ @media (prefers-color-scheme: dark) { body { background-color: silver } diff --git a/views/contacts.pug b/views/contacts.pug index 62840f9..78f1f5b 100644 --- a/views/contacts.pug +++ b/views/contacts.pug @@ -25,7 +25,7 @@ html each who in friends tr td - a(href="/user/"+who.name)= who.name + a.black(href="/user/"+who.name)= who.name td= who.atime td.r a.blue(href="/message/send/"+who.name) 📝 @@ -46,7 +46,7 @@ html each who in enemies tr td - a(href="/user/"+who.name)= who.name + a.black(href="/user/"+who.name)= who.name td.r a.red(href="/contact/remove/"+who.name) ❌ else diff --git a/views/forum_search.pug b/views/forum_search.pug index 1301b76..f7d1b42 100644 --- a/views/forum_search.pug +++ b/views/forum_search.pug @@ -18,8 +18,8 @@ html tobdy each row in results tr - td: a(href="/user/"+row.author)= row.author - td: a(href="/forum/thread/"+row.thread_id+"#"+row.post_id)= row.subject + td: a.black(href="/user/"+row.author)= row.author + td: a.black(href="/forum/thread/"+row.thread_id+"#"+row.post_id)= row.subject td= row.snippet if user diff --git a/views/forum_view.pug b/views/forum_view.pug index ac9201d..1f70c8c 100644 --- a/views/forum_view.pug +++ b/views/forum_view.pug @@ -23,24 +23,24 @@ html each row in threads tr(class=row.is_read?"read":"unread") td - a(href="/forum/thread/"+row.thread_id)= row.subject + a.black(href="/forum/thread/"+row.thread_id)= row.subject td.r= row.count td.w= row.mtime tfoot tr td(colspan=4) if current_page > 1 - | #[a(href="/forum/page/"+(current_page-1)) ←] + | #[a.black(href="/forum/page/"+(current_page-1)) ←] | - for (let p=1; p<=page_count && p<=30; ++p) if p === current_page | (#{p}) | else - | #[a(href="/forum/page/"+p)= p] + | #[a.black(href="/forum/page/"+p)= p] | if current_page < page_count - | #[a(href="/forum/page/"+(current_page+1)) →] + | #[a.black(href="/forum/page/"+(current_page+1)) →] if user p diff --git a/views/head.pug b/views/head.pug index fa2b042..0fc415b 100644 --- a/views/head.pug +++ b/views/head.pug @@ -43,8 +43,8 @@ mixin gamelist(list,hide_title=0) div - let className = "game_item" + let chat_icon = "" if (item.your_turn) className += " your_turn" - if (item.is_unread) className += " unread" if (item.status === 0 && item.join_count === 0) className += " open replacement" else if (item.status === 0 && item.join_count !== item.player_count) className += " open" else if (item.status === 0 && item.join_count === item.player_count) className += " ready" @@ -52,15 +52,16 @@ mixin gamelist(list,hide_title=0) else if (item.status === 1 && item.join_count === item.player_count) className += " active" else if (item.status === 2) className += " finished" else if (item.status === 3) className += " archived" + if (item.is_unread) chat_icon = "\u{1f4dd}" div(class=className) div.game_head if item.scenario.length <= 2 div - | #{item.game_id} – #{item.title_name} (#{item.scenario}) + | #{item.game_id} – #{item.title_name} (#{item.scenario}) #{chat_icon} else div - | #{item.game_id} – #{item.title_name} + | #{item.game_id} – #{item.title_name} #{chat_icon} case item.status when 0 diff --git a/views/join.pug b/views/join.pug index 2e6bf08..ced1fe3 100644 --- a/views/join.pug +++ b/views/join.pug @@ -10,14 +10,13 @@ html style. table { min-width: 0; } th,td { border: 1px solid black; } - td a.red { text-decoration: none; color: brown; font-size: 15px; float: right; } - td a.green { text-decoration: none; color: green; font-size: 15px; float: right; } - td a { text-decoration: underline; color: blue; } + a.red { text-decoration: none; color: brown; font-size: 15px; float: right; } + a.green { text-decoration: none; color: green; font-size: 15px; float: right; } th { white-space: nowrap; background-color: gainsboro; } td { width: 180px; background-color: white; } #message { background-color: whitesmoke; } .hide { display: none; } - td.is_invite { color: gray } + td.is_invite { background-color: honeydew } td.enemy { background-color: #f66 } td.enemy::before { content: "\1f6ab "; color: #000; font-size: 15px; } script. @@ -33,34 +32,33 @@ html body include header article - h1= game.title_name + if game.scenario === "Standard" + h1 #{game.title_name} + else + h1 #{game.title_name} - #{game.scenario} p.error#error div.logo +gamecover(game.title_id) - div Scenario: #{game.scenario} - - unless game.human_options === "None" - div Options: #{game.human_options} - if game.owner_id - div - if game.is_private - | Owner: #{game.owner_name} (private) - else - | Owner: #{game.owner_name} + if game.is_private + p Created #{game.ctime} by #{game.owner_name} (private). + else + p Created #{game.ctime} by #{game.owner_name}. + else + p Created #{game.ctime}. - div Created: #{game.ctime} - unless game.mtime === "never" - div Changed: #{game.mtime} + if game.status > 1 + p Finished #{game.mtime}. + else if game.mtime !== "never" + p Last changed #{game.mtime}. - if game.status === 2 - div Result: #{game.result} + unless game.human_options === "None" + p Options: #{game.human_options}. if game.notice - br - div + p i= game.notice br(clear="left") @@ -83,9 +81,9 @@ html each role in roles tr th(id="role_"+role.replace(/ /g, "_")+"_name")= role - td.command(id="role_"+role.replace(/ /g, "_")) - + td(id="role_"+role.replace(/ /g, "_")) - tr - td.command#message(colspan=2) - + td#message(colspan=2) - p button.hide#delete_button(onclick="confirm_delete()") Delete diff --git a/views/message_inbox.pug b/views/message_inbox.pug index 10c4626..0e39ea2 100644 --- a/views/message_inbox.pug +++ b/views/message_inbox.pug @@ -25,9 +25,9 @@ html each row in messages tr td - a(href="/user/"+row.from_name)= row.from_name + a.black(href="/user/"+row.from_name)= row.from_name td(class=row.is_read?"read":"unread") - a(href="/message/read/"+row.message_id)= row.subject + a.black(href="/message/read/"+row.message_id)= row.subject td= row.time else tr diff --git a/views/message_outbox.pug b/views/message_outbox.pug index 5da84c6..267a8b3 100644 --- a/views/message_outbox.pug +++ b/views/message_outbox.pug @@ -29,8 +29,8 @@ html tbody each row in messages tr - td: a(href="/user/"+row.to_name)= row.to_name - td: a(href="/message/read/"+row.message_id)= row.subject + td: a.black(href="/user/"+row.to_name)= row.to_name + td: a.black(href="/message/read/"+row.message_id)= row.subject td= row.time else tr diff --git a/views/stats.pug b/views/stats.pug index 4d275b0..6c8a268 100644 --- a/views/stats.pug +++ b/views/stats.pug @@ -20,7 +20,7 @@ html thead tr th - a(href="/"+row.title_id)= row.title_name + a.black(href="/"+row.title_id)= row.title_name unless row.scenario === "Standard" | – #{row.scenario} th= row.total -- cgit v1.2.3