Ensure board is flipped when starting a game as dark, move some constants to environment variables, minor frontend changes:

.env.example

@@ -1,3 +1,4 @@
+HOST=0.0.0.0
 NODE_ID=aUniqueString
 DATABASE_URL=ecto://chessh:password@database/chessh
 
@@ -5,6 +6,7 @@ POSTGRES_USER=chessh
 POSTGRES_PASSWORD=password
 POSTGRES_DATABASE=chessh
 
+WEB_PORT=8080
 REACT_APP_GITHUB_OAUTH=https://github.com/login/oauth/authorize?client_id=CLIENT_ID_HERE&redirect_uri=http://127.0.0.1:3000/api/oauth/redirect
 CLIENT_REDIRECT_AFTER_OAUTH=http://127.0.0.1:3000/auth-successful
 

build.sh

@@ -1,16 +1,14 @@
 #!/bin/bash
 
 env_file=.env.prod
-started_in=$PWD
 
 export $(cat $env_file | xargs) 
 
+docker build . -t chessh/server
+
 cd front
 docker build \
  --build-arg REACT_APP_GITHUB_OAUTH=${REACT_APP_GITHUB_OAUTH} \
  --build-arg REACT_APP_SSH_SERVER=${REACT_APP_SSH_SERVER} \
  --build-arg REACT_APP_SSH_PORT=${REACT_APP_SSH_PORT} \
  . -t chessh/frontend 
-
-cd $started_in
-docker build . -t chessh/server

config/config.exs

@@ -15,7 +15,6 @@ config :chessh, RateLimits,
   player_public_keys: 15
 
 config :chessh, Web,
-  port: 8080,
   github_oauth_login_url: "https://github.com/login/oauth/access_token",
   github_user_api_url: "https://api.github.com/user"
 

config/runtime.exs

@@ -1,14 +1,15 @@
 import Config
 
 config :chessh,
-  port: String.to_integer(System.get_env("SSH_PORT", "42069"))
+  ssh_port: String.to_integer(System.get_env("SSH_PORT", "42069"))
 
 config :chessh, Web,
   github_client_id: System.get_env("GITHUB_CLIENT_ID"),
   github_client_secret: System.get_env("GITHUB_CLIENT_SECRET"),
   github_user_agent: System.get_env("GITHUB_USER_AGENT"),
   client_redirect_after_successful_sign_in:
-    System.get_env("CLIENT_REDIRECT_AFTER_OAUTH", "http://localhost:3000")
+    System.get_env("CLIENT_REDIRECT_AFTER_OAUTH", "http://localhost:3000"),
+  port: String.to_integer(System.get_env("WEB_PORT", "8080"))
 
 config :joken,
   default_signer: System.get_env("JWT_SECRET")

deploy.sh

@@ -3,24 +3,18 @@
 datestamp=$(date +%Y%m%d-%H%M)
 env_file=.env.prod
 project_name=chessh
-port=8080
-ssh_port=34355
-host=0.0.0.0
-
 container_names=("chessh-redis" "chessh-database" "chessh-server" "chessh-frontend")
 
+export $(cat $env_file | xargs)
+
 for name in ${container_names[@]}; do
   docker stop $name
   docker rm $name
 done
 
-# Create network for chessh
 docker network ls | grep -q $project_name || docker network create --driver bridge $project_name
-
-# Create redis volume if it does not exist
 docker volume ls | grep -q $project_name-redisdata || docker volume create $project_name-redisdata
 
-# Then start the redis container
 docker run \
 	-d \
 	--restart unless-stopped \
@@ -31,11 +25,7 @@ docker run \
 	--volume $project_name-redisdata:/data/ \
 	redis
 
-# Start postgres container
-# Firstly create pg volume if it does not exist
 docker volume ls | grep -q $project_name-pgdata || docker volume create $project_name-pgdata
-
-# Then run the pg container
 docker run \
   -d \
   --restart unless-stopped \
@@ -46,26 +36,22 @@ docker run \
   --volume $project_name-pgdata:/var/lib/postgresql/data/ \
   postgres
 
-# Start backend container
-# Check if running; if so, stop, and rename
 docker run \
   -d \
   --restart unless-stopped \
   --env-file $env_file \
   --network $project_name \
   --name $project_name-server \
-  --publish "${host}:${ssh_port}:${ssh_port}/tcp" \
+  --publish "${host}:${host_ssh_port}:${container_ssh_port}/tcp" \
   --net-alias server \
   chessh/server
 
-# Start frontend container
-# Check if running; if so, stop, and rename
 docker run \
   -d \
   --restart unless-stopped \
   --env-file $env_file \
   --network $project_name \
   --name $project_name-frontend \
