Merge branch 'fly'

.dockerignore

@@ -0,0 +1,45 @@
+# This file excludes paths from the Docker build context.
+#
+# By default, Docker's build context includes all files (and folders) in the
+# current directory. Even if a file isn't copied into the container it is still sent to
+# the Docker daemon.
+#
+# There are multiple reasons to exclude files from the build context:
+#
+# 1. Prevent nested folders from being copied into the container (ex: exclude
+#    /assets/node_modules when copying /assets)
+# 2. Reduce the size of the build context and improve build time (ex. /build, /deps, /doc)
+# 3. Avoid sending files containing sensitive information
+#
+# More information on using .dockerignore is available here:
+# https://docs.docker.com/engine/reference/builder/#dockerignore-file
+
+.dockerignore
+
+# Ignore git, but keep git HEAD and refs to access current commit hash if needed:
+#
+# $ cat .git/HEAD | awk '{print ".git/"$2}' | xargs cat
+# d0b8727759e1e0e7aa3d41707d12376e373d5ecc
+.git
+!.git/HEAD
+!.git/refs
+
+# Common development/test artifacts
+/cover/
+/doc/
+/test/
+/tmp/
+.elixir_ls
+
+# Mix artifacts
+/_build/
+/deps/
+*.ez
+
+# Generated on crash by the VM
+erl_crash.dump
+
+# Static artifacts - These should be fetched and built inside the Docker image
+/assets/node_modules/
+/priv/static/assets/
+/priv/static/cache_manifest.json

.github/workflows/fly-deploy.yml

@@ -0,0 +1,16 @@
+name: Fly Deploy
+on:
+  push:
+    branches:
+      - main
+jobs:
+  deploy:
+    name: Deploy app
+    runs-on: ubuntu-latest
+    concurrency: deploy-group    # optional: ensure only one action runs at a time
+    steps:
+      - uses: actions/checkout@v4
+      - uses: superfly/flyctl-actions/setup-flyctl@master
+      - run: flyctl deploy --remote-only
+        env:
+          FLY_API_TOKEN: ${{ secrets.FLY_API_TOKEN }}

Dockerfile

