From 6cba55b27e273ed69576a61dfadbd0cd5d0505ed Mon Sep 17 00:00:00 2001
From: Carl Worth <cworth@cworth.org>
Date: Sat, 7 Mar 2026 11:40:11 -0500
Subject: [PATCH] Add a form to join an existing game (by 4-letter code) from
 each game page

We already had the ability to host a new game at these pages, but a
user may land here on want to join an existing game. So give them that
form to be able to do that. (Saves them having to know that they could
go to / to do that, and saves them the work of doing that.)
---
 empathy/index.html   | 20 ++++++++++++++++++++
 empires/index.html   | 20 ++++++++++++++++++++
 letterrip/index.html | 20 ++++++++++++++++++++
 scribe/index.html    | 20 ++++++++++++++++++++
 tictactoe/index.html | 20 ++++++++++++++++++++
 5 files changed, 100 insertions(+)

diff --git a/empathy/index.html b/empathy/index.html
index c25d75e..d7c004a 100644
--- a/empathy/index.html
+++ b/empathy/index.html
@@ -25,6 +25,26 @@
       <div id="message-area">
       </div>
 
+      <form onsubmit="lmno_join(this); return false">
+
+        <div class="form-field large">
+          <label for="id">Game ID</label>
+          <input type="text" id="id" maxlength="4"
+                 placeholder="Enter a 4-letter Game Code"
+                 oninput="this.value = this.value.toUpperCase()"
+                 autocomplete="off"
+                 required
+                 autofocus>
+        </div>
+
+        <div class="form-field large">
+          <button type="submit">
+            Join Game
+          </button>
+        </div>
+
+      </form>
+
       <form onsubmit="lmno_new('empathy'); return false;">
         <button type="submit">
           Host a new game
diff --git a/empires/index.html b/empires/index.html
index b873e9e..ab88805 100644
--- a/empires/index.html
+++ b/empires/index.html
@@ -25,6 +25,26 @@
       <div id="message-area">
       </div>
 
+      <form onsubmit="lmno_join(this); return false">
+
+        <div class="form-field large">
+          <label for="id">Game ID</label>
+          <input type="text" id="id" maxlength="4"
+                 placeholder="Enter a 4-letter Game Code"
+                 oninput="this.value = this.value.toUpperCase()"
+                 autocomplete="off"
+                 required
+                 autofocus>
+        </div>
+
+        <div class="form-field large">
+          <button type="submit">
+            Join Game
+          </button>
+        </div>
+
+      </form>
+
       <form onsubmit="lmno_new('empires'); return false;">
         <button type="submit">
           Host a new game
diff --git a/letterrip/index.html b/letterrip/index.html
index 8cac06b..8284fdc 100644
--- a/letterrip/index.html
+++ b/letterrip/index.html
@@ -28,6 +28,26 @@
       <div id="message-area">
       </div>
 
+      <form onsubmit="lmno_join(this); return false">
+
+        <div class="form-field large">
+          <label for="id">Game ID</label>
+          <input type="text" id="id" maxlength="4"
+                 placeholder="Enter a 4-letter Game Code"
+                 oninput="this.value = this.value.toUpperCase()"
+                 autocomplete="off"
+                 required
+                 autofocus>
+        </div>
+
+        <div class="form-field large">
+          <button type="submit">
+            Join Game
+          </button>
+        </div>
+
+      </form>
+
       <form onsubmit="lmno_new('letterrip'); return false;">
         <button type="submit">
           Host a new game
diff --git a/scribe/index.html b/scribe/index.html
index 7638db9..994ea14 100644
--- a/scribe/index.html
+++ b/scribe/index.html
@@ -26,6 +26,26 @@
       <div id="message-area">
       </div>
 
+      <form onsubmit="lmno_join(this); return false">
+
+        <div class="form-field large">
+          <label for="id">Game ID</label>
+          <input type="text" id="id" maxlength="4"
+                 placeholder="Enter a 4-letter Game Code"
+                 oninput="this.value = this.value.toUpperCase()"
+                 autocomplete="off"
+                 required
+                 autofocus>
+        </div>
+
+        <div class="form-field large">
+          <button type="submit">
+            Join Game
+          </button>
+        </div>
+
+      </form>
+
       <form onsubmit="lmno_new('scribe'); return false;">
         <button type="submit">
           Host a new game
diff --git a/tictactoe/index.html b/tictactoe/index.html
index 563973b..72aeefb 100644
--- a/tictactoe/index.html
+++ b/tictactoe/index.html
@@ -24,6 +24,26 @@
       <div id="message-area">
       </div>
 
+      <form onsubmit="lmno_join(this); return false">
+
+        <div class="form-field large">
+          <label for="id">Game ID</label>
+          <input type="text" id="id" maxlength="4"
+                 placeholder="Enter a 4-letter Game Code"
+                 oninput="this.value = this.value.toUpperCase()"
+                 autocomplete="off"
+                 required
+                 autofocus>
+        </div>
+
+        <div class="form-field large">
+          <button type="submit">
+            Join Game
+          </button>
+        </div>
+
+      </form>
+
       <form onsubmit="lmno_new('tictactoe'); return false;">
         <button type="submit">
           Host a new game
-- 
2.45.2