-  --publish "${host}:${port}:80/tcp" \
+  --publish "${HOST}:${PORT}:80/tcp" \
   --net-alias frontend \
   chessh/frontend

front/src/context/auth_context.js

@@ -31,7 +31,7 @@ export const AuthProvider = ({ children }) => {
     fetch("/api/player/logout", {
       method: "GET",
       credentials: "same-origin",
-    }).then(() => setDefaults());
+    }).then(setDefaults);
 
   useEffect(() => {
     setTimeout(() => {

front/src/root.jsx

@@ -19,6 +19,9 @@ export const Root = () => {
           <div className="nav">
             {signedIn ? (
               <>
+                <Link className="link" to="/home">
+                  Home
+                </Link>
                 <Link className="link" to="/password">
                   Password
                 </Link>

front/src/routes/auth_successful.jsx

@@ -24,16 +24,10 @@ export const AuthSuccessful = () => {
     return (
       <>
         <h3>Hello there, {player?.username || ""}! </h3>
-        <div>
-          <span> If you have not already done so: </span>
-          <Link to="/keys" className="button">
-            Add a Public Key
-          </Link>
-        </div>
-        <br />
+        <p>You've successfully been authenticated.</p>
         <div>
           <Link to="/home" className="button">
-            Go Home
+            Get Started
           </Link>
         </div>
       </>

front/src/routes/demo.jsx

@@ -6,7 +6,6 @@ import "asciinema-player/dist/bundle/asciinema-player.css";
 
 const demoProps = {
   theme: "tango",
-  startAt: 12,
   autoPlay: true,
 };
 

front/src/routes/home.jsx

@@ -49,6 +49,19 @@ export const Home = () => {
               codeBlock
             />
           </div>
+          <div>
+            <li>Finally, play chess!</li>
+            <p>Ideally, keeping the following contols in mind:</p>
+            <ul>
+              <li>Ctrl + b / Escape to return to the main menu.</li>
+              <li>Ctrl + c / Ctrl + d to exit at any point.</li>
+              <li>Arrow keys to move around the board.</li>
+              <li>
+                Select a piece with "enter", and move it to a square by pressing
+                "enter" again.
+              </li>
+            </ul>
+          </div>
         </ol>
       </>
     );

front/src/routes/keys.jsx

@@ -20,7 +20,7 @@ const KeyCard = ({ onDelete, props }) => {
   const deleteThisKey = () => {
     if (
       window.confirm(
-        "Are you sure? This will close all your current ssh sessions."
+        "Are you sure? This will close all your currently opened ssh sessions."
       )
     ) {
       fetch(`/api/keys/${id}`, {

front/src/routes/password.jsx

@@ -21,7 +21,7 @@ export const Password = () => {
   const deletePassword = () => {
     if (
       window.confirm(
-        "Are you sure? This will close all your current ssh sessions."
+        "Are you sure? This will close all your currently opened ssh sessions."
       )
     ) {
       fetch(`/api/player/token/password`, {

lib/chessh/ssh/client/client.ex

@@ -103,7 +103,7 @@ defmodule Chessh.SSH.Client do
       :quit ->
         {:stop, :normal, state}
 
-      :previous_screen ->
+      :menu ->
         GenServer.stop(screen_pid)
         link_menu_screen(player_session)
 
@@ -153,7 +153,9 @@ defmodule Chessh.SSH.Client do
       <<3>> -> :quit
       <<4>> -> :quit
       # C-b
-      <<2>> -> :previous_screen
+      <<2>> -> :menu
+      # Escape
+      "\e" -> :menu
       # Arrow keys
       "\e[A" -> :up
       "\e[B" -> :down

lib/chessh/ssh/client/game/game.ex

@@ -41,6 +41,7 @@ defmodule Chessh.SSH.Client.Game do
         | tail
       ])
       when is_nil(color) do
+    # Joining a game
     {is_dark, is_light} = {player_id == dark_player_id, player_id == light_player_id}
 
     new_state =
@@ -57,6 +58,35 @@ defmodule Chessh.SSH.Client.Game do
     init([new_state | tail])
   end
 
+  def init([
+        %State{player_session: player_session, color: color, game: nil} = state
+        | tail
+      ]) do
+    # Starting a new game
+    {:ok, %Game{} = game} =
+      Game.changeset(
+        %Game{},
+        Map.merge(
+          if(color == :light,
+            do: %{light_player_id: player_session.player_id},
+            else: %{dark_player_id: player_session.player_id}
+          ),
+          %{
+            fen: @default_fen
+          }
+        )
+      )
+      |> Repo.insert()
+
+    init([
+      %State{
+        state
+        | game: game
+      }
+      | tail
+    ])
+  end
+
   def init([
         %State{
           player_session: player_session,
@@ -96,10 +126,9 @@ defmodule Chessh.SSH.Client.Game do
     end
 
     binbo_pid = initialize_game(game_id, fen)
-    new_game = Repo.get(Game, game_id) |> Repo.preload([:light_player, :dark_player])
+    game = Repo.get(Game, game_id) |> Repo.preload([:light_player, :dark_player])
 
-    player_color =
-      if(new_game.light_player_id == player_session.player_id, do: :light, else: :dark)
+    player_color = if(game.light_player_id == player_session.player_id, do: :light, else: :dark)
 
     new_state =
       (fn new_state ->
@@ -111,7 +140,7 @@ defmodule Chessh.SSH.Client.Game do
         state
         | binbo_pid: binbo_pid,
           color: player_color,
-          game: new_game,
+          game: game,
           flipped: player_color == :dark
       })
 
@@ -123,37 +152,6 @@ defmodule Chessh.SSH.Client.Game do
     {:ok, new_state}
   end
 
-  def init([
-        %State{player_session: player_session, color: color, client_pid: client_pid, game: nil} =
-          state
-        | _
-      ]) do
-    {:ok, %Game{id: game_id, fen: fen}} =
-      Game.changeset(
-        %Game{},
-        Map.merge(
-          if(color == :light,
-            do: %{light_player_id: player_session.player_id},
-            else: %{dark_player_id: player_session.player_id}
-          ),
-          %{
-            fen: @default_fen
-          }
-        )
-      )
-      |> Repo.insert()
-
-    binbo_pid = initialize_game(game_id, fen)
-    send(client_pid, {:send_to_ssh, Utils.clear_codes()})
-
-    {:ok,
-     %State{
-       state
-       | game: Repo.get(Game, game_id) |> Repo.preload([:light_player, :dark_player]),
-         binbo_pid: binbo_pid
-     }}
-  end
-
   def handle_info(
         {:new_move, move},
         %State{
@@ -210,11 +208,20 @@ defmodule Chessh.SSH.Client.Game do
       ) do
     new_cursor =
       case action do
-        :left -> %{y: cursor_y, x: Utils.wrap_around(cursor_x, -1, Renderer.chess_board_width())}
-        :right -> %{y: cursor_y, x: Utils.wrap_around(cursor_x, 1, Renderer.chess_board_width())}
-        :down -> %{y: Utils.wrap_around(cursor_y, 1, Renderer.chess_board_height()), x: cursor_x}
-        :up -> %{y: Utils.wrap_around(cursor_y, -1, Renderer.chess_board_height()), x: cursor_x}
-        _ -> cursor
+        :left ->
+          %{y: cursor_y, x: Utils.wrap_around(cursor_x, -1, Renderer.chess_board_width())}
+
+        :right ->
+          %{y: cursor_y, x: Utils.wrap_around(cursor_x, 1, Renderer.chess_board_width())}
+
+        :down ->
+          %{y: Utils.wrap_around(cursor_y, 1, Renderer.chess_board_height()), x: cursor_x}
+
+        :up ->
+          %{y: Utils.wrap_around(cursor_y, -1, Renderer.chess_board_height()), x: cursor_x}
+
+        _ ->
+          cursor
       end
 
     maybe_flipped_cursor_tup =

lib/chessh/ssh/client/game/renderer.ex

@@ -9,9 +9,10 @@ defmodule Chessh.SSH.Client.Game.Renderer do
   @tile_width 7
   @tile_height 4
 
-  @previous_move_background ANSI.light_yellow_background()
+  @previous_move_background ANSI.light_magenta_background()
   @from_select_background ANSI.light_green_background()
-  @to_select_background ANSI.light_green_background()
+  @to_select_background ANSI.light_yellow_background()
+
   @dark_piece_color ANSI.red()
   @light_piece_color ANSI.light_cyan()
 

lib/chessh/ssh/daemon.ex

@@ -60,7 +60,7 @@ defmodule Chessh.SSH.Daemon do
     do: pwd_authenticate(username, password, inet)
 
   def handle_info(:start, state) do
-    port = Application.fetch_env!(:chessh, :port)
+    port = Application.fetch_env!(:chessh, :ssh_port)
     key_dir = String.to_charlist(Application.fetch_env!(:chessh, :key_dir))
     max_sessions = Application.fetch_env!(:chessh, :max_sessions)