From 327acfe1124cdafc5eb460a039222a160f867ba3 Mon Sep 17 00:00:00 2001
From: Tor Andersson <tor@ccxvii.net>
Date: Wed, 17 Nov 2021 13:39:16 +0100
Subject: Simplify URL for playing games.

---
 views/games.ejs   | 44 +++++++++++++++++++--------------
 views/info.ejs    | 74 +++++++++++++++++++++++++++++++++----------------------
 views/join.ejs    | 16 +-----------
 views/profile.ejs | 55 ++++++++++++++++++++++++-----------------
 4 files changed, 104 insertions(+), 85 deletions(-)

(limited to 'views')

diff --git a/views/games.ejs b/views/games.ejs
index 3b3f485..86a2502 100644
--- a/views/games.ejs
+++ b/views/games.ejs
@@ -2,41 +2,49 @@
 
 <h2>Open</h2>
 <table class="game">
-<tr><th>ID<th>Title<th>Scenario<th>Players<th>Description<th>Created<th>
-<% if (open_games.length > 0) { %>
-<% open_games.forEach((row) => { %>
+<tr><th>ID<th>Title<th>Scenario<th>Options<th>Players<th>Description<th>Created<th>
+<%_ if (open_games.length > 0) { _%>
+<%_ open_games.forEach((row) => { _%>
 <tr>
 <td class="id"><%= row.game_id %>
 <td class="title"><a href="/info/<%= row.title_id %>"><%= row.title_name %></a>
 <td class="scenario"><%= row.scenario %>
-<td class="players"><%- row.player_names || row.owner_name %>
+<td class="options"><%- row.options %>
+<td class="players"><%- row.player_names %>
 <td class="description"><%= row.description %>
 <td class="time"><%= row.ctime %>
 <td class="command"><a href="/join/<%= row.game_id %>">Join</a>
-<% }); } else { %>
-<tr><td colspan="7">No open games.
-<% } %>
+<%_ }); } else { _%>
+<tr><td colspan="8">No open games.
+<%_ } _%>
 </table>
 
 <h2>Active</h2>
 <table class="game">
-<tr><th>ID<th>Title<th>Scenario<th>Players<th>Description<th>Changed<th>Active<th>
-<% if (active_games.length > 0) { %>
-<% active_games.forEach((row) => { %>
+<tr><th>ID<th>Title<th>Scenario<th>Options<th>Players<th>Description<th>Changed<th>Active<th>
+<%_ if (active_games.length > 0) { _%>
+<%_ active_games.forEach((row) => { _%>
 <tr>
 <td class="id"><%= row.game_id %>
 <td class="title"><a href="/info/<%= row.title_id %>"><%= row.title_name %></a>
 <td class="scenario"><%= row.scenario %>
+<td class="options"><%- row.options %>
 <td class="players"><%- row.player_names %>
 <td class="description"><%= row.description %>
 <td class="time"><%= row.mtime %>
 <td class="role <%= row.is_active ? "is_active" : "" %>"><%= row.active %>
-<% if (row.is_yours) { %>
-<td class="command"><a href="/join/<%= row.game_id %>">Enter</a>
-<% } else { %>
-<td class="command"><a href="/play/<%- row.game_id %>/Observer">View</a>
-<% } %>
-<% }); } else { %>
-<tr><td colspan="8">No active games.
-<% } %>
+<%_
+	if (row.is_yours) {
+		if (row.is_shared) {
+			%><td class="command"><a href="/join/<%= row.game_id %>">View</a><%
+		} else {
+			%><td class="command"><a href="/<%- row.title_id %>/play:<%- row.game_id %>:<%- row.your_role %>">View</a><%
+		}
+	} else {
+		%><td class="command"><a href="/<%- row.title_id %>/play:<%- row.game_id %>">View</a><%
+	}
+_%>
+<%_ }); } else { _%>
+<tr><td colspan="9">No active games.
+<%_ } _%>
 </table>