@@ -0,0 +1,97 @@
+# Find eligible builder and runner images on Docker Hub. We use Ubuntu/Debian
+# instead of Alpine to avoid DNS resolution issues in production.
+#
+# https://hub.docker.com/r/hexpm/elixir/tags?page=1&name=ubuntu
+# https://hub.docker.com/_/ubuntu?tab=tags
+#
+# This file is based on these images:
+#
+#   - https://hub.docker.com/r/hexpm/elixir/tags - for the build image
+#   - https://hub.docker.com/_/debian?tab=tags&page=1&name=bullseye-20240612-slim - for the release image
+#   - https://pkgs.org/ - resource for finding needed packages
+#   - Ex: hexpm/elixir:1.17.1-erlang-26.2.5-debian-bullseye-20240612-slim
+#
+ARG ELIXIR_VERSION=1.17.1
+ARG OTP_VERSION=26.2.5
+ARG DEBIAN_VERSION=bullseye-20240612-slim
+
+ARG BUILDER_IMAGE="hexpm/elixir:${ELIXIR_VERSION}-erlang-${OTP_VERSION}-debian-${DEBIAN_VERSION}"
+ARG RUNNER_IMAGE="debian:${DEBIAN_VERSION}"
+
+FROM ${BUILDER_IMAGE} as builder
+
+# install build dependencies
+RUN apt-get update -y && apt-get install -y build-essential git \
+    && apt-get clean && rm -f /var/lib/apt/lists/*_*
+
+# prepare build dir
+WORKDIR /app
+
+# install hex + rebar
+RUN mix local.hex --force && \
+    mix local.rebar --force
+
+# set build ENV
+ENV MIX_ENV="prod"
+
+# install mix dependencies
+COPY mix.exs mix.lock ./
+RUN mix deps.get --only $MIX_ENV
+RUN mkdir config
+
+# copy compile-time config files before we compile dependencies
+# to ensure any relevant config change will trigger the dependencies
+# to be re-compiled.
+COPY config/config.exs config/${MIX_ENV}.exs config/
+RUN mix deps.compile
+
+COPY priv priv
+
+COPY lib lib
+
+COPY assets assets
+
+# compile assets
+RUN mix assets.deploy
+
+# Compile the release
+RUN mix compile
+
+# Changes to config/runtime.exs don't require recompiling the code
+COPY config/runtime.exs config/
+
+COPY rel rel
+RUN mix release
+
+# start a new build stage so that the final image will only contain
+# the compiled release and other runtime necessities
+FROM ${RUNNER_IMAGE}
+
+RUN apt-get update -y && \
+  apt-get install -y libstdc++6 openssl libncurses5 locales ca-certificates \
+  && apt-get clean && rm -f /var/lib/apt/lists/*_*
+
+# Set the locale
+RUN sed -i '/en_US.UTF-8/s/^# //g' /etc/locale.gen && locale-gen
+
+ENV LANG en_US.UTF-8
+ENV LANGUAGE en_US:en
+ENV LC_ALL en_US.UTF-8
+
+WORKDIR "/app"
+RUN chown nobody /app
+
+# set runner ENV
+ENV MIX_ENV="prod"
+
+# Only copy the final release from the build stage
+COPY --from=builder --chown=nobody:root /app/_build/${MIX_ENV}/rel/mjw ./
+
+USER nobody
+
+# If using an environment that doesn't automatically reap zombie processes, it is
+# advised to add an init process such as tini via `apt-get install`
+# above and adding an entrypoint. See https://github.com/krallin/tini for details
+# ENTRYPOINT ["/tini", "--"]
+
+CMD ["/app/bin/server"]

TODO.md

@@ -1,5 +1,6 @@
 # TODO
 
+- CD: https://fly.io/docs/app-guides/continuous-deployment-with-github-actions/
 - Put everyone's discards in front of their hand (suggested by Mom)
 - Bug: Can't undo to get first discarded tile of the game from bot (human went last, missed a discarded tile, can't go back to beginning of game). If there are no human actions to go back to, Undo should return to beginning of game.
 - Bug: Undoing a win after a bot drew a tile hung bot (workaround: paused & unpaused bots)
@@ -31,6 +32,8 @@
 - 2-click instead of drag & drop. First click will pause other players.
 - Display everyone's wind direction instead of staircase
 - Animate deal: 4 at a time goes into people's hand
+- Sanity check for (possible race condition) bug: rearranging hand leads to duplicate tiles. Last time it happened after peek tile got put into hand, and user drag & dropped that new tile.
+- Remember sorted hand so it doesn't get reshuffled when losing internet connection
 
 ## Future rule enforcement
 - Winning tile was the last one picked up

config/prod.exs

@@ -5,7 +5,15 @@ import Config
 # manifest is generated by the `mix assets.deploy` task,
 # which you should run after static files are built and
 # before starting your production server.
-config :mjw, MjwWeb.Endpoint, cache_static_manifest: "priv/static/cache_manifest.json"
+config :mjw, MjwWeb.Endpoint,
+  url: [host: "mahjongwind.com", port: 443, scheme: "https"],
+  cache_static_manifest: "priv/static/cache_manifest.json",
+  check_origin: ["//mahjongwind.com"],
+  force_ssl: [
+    host: nil,
+    rewrite_on: [:x_forwarded_port, :x_forwarded_proto],
+    hsts: true
+  ]
 
 # Configures Swoosh API Client
 config :swoosh, api_client: Swoosh.ApiClient.Finch, finch_name: Mjw.Finch

config/runtime.exs

@@ -17,7 +17,9 @@ import Config
 # Alternatively, you can use `mix phx.gen.release` to generate a `bin/server`
 # script that automatically sets the env var above.
 if System.get_env("PHX_SERVER") do
-  config :mjw, MjwWeb.Endpoint, server: true
+  config :mjw, MjwWeb.Endpoint,
+    server: true,
+    url: [host: "mahjongwind.com"]
 end
 
 if config_env() == :prod do
@@ -50,7 +52,7 @@ if config_env() == :prod do
       You can generate one by calling: mix phx.gen.secret
       """
 
-  host = System.get_env("PHX_HOST") || "example.com"
+  host = System.get_env("PHX_HOST") || "mahjongwind.com"
   port = String.to_integer(System.get_env("PORT") || "4000")
 
   config :mjw, :dns_cluster_query, System.get_env("DNS_CLUSTER_QUERY")

fly.toml

@@ -0,0 +1,32 @@
+# fly.toml app configuration file generated for mahjongwind on 2024-06-27T21:09:54+08:00
+#
+# See https://fly.io/docs/reference/configuration/ for information about how to use this file.
+#
+
+app = 'mahjongwind'
+primary_region = 'nrt'
+kill_signal = 'SIGTERM'
+
+[build]
+
+[env]
+  PHX_HOST = 'mahjongwind.com'
+  PORT = '8080'
+
+[http_service]
+  internal_port = 8080
+  force_https = true
+  auto_stop_machines = true
+  auto_start_machines = true
+  min_machines_running = 0
+  processes = ['app']
+
+  [http_service.concurrency]
+    type = 'connections'
+    hard_limit = 1000
+    soft_limit = 1000
+
+[[vm]]
+  memory = '1gb'
+  cpu_kind = 'shared'
+  cpus = 1

lib/mjw_web/components/layouts/root.html.heex

@@ -6,7 +6,8 @@
     <meta name="csrf-token" content={get_csrf_token()} />
     <.live_title><%= assigns[:page_title] || "Mahjong Wind" %></.live_title>
     <link phx-track-static rel="stylesheet" href={~p"/assets/app.css"} />
-    <script defer phx-track-static type="text/javascript" src={~p"/assets/app.js"}></script>
+    <script defer phx-track-static type="text/javascript" src={~p"/assets/app.js"}>
+    </script>
   </head>
   <body>
     <%= @inner_content %>

lib/mjw_web/live/game_live/current_user_seat_component.html.heex

@@ -1,22 +1,47 @@
 <div id={@id}>
   <div class={"tiles flex-wrap turn-glow-0-#{if @current_user_drawing, do: "t"}"}>
-    <div id="hiddengongs-0" phx-hook="Drag" phx-target="#game" class={"hiddengong-tiles dropzone#{if @win_declared_seatno && @win_declared_seatno != @current_user_seatno && @seat.win_expose, do: " exposed-loser-hand"}"}>
+    <div
+      id="hiddengongs-0"
+      phx-hook="Drag"
+      phx-target="#game"
+      class={"hiddengong-tiles dropzone#{if @win_declared_seatno && @win_declared_seatno != @current_user_seatno && @seat.win_expose, do: " exposed-loser-hand"}"}
+    >
       <%= for tile <- @seat.hiddengongs do %>
-        <img id={tile} src={"/images/tiles/#{Mjw.Tile.without_id(tile)}.png"} alt="" class="tile draggable" />
+        <img
+          id={tile}
+          src={"/images/tiles/#{Mjw.Tile.without_id(tile)}.png"}
+          alt=""
+          class="tile draggable"
+        />
       <% end %>
       <div class="dropzone-description">Hidden gong</div>
     </div>
 
     <div id="exposed-0" phx-hook="Drag" phx-target="#game" class="exposed-tiles dropzone">
       <%= for tile <- @seat.exposed do %>
-        <img id={tile} src={"/images/tiles/#{Mjw.Tile.without_id(tile)}.png"} alt="" class="tile draggable" />
+        <img
+          id={tile}
+          src={"/images/tiles/#{Mjw.Tile.without_id(tile)}.png"}
+          alt=""
+          class="tile draggable"
+        />
       <% end %>
       <div class="dropzone-description">Exposed tiles</div>
     </div>
 
-    <div id="wintile-0" phx-hook="Drag" phx-target="#game" class={"wintile-tiles#{if !@win_declared_seatno || @win_declared_seatno == @current_user_seatno, do: " dropzone"}"}>
+    <div
+      id="wintile-0"
+      phx-hook="Drag"
+      phx-target="#game"
+      class={"wintile-tiles#{if !@win_declared_seatno || @win_declared_seatno == @current_user_seatno, do: " dropzone"}"}
+    >
       <%= if @seat.wintile do %>
-        <img id={@seat.wintile} src={"/images/tiles/#{Mjw.Tile.without_id(@seat.wintile)}.png"} alt="" class="tile cursor-not-allowed" />
+        <img
+          id={@seat.wintile}
+          src={"/images/tiles/#{Mjw.Tile.without_id(@seat.wintile)}.png"}
+          alt=""
+          class="tile cursor-not-allowed"
+        />
       <% end %>
       <%= if !@win_declared_seatno || @win_declared_seatno == @current_user_seatno do %>
         <div class="dropzone-description">Winning tile</div>
@@ -25,7 +50,12 @@
 
     <div class="line-break"></div>
 
-    <div id="concealed-0" phx-hook="Drag" phx-target="#game" class={"concealed-tiles dropzone current-user-discarding-#{if @current_user_discarding, do: "t"} enable-pull-from-discards-#{if @available_discard_tile, do: "t"} concealed-loser-hand-#{if @concealed_loser_hand, do: "t"}"}>
+    <div
+      id="concealed-0"
+      phx-hook="Drag"
+      phx-target="#game"
+      class={"concealed-tiles dropzone current-user-discarding-#{if @current_user_discarding, do: "t"} enable-pull-from-discards-#{if @available_discard_tile, do: "t"} concealed-loser-hand-#{if @concealed_loser_hand, do: "t"}"}
+    >
       <%= for tile <- @seat.concealed do %>
         <img
           id={tile}

lib/mjw_web/live/game_live/dice_component.html.heex

@@ -2,7 +2,11 @@
   <div class={"dice-#{@previous_roller_relative_position}"}>
     <%= if @rolled_dice do %>
       <%= for {die, i} <- Enum.with_index(@dice) do %>
-        <img src={"/images/dice/d#{die}.png"} alt="" class={"die die-#{i}#{if @raw_event in [:rolled_for_first_dealer, :rolled_for_deal], do: " #{@game_state}-#{@previous_roller_relative_position}"}"} />
+        <img
+          src={"/images/dice/d#{die}.png"}
+          alt=""
+          class={"die die-#{i}#{if @raw_event in [:rolled_for_first_dealer, :rolled_for_deal], do: " #{@game_state}-#{@previous_roller_relative_position}"}"}
+        />
       <% end %>
     <% end %>
   </div>