Usernames, logging in, validations, etc.

apps/bwc/lib/bwc.ex

@@ -7,7 +7,6 @@ defmodule Bwc do
 
   @repo Repo
 
-
   def new_player, do: Player.changeset(%Player{})
 
   def create_player(attrs), do: Player.changeset(%Player{}, attrs) |> @repo.insert()
@@ -18,6 +17,17 @@ defmodule Bwc do
 
   def get_player(id), do: @repo.get!(Player, id)
 
+  def get_player_by(params), do: @repo.get_by(Player, params)
+
+  def get_or_create_player(username) do
+    case get_player_by(%{username: username}) do
+      %Player{} = player ->
+        {:ok, player}
+      _ ->
+        create_player(%{username: username})
+    end
+  end
+
   def list_cards, do: @repo.all(Card)
 
   def get_card(id), do: @repo.get!(Card, id)
@@ -28,9 +38,9 @@ defmodule Bwc do
 
   def new_card, do: Card.changeset(%Card{})
 
-  def size, do: Bwc.list_cards |> length
+  def size, do: Bwc.list_cards() |> length
 
-  def draw_card, do: Bwc.list_cards |> Enum.random
+  def draw_card, do: Bwc.list_cards() |> Enum.random()
   def draw, do: draw_card()
 
   def delete_card(%Bwc.Card{} = card), do: @repo.delete(card)
@@ -41,5 +51,4 @@ defmodule Bwc do
     |> Card.changeset(updates)
     |> @repo.update
   end
-
 end

apps/bwc/lib/bwc/player.ex

@@ -12,7 +12,7 @@ defmodule Bwc.Player do
     |> cast(attrs, [:username, :picture])
     |> validate_required(:username)
     |> unique_constraint(:username)
-    |> validate_length(:username, min: 3)
+    |> validate_length(:username, min: 3, max: 20)
   end
 
 end

apps/bwc_web/assets/css/bwc.css

@@ -9,6 +9,9 @@ border-bottom: 2px solid gainsboro;
 
 }
 
+#top-bar-login-box{display:none; width: 100px;margin:0px;border:1px solid gray !important; background-image:"" !important}
+#top-bar-username{width:200px;font-size:15px}
+
 .uk-subnav-pill > * > :first-child{
     padding: 0px 50px !important;
 }

apps/bwc_web/assets/js/bwc.js

@@ -4,6 +4,57 @@ window.jQuery = $;
 window.$ = $;
 window.UIkit = UIkit;
 