diff --git a/views/info.ejs b/views/info.ejs
index 7c98e21..4a515ff 100644
--- a/views/info.ejs
+++ b/views/info.ejs
@@ -1,4 +1,4 @@
-<%- include('header', { title: title.title_name, refresh: (user ? 300 : 0) }) %>
+<%- include('header', { title: title.title_name, refresh: (user ? 300 : 0) }) _%>
 <img class="logo" src="/<%= title.title_id %>/cover.jpg">
 <%- include('../public/' + title.title_id + '/about.html') %>
 <p>
@@ -7,62 +7,78 @@ Read more about the game on
 
 <h2>Open Games</h2>
 <table class="game">
-<tr><th>ID<th>Scenario<th>Players<th>Description<th>Created<th>
-<% if (open_games.length > 0) { %>
-<% open_games.forEach((row) => { %>
+<tr><th>ID<th>Scenario<th>Options<th>Players<th>Description<th>Created<th>
+<%_ if (open_games.length > 0) { _%>
+<%_ open_games.forEach((row) => { _%>
 <tr>
 <td class="id"><%= row.game_id %>
-<td><%= row.scenario %>
-<td class="players"><%- row.player_names || `<a href="/user/${row.owner_name}">${row.owner_name}</a>` %>
+<td class="scenario"><%= row.scenario %>
+<td class="options"><%- row.options %>
+<td class="players"><%- row.player_names %>
 <td class="description"><%= row.description %>
 <td class="time"><%= row.ctime %>
 <td class="command"><a href="/join/<%= row.game_id %>">Join</a>
-<% }); } else { %>
-<tr><td colspan="6">No open games.
-<% } %>
+<%_ }); } else { _%>
+<tr><td colspan="7">No open games.
+<%_ } _%>
 </table>
 
 <p>
 <a href="/create/<%= title.title_id %>">Create a new game</a>.
 
-<% if (active_games.length > 0) { %>
+<%_ if (active_games.length > 0) { _%>
 <h2>Active Games</h2>
 <table class="game">
-<tr><th>ID<th>Scenario<th>Players<th>Description<th>Changed<th>Turn<th>
-<% active_games.forEach((row) => { %>
+<tr><th>ID<th>Scenario<th>Options<th>Players<th>Description<th>Changed<th>Turn<th>
+<%_ active_games.forEach((row) => { _%>
 <tr>
 <td class="id"><%= row.game_id %>
 <td class="scenario"><%= row.scenario %>
+<td class="options"><%- row.options %>
 <td class="players"><%- row.player_names %>
 <td class="description"><%= row.description %>
 <td class="time"><%= row.mtime %>
 <td class="<%= row.is_active ? "role is_active" : "role" %>"><%= row.active %>
-<% if (row.is_yours) { %>
-<td class="command"><a href="/join/<%- row.game_id %>">Enter</a>
-<% } else { %>
-<td class="command"><a href="/play/<%- row.game_id %>/Observer">View</a>
-<% } %>
-<% }); %>
+<%_
+	if (row.is_yours) {
+		if (row.is_shared) {
+			%><td class="command"><a href="/join/<%= row.game_id %>">Play</a><%
+		} else {
+			%><td class="command"><a href="/<%- row.title_id %>/play:<%- row.game_id %>:<%- row.your_role %>">Play</a><%
+		}
+	} else {
+		%><td class="command"><a href="/<%- row.title_id %>/play:<%- row.game_id %>">View</a><%
+
+	}
+_%>
+<%_ }); _%>
 </table>
-<% } %>
+<%_ } _%>
 
