feat: init setup of liveviews for home, waiting room and game room

assets/js/app.js

@@ -16,26 +16,29 @@
 //
 
 // Include phoenix_html to handle method=PUT/DELETE in forms and buttons.
-import "phoenix_html"
+import "phoenix_html";
 // Establish Phoenix Socket and LiveView configuration.
-import {Socket} from "phoenix"
-import {LiveSocket} from "phoenix_live_view"
-import topbar from "../vendor/topbar"
+import { Socket } from "phoenix";
+import { LiveSocket } from "phoenix_live_view";
+import topbar from "../vendor/topbar";
 
-let csrfToken = document.querySelector("meta[name='csrf-token']").getAttribute("content")
-let liveSocket = new LiveSocket("/live", Socket, {params: {_csrf_token: csrfToken}})
+let csrfToken = document
+  .querySelector("meta[name='csrf-token']")
+  .getAttribute("content");
+let liveSocket = new LiveSocket("/live", Socket, {
+  params: { _csrf_token: csrfToken },
+});
 
 // Show progress bar on live navigation and form submits
-topbar.config({barColors: {0: "#29d"}, shadowColor: "rgba(0, 0, 0, .3)"})
-window.addEventListener("phx:page-loading-start", _info => topbar.show(300))
-window.addEventListener("phx:page-loading-stop", _info => topbar.hide())
+topbar.config({ barColors: { 0: "#29d" }, shadowColor: "rgba(0, 0, 0, .3)" });
+window.addEventListener("phx:page-loading-start", (_info) => topbar.show(300));
+window.addEventListener("phx:page-loading-stop", (_info) => topbar.hide());
 
 // connect if there are any LiveViews on the page
-liveSocket.connect()
+liveSocket.connect();
 
 // expose liveSocket on window for web console debug logs and latency simulation:
-// >> liveSocket.enableDebug()
+liveSocket.enableDebug();
 // >> liveSocket.enableLatencySim(1000)  // enabled for duration of browser session
 // >> liveSocket.disableLatencySim()
-window.liveSocket = liveSocket
-
+window.liveSocket = liveSocket;

lib/viral_spiral/room/room_genserver.ex

@@ -0,0 +1,36 @@
+defmodule ViralSpiral.Room.RoomGenserver do
+  use GenServer
+
+  @impl true
+  def init(init_arg) do
+    {:ok, root}
+  end
+
+  @impl true
+  def handle_cast({:join, player_name}, state) do
+  end
+
+  @impl true
+  def handle_cast({:pass, from, to}, state) do
+  end
+
+  @impl true
+  def handle_cast({:keep, from}, state) do
+  end
+
+  @impl true
+  def handle_cast({:discard, from}, state) do
+  end
+
+  @impl true
+  def handle_cast({:check_source, from}, state) do
+  end
+
+  @impl true
+  def handle_cast({:cancel, from, target}, state) do
+  end
+
+  @impl true
+  def handle_cast({:viral_spiral, from, targets}, state) do
+  end
+end

lib/viral_spiral_web/components/layouts/app.html.heex

@@ -25,7 +25,7 @@
   </div>
 </header>
 <main class="px-4 py-20 sm:px-6 lg:px-8">
-  <div class="mx-auto max-w-2xl">
+  <div class="mx-auto w-full">
     <.flash_group flash={@flash} />
     <%= @inner_content %>
   </div>

lib/viral_spiral_web/live/game_room.ex

@@ -0,0 +1,21 @@
+defmodule ViralSpiralWeb.GameRoom do
+  alias ViralSpiral.Room.State.Room
+  alias ViralSpiral.Room.State.Root
+  use ViralSpiralWeb, :live_view
+
+  def mount(params, session, socket) do
+    room =
+      Room.new()
+      |> Room.start(4)
+
+    root = Root.new(room, ["adhiraj", "krys", "aman", "farah"])
+    IO.inspect(root)
+    IO.puts("hi")
+
+    {:ok, assign(socket, :root, root)}
+  end
+
+  def handle_event("start_game", _params, socket) do
+    {:noreply, socket}
+  end
+end

lib/viral_spiral_web/live/game_room.html.heex

@@ -0,0 +1,20 @@
+<div class="p-4 border-red-200 border-2 rounded-2xl flex flex-row justify-between ">
+  <span><%= @root.room.name %></span>
+  <span><%= @root.room.id %></span>
+  <span><%= @root.room.state %></span>
+  <span><%= @root.room.chaos_counter %></span>
+</div>
+
+<div class="p-4 mt-2 border-red-200 border-2 rounded-2xl flex flex-row justify-between">
+  <%= for player <- Enum.map(@root.players, fn {_id, player} -> player end) do %>
+    <div class={[
+      "p-2  border-2 w-full rounded-xl",
+      if(@root.turn.current == player.id,
+        do: "border-red-400",
+        else: "border-red-100"
+      )
+    ]}>
+      <%= player.name %>
+    </div>
+  <% end %>
+</div>

lib/viral_spiral_web/live/home.ex

@@ -0,0 +1,14 @@
+defmodule ViralSpiralWeb.Home do
+  alias ViralSpiral.Room.State.Room
+  use ViralSpiralWeb, :live_view
+
+  def mount(params, session, socket) do
+    {:ok, socket}
+  end
+
+  def handle_event("create_room", _params, socket) do
+    name = Room.name()
+    # {:noreply, push_navigate(socket, to: "/waiting-room/#{name}")}
+    {:noreply, push_navigate(socket, to: "/room/#{name}")}
+  end
+end

lib/viral_spiral_web/live/home.html.heex

@@ -0,0 +1,3 @@
+<h1>Home</h1>
+
+<.button phx-click="create_room" class="ml-2">Create a new Room!</.button>

lib/viral_spiral_web/live/waiting_room.ex

@@ -0,0 +1,16 @@
+defmodule ViralSpiralWeb.WaitingRoom do
+  @moduledoc """
+  A space for people to wait while other players join.
+
+  We enforce that atleast 3 players are present before someone can start the game.
+  """
+  use ViralSpiralWeb, :live_view
+
+  def mount(params, session, socket) do
+    {:ok, socket}
+  end
+
+  def handle_event("start_game", _params, socket) do
+    {:noreply, socket}
+  end
+end

lib/viral_spiral_web/live/waiting_room.html.heex

@@ -0,0 +1 @@
+<h1>Waiting for everyone to join</h1>

lib/viral_spiral_web/router.ex

@@ -17,7 +17,10 @@ defmodule ViralSpiralWeb.Router do
   scope "/", ViralSpiralWeb do
     pipe_through :browser
 
-    get "/", PageController, :home
+    # get "/", PageController, :home
+    live "/", Home
+    live "/waiting-room/:room", WaitingRoom
+    live "/room/:room", GameRoom
   end
 
   # Other scopes may use custom stacks.