+window.show_login_box = () => {
+
+    $("#top-bar-username a").hide();
+    $("#top-bar-login-box").show().focus();
+
+}
+
+window.hide_login_box = () => {
+
+    $("#top-bar-username a").show();
+    $("#top-bar-login-box").hide()
+
+}
+
+
+
+$('#top-bar-login-box').on('keyup keypress', function(e) {
+	var keyCode = e.keyCode || e.which;
+	if (keyCode === 13) {
+	    e.preventDefault();
+	    return false;
+	}
+    });
+
+
+$("#top-bar-login-box").keyup(function(e) {
+    if (e.keyCode == "13") {
+        login();
+    }
+});
+
+window.login = () => {
+    var CSRF_TOKEN = $("input[name=_csrf_token]").val();
+    var username = $("#top-bar-login-box").val();
+    $.ajax({
+        url: "/api/join",
+        method: 'POST',
+        beforeSend: function(xhr) {
+            xhr.setRequestHeader("X-CSRF-Token", CSRF_TOKEN);
+        },
+        data: {
+            username: username
+        }
+    }).done(function(response) {
+        console.log(response);
+        UIkit.notification(response['data']);
+        hide_login_box();        
+        $("#top-bar-username a").text(response['username']);
+    });
+}
+
 window.deleteCard = (id) => {
     var CSRF_TOKEN = $("input[name=_csrf_token]").val();
     $.ajax({

apps/bwc_web/lib/bwc_web/controllers/session_controller.ex

@@ -3,16 +3,33 @@ defmodule BwcWeb.SessionController do
 
   def new(conn, _params) do
     player = Bwc.new_player()
-    render conn, "new.html", player: player
+    render(conn, "new.html", player: player)
   end
 
-  def create(conn, params) do
-    require Logger
-    Logger.debug(params)
+  def set_name(conn, params) do
+    import Logger
+
+    case Map.get(params, "username") |> Bwc.get_or_create_player() do
+      {:ok, player} ->
+        conn |> put_session(:username, player.username) |> render("set_name.json", username: player.username)
+
+      {:error, username} ->
+        conn |> render("error.json", username: username)
+    end
+  end
+
+  def create(conn, %{"player" => %{"username" => username, "picture" => picture}}) do
     cards = Bwc.list_cards()
-    case Bwc.create_player(Map.get(params, "player")) do
-      {:ok, username} -> conn |> put_session(:username, username) |> redirect(to: Routes.card_path(conn, :index, cards))
-      {:error, player} -> render(conn, "new.html", player: player)
+
+    case Bwc.get_or_create_player(username) do
+      {:ok, player} ->
+        conn
+        |> put_session(:username, username)
+        |> put_flash(:info, "Welcome to the game, #{player.username}.")
+        |> redirect(to: Routes.card_path(conn, :index, cards))
+
+      {:error, player} ->
+        conn |> put_flash(:error, "Something's wrong.") |> render("new.html", player: player)
     end
   end
 end

apps/bwc_web/lib/bwc_web/roster.ex

@@ -0,0 +1,17 @@
+defmodule BwcWeb.Roster do
+  import Plug.Conn
+
+  def init(opts), do: opts
+
+  def call(conn, _opts) do
+    player =
+      conn
+      |> get_session(:username)
+      |> case do
+        nil -> Bwc.new_player()
+        username -> Bwc.get_player_by(%{username: username})
+      end
+
+    assign(conn, :player, player)
+  end
+end

apps/bwc_web/lib/bwc_web/router.ex

@@ -7,10 +7,12 @@ defmodule BwcWeb.Router do
     plug :fetch_flash
     plug :protect_from_forgery
     plug :put_secure_browser_headers
+    plug BwcWeb.Roster
   end
 
   pipeline :api do
     plug :accepts, ["json"]
+    plug :fetch_session
   end
 
   scope "/", BwcWeb do
@@ -32,6 +34,9 @@ defmodule BwcWeb.Router do
     pipe_through :api
 
     resources "/cards", CardController, only: [:delete]
+
+    post "/join", SessionController, :set_name
+
   end
 
   # Enables LiveDashboard only for development

apps/bwc_web/lib/bwc_web/templates/layout/app.html.eex

@@ -19,9 +19,16 @@
                 </a>
             </h1>
             <div class='auth uk-flex uk-flex-column uk-flex-center'>
-            <span class='uk-icon' uk-icon="icon:user"></span>
-            <small><b>You are:&nbsp;</b>
-            Nobody</small>
+            <div>
+            <span class='uk-icon' uk-icon="icon:user" style="width:150px;"></span>
+            </div>
+            <div id="top-bar-username" class='uk-flex uk-flex-row uk-flex-center uk-margin-small-top'>
+            <b>You are:&nbsp;</b>
+            <a style='width:100px;' href="javascript:show_login_box()">
+            <%= @player.username %>
+            </a>
+            <input id="top-bar-login-box"/>
+            </div>
             </div>
         </div>
 

apps/bwc_web/lib/bwc_web/views/session_view.ex

@@ -1,3 +1,13 @@
 defmodule BwcWeb.SessionView do
   use BwcWeb, :view
+
+
+  def render("set_name.json", params) do
+    username = Map.get(params,:username)
+    %{
+      data: "You are now known as '#{username}'.",
+      username: username
+    }
+  end
+
 end