-<% if (finished_games.length > 0) { %>
+<%_ if (finished_games.length > 0) { _%>
 <h2>Finished Games</h2>
 <table class="game">
-<tr><th>ID<th>Scenario<th>Players<th>Description<th>Finished<th>Result<th>
-<% finished_games.forEach((row) => { %>
+<tr><th>ID<th>Scenario<th>Options<th>Players<th>Description<th>Finished<th>Result<th>
+<%_ finished_games.forEach((row) => { _%>
 <tr>
 <td class="id"><%= row.game_id %>
 <td class="scenario"><%= row.scenario %>
+<td class="options"><%- row.options %>
 <td class="players"><%- row.player_names %>
 <td class="description"><%= row.description %>
 <td class="time"><%= row.mtime %>
 <td class="result"><%= row.result %>
-<% if (row.is_yours) { %>
-<td class="command"><a href="/join/<%= row.game_id %>">Enter</a>
-<% } else { %>
-<td class="command"><a href="/play/<%- row.game_id %>/Observer">View</a>
-<% } %>
-<% }); %>
+<%_
+	if (row.is_yours) {
+		if (row.is_shared) {
+			%><td class="command"><a href="/join/<%= row.game_id %>">View</a><%
+		} else {
+			%><td class="command"><a href="/<%- row.title_id %>/play:<%- row.game_id %>:<%- row.your_role %>">View</a><%
+		}
+	} else {
+		%><td class="command"><a href="/<%- row.title_id %>/play:<%- row.game_id %>">View</a><%
+	}
+_%>
+<%_ }); _%>
 </table>
-<% } %>
+<%_ } _%>
diff --git a/views/join.ejs b/views/join.ejs
index fa33d5c..6558745 100644
--- a/views/join.ejs
+++ b/views/join.ejs
@@ -1,14 +1,4 @@
 <%- include('header', { title: game.title_name }) -%>
-<%
-function to_english(k) {
-	if (k === true) return 'yes';
-	if (k === false) return 'no';
-	return k.replace(/_/g, " ").replace(/^\w/, c => c.toUpperCase());
-}
-function format_options(options) {
-	return Object.entries(options||{}).map(([k,v]) => v === true ? to_english(k) : `${to_english(k)}=${to_english(v)}`).join(", ");
-}
--%>
 <style>
 th, td { min-width: 10em; font-size: 16px; }
 a.red { text-decoration: none; color: brown; font-size: 15px; }
@@ -35,13 +25,9 @@ Private: <%= game.private ? "yes" : "no" %>
 <br>
 Scenario: <%= game.scenario %>
 <br>
-Options: <%- format_options(JSON.parse(game.options)) %>
+Options: <%= game.options %>
 <br>
 Description: <%= game.description || "No description." %>
-<br>
-Status: <span id="game_status"></span>
-<br>
-Result: <span id="game_result"></span>
 
 <br clear=left>
 
diff --git a/views/profile.ejs b/views/profile.ejs
index 4d97486..a001e21 100644
--- a/views/profile.ejs
+++ b/views/profile.ejs
@@ -1,4 +1,4 @@
-<%- include('header', { title: "Rally the Troops!", refresh: (active_games.length > 0 ? 300 : 0) }) %>
+<%- include('header', { title: "Rally the Troops!", refresh: (active_games.length > 0 ? 300 : 0) }) _%>
 <img class="logo avatar" src="<%= avatar %>" width="80" height="80">
 <p>
 Welcome, <%= user.name %>!
@@ -26,70 +26,79 @@ or <a href="/change_about">profile text</a>.
 <br>&#xbb;
 <a href="/logout">Logout</a>
 
-<% if (open_games.length > 0) { %>
+<%_ if (open_games.length > 0) { _%>
 <h2>Open Games</h2>
 <table class="game">
-<tr><th>ID<th>Game<th>Scenario<th>Players<th>Description<th>Created<th>
-<% open_games.forEach((row) => { %>
+<tr><th>ID<th>Game<th>Scenario<th>Options<th>Players<th>Description<th>Created<th>
+<%_ open_games.forEach((row) => { _%>
 <tr>
 <td class="id"><%= row.game_id %>
 <td class="name"><a href="/info/<%= row.title_id %>"><%= row.title_name %></a>
 <td class="scenario"><%= row.scenario %>
+<td class="options"><%- row.options %>
 <td class="players"><%- row.player_names %>
 <td class="description"><%= row.description %>
 <td class="time"><%= row.ctime %>
 <td class="command"><a href="/join/<%= row.game_id %>">Join</a>
-<% }); %>
+<%_ }); _%>
 </table>
-<% } %>
+<%_ } _%>
 
