From 2b8752d4a4e69a037ec07fb7257ed404215c73ba Mon Sep 17 00:00:00 2001 From: Alex Wolf Date: Sat, 28 Sep 2019 15:05:04 -0700 Subject: [PATCH 1/2] Chat added to dashboard --- assets/css/homepage.css | 12 +++++ lib/phoenix_royale/application.ex | 3 +- lib/phoenix_royale/game/game_chat.ex | 32 +++++++++++ ...nix_royal_web.ex => phoenix_royale_web.ex} | 0 lib/phoenix_royale_web/live/dashboard_live.ex | 16 +++++- .../templates/dashboard/index.html.leex | 54 +++++++++++++++++-- priv/static/css/app.css | 12 +++++ 7 files changed, 122 insertions(+), 7 deletions(-) create mode 100644 lib/phoenix_royale/game/game_chat.ex rename lib/{phoenix_royal_web.ex => phoenix_royale_web.ex} (100%) diff --git a/assets/css/homepage.css b/assets/css/homepage.css index 921aab85..9ab347c5 100644 --- a/assets/css/homepage.css +++ b/assets/css/homepage.css @@ -144,4 +144,16 @@ input[type='text'] { .row { margin-bottom: 0px; +} + +.play-game-title { + text-align: center; + font-size: 48px; + background-image: linear-gradient(109deg, rgba(34, 219, 231, 1) -0.9%, rgba(52, 118, 246, 1) 88.7%); + transition: all 0.25s ease-in-out; +} + +.play-game-title:hover { + transform: scale(0.97); + background-image: linear-gradient(118deg, rgba(34, 219, 231, 1) -0.9%, rgba(52, 118, 246, 1) 88.7%); } \ No newline at end of file diff --git a/lib/phoenix_royale/application.ex b/lib/phoenix_royale/application.ex index 4c81f0a6..0c16f983 100644 --- a/lib/phoenix_royale/application.ex +++ b/lib/phoenix_royale/application.ex @@ -14,7 +14,8 @@ defmodule PhoenixRoyale.Application do PhoenixRoyaleWeb.Endpoint, # Starts a worker by calling: PhoenixRoyale.Worker.start_link(arg) # {PhoenixRoyale.Worker, arg}, - PhoenixRoyale.GameCoordinator + PhoenixRoyale.GameCoordinator, + PhoenixRoyale.GameChat ] # See https://hexdocs.pm/elixir/Supervisor.html diff --git a/lib/phoenix_royale/game/game_chat.ex b/lib/phoenix_royale/game/game_chat.ex new file mode 100644 index 00000000..eef2d6b5 --- /dev/null +++ b/lib/phoenix_royale/game/game_chat.ex @@ -0,0 +1,32 @@ +defmodule PhoenixRoyale.GameChat do + use GenServer + + @server_name {:global, __MODULE__} + + def start_link(_init_args) do + # you may want to register your server with `name: __MODULE__` + # as a third argument to `start_link` + GenServer.start_link(__MODULE__, %{messages: []}, name: @server_name) + end + + def init(server) do + {:ok, server} + end + + def state() do + GenServer.call(@server_name, :state) + end + + def new_message(author, content) do + GenServer.cast(@server_name, {:new_message, author, content}) + end + + def handle_call(:state, _from, state) do + {:reply, state, state} + end + + def handle_cast({:new_message, author, content}, state) do + message = {author, content} + {:noreply, %{state | messages: [message | state.messages]}} + end +end diff --git a/lib/phoenix_royal_web.ex b/lib/phoenix_royale_web.ex similarity index 100% rename from lib/phoenix_royal_web.ex rename to lib/phoenix_royale_web.ex diff --git a/lib/phoenix_royale_web/live/dashboard_live.ex b/lib/phoenix_royale_web/live/dashboard_live.ex index 3a8d83fb..347f3e8c 100644 --- a/lib/phoenix_royale_web/live/dashboard_live.ex +++ b/lib/phoenix_royale_web/live/dashboard_live.ex @@ -1,6 +1,6 @@ defmodule PhoenixRoyaleWeb.DashboardLive do use Phoenix.LiveView - alias PhoenixRoyale.{Account, GameStats} + alias PhoenixRoyale.{Account, GameStats, GameChat} def render(assigns) do Phoenix.View.render(PhoenixRoyaleWeb.DashboardView, "index.html", assigns) @@ -9,6 +9,7 @@ defmodule PhoenixRoyaleWeb.DashboardLive do def mount(session, socket) do account = Account.by_id(session.account_id) :timer.send_after(3000, self(), :update) + :timer.send_after(500, self(), :chat_update) stats = GameStats.fetch_stats() live_games = GameStats.live_games() @@ -17,7 +18,8 @@ defmodule PhoenixRoyaleWeb.DashboardLive do account_id: session.account_id, account: account, stats: stats, - live_games: live_games + live_games: live_games, + chat_messages: GameChat.state().messages )} end @@ -25,10 +27,20 @@ defmodule PhoenixRoyaleWeb.DashboardLive do {:noreply, socket} end + def handle_event("new_message", %{"message" => message}, socket) do + GameChat.new_message(socket.assigns.account.name, message) + {:noreply, assign(socket, chat_messages: GameChat.state().messages)} + end + def handle_info(:update, socket) do :timer.send_after(3000, self(), :update) stats = GameStats.fetch_stats() live_games = GameStats.live_games() {:noreply, assign(socket, stats: stats, live_games: live_games)} end + + def handle_info(:chat_update, socket) do + :timer.send_after(500, self(), :chat_update) + {:noreply, assign(socket, chat_messages: GameChat.state().messages)} + end end diff --git a/lib/phoenix_royale_web/templates/dashboard/index.html.leex b/lib/phoenix_royale_web/templates/dashboard/index.html.leex index 9bd4d59a..f09b2bee 100644 --- a/lib/phoenix_royale_web/templates/dashboard/index.html.leex +++ b/lib/phoenix_royale_web/templates/dashboard/index.html.leex @@ -230,7 +230,22 @@ -
+
+ +
+
+
+
+
+ Play a game! +
+ +
+
+
+
+ +
@@ -242,7 +257,7 @@ <% Enum.count(@live_games) == 0 -> %> There are no games being played right now :( - <% Enum.count(@live_games) <= 20 -> %> + <% Enum.count(@live_games) <= 12 -> %>
    <%= for game <- @live_games do %> @@ -253,12 +268,12 @@
      - <%= for game <- Enum.slice(@live_games, 0..19) do %> + <%= for game <- Enum.slice(@live_games, 0..11) do %>
    • Total: <%= game.player_count %> Alive: <%= game.alive_count %>
      • <% end %>
    - There are more than 20 games being played right now! + There are more than 12 games being played right now! <% end %> @@ -270,6 +285,35 @@
+
+
+
+
+
+
+
+
+ Chat + <%= unless @chat_messages == [] do %> +
    + + <%= for {author, content} <- Enum.slice(@chat_messages, 0..12) do %> +
  • <%= author %>: <%= content %>
    • + <% end %> + +
+ <% end %> + <%= f = form_for :message, "#", [phx_submit: :new_message] %> + + <%= submit "enter" %> + +
+ +
+
+
+ +
@@ -277,6 +321,8 @@
+ +