-<% if (active_games.length > 0) { %>
+<%_ if (active_games.length > 0) { _%>
 <h2>Active Games</h2>
 <table class="game">
-<tr><th>ID<th>Game<th>Scenario<th>Players<th>Description<th>Changed<th>Turn<th>
-<% active_games.forEach((row) => { %>
+<tr><th>ID<th>Game<th>Scenario<th>Options<th>Players<th>Description<th>Changed<th>Turn<th>
+<%_ active_games.forEach((row) => { _%>
 <tr>
 <td class="id"><%= row.game_id %>
 <td class="title"><a href="/info/<%= row.title_id %>"><%= row.title_name %></a>
 <td class="scenario"><%= row.scenario %>
+<td class="options"><%- row.options %>
 <td class="players"><%- row.player_names %>
 <td class="description"><%= row.description %>
 <td class="time"><%= row.mtime %>
-<%
+<%_
 	if (row.is_active) {
 		%><td class="role is_active"><%= row.active %><%
 	} else {
 		%><td class="role"><%= row.active %><%
 	}
 	if (row.is_shared) {
-		%><td class="command"><a href="/join/<%= row.game_id %>">Enter</a><%
+		%><td class="command"><a href="/join/<%= row.game_id %>">Play</a><%
 	} else {
-		%><td class="command"><a href="/play/<%= row.game_id %>">Play</a><%
+		%><td class="command"><a href="/<%- row.title_id %>/play:<%- row.game_id %>:<%- row.your_role %>">Play</a><%
 	}
-%>
-<% }); %>
+_%>
+<%_ }); _%>
 </table>
-<% } %>
+<%_ } _%>
 
-<% if (finished_games.length > 0) { %>
+<%_ if (finished_games.length > 0) { _%>
 <h2>Finished Games</h2>
 <table class="game">
-<tr><th>ID<th>Game<th>Scenario<th>Players<th>Description<th>Finished<th>Result<th>
-<% finished_games.forEach((row) => { %>
+<tr><th>ID<th>Game<th>Scenario<th>Options<th>Players<th>Description<th>Finished<th>Result<th>
+<%_ finished_games.forEach((row) => { _%>
 <tr>
 <td class="id"><%= row.game_id %>
 <td class="title"><a href="/info/<%= row.title_id %>"><%= row.title_name %></a>
 <td class="scenario"><%= row.scenario %>
+<td class="options"><%- row.options %>
 <td class="players"><%- row.player_names %>
 <td class="description"><%= row.description %>
 <td class="time"><%= row.mtime %>
 <td class="result"><%= row.result %>
-<td class="command"><a href="/join/<%= row.game_id %>">View</a>
-<% }); %>
+<%_
+	if (row.is_shared) {
+		%><td class="command"><a href="/join/<%= row.game_id %>">View</a><%
+	} else {
+		%><td class="command"><a href="/<%- row.title_id %>/play:<%- row.game_id %>:<%- row.your_role %>">View</a><%
+	}
+_%>
+<%_ }); _%>
 </table>
-<% } %>
+<%_ } _%>
 
-<% if (open_games.length === 0 && active_games.length === 0 && finished_games.length === 0) { %>
+<%_ if (open_games.length === 0 && active_games.length === 0 && finished_games.length === 0) { _%>
 <p>
 You don't have any current or finished games.
-<% } %>
+<%_ } _%>
-- 
cgit v1.2.3