3 files changed, 92 insertions, 0 deletions
diff --git a/shardweb/lib/shard_web/templates/layout/app.html.eex b/shardweb/lib/shard_web/templates/layout/app.html.eex
new file mode 100644
index 0000000..9903775
--- /dev/null
+++ b/shardweb/lib/shard_web/templates/layout/app.html.eex
@@ -0,0 +1,38 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <meta name="description" content="">
+    <meta name="author" content="">
+
+    <title>Shard.</title>
+    <link rel="stylesheet" href="<%= static_path(@conn, "/css/app.css") %>">
+  </head>
+
+  <body>
+    <div class="container">
+      <header class="header">
+        <nav role="navigation">
+          <ul class="nav nav-pills pull-right">
+            <li><a href="<%= page_path(@conn, :index) %>">Home</a></li>
+            <li><a href="<%= room_path(@conn, :show, "lobby") %>">Chat</a></li>
+          </ul>
+        </nav>
+        <span class="logo"></span>
+      </header>
+
+      <p class="alert alert-info" role="alert"><%= get_flash(@conn, :info) %></p>
+      <p class="alert alert-danger" role="alert"><%= get_flash(@conn, :error) %></p>
+
+
+      <main role="main">
+        <%= render @view_module, @view_template, assigns %>
+      </main>
+
+    </div> <!-- /container -->
+    <%= render_gon_script(@conn) %>
+    <script src="<%= static_path(@conn, "/js/app.js") %>"></script>
+  </body>
+</html>
diff --git a/shardweb/lib/shard_web/templates/page/index.html.eex b/shardweb/lib/shard_web/templates/page/index.html.eex
new file mode 100644
index 0000000..412cbe5
--- /dev/null
+++ b/shardweb/lib/shard_web/templates/page/index.html.eex
@@ -0,0 +1,29 @@
+<h4>Peer list</h4>
+
+<table class="table table-striped">
+  <tr>
+    <th>Peer ID</th>
+    <th>Address</th>
+    <th>Port</th>
+  </tr>
+  <%= for {id, pid, ip, port} <- peer_list() do %>
+    <tr>
+      <td>
+        <%= if pid == nil do %>
+          <%= peer_id_to_str(id) %>
+        <% else %>
+          <strong><%= peer_id_to_str(id) %></strong>
+        <% end %>
+      </td>
+      <td><%= :inet_parse.ntoa(ip) %></td>
+      <td><%= port %></td>
+    </tr>
+  <% end %>
+</table>
+
+<%= form_for @conn, peer_path(@conn, :add), [class: "form-inline"], fn f -> %>
+  <%= text_input f, :ip, [class: "form-control", placeholder: "Hostname / IP address"] %>
+  <%= text_input f, :port, [class: "form-control", placeholder: "Port", value: "4044"] %>
+  <%= submit "Add peer", [class: "btn btn-default"] %>
+<% end %>
+
diff --git a/shardweb/lib/shard_web/templates/room/show.html.eex b/shardweb/lib/shard_web/templates/room/show.html.eex
new file mode 100644
index 0000000..a689017
--- /dev/null
+++ b/shardweb/lib/shard_web/templates/room/show.html.eex
@@ -0,0 +1,25 @@
+      <ul class="nav nav-tabs">
+        <%= for shard <- shard_list() do %>
+          <%= case shard do %>
+            <%= {_, {:chat, name}, _} -> %>
+              <li class="<%= if name == @room do "active" else "" end %>">
+                <a href="<%= room_path(@conn, :show, name) %>">#<%= name %></a>
+              </li>
+          <% end %>
+        <% end %>
+        <li>
+          <a href="#" onclick="if(new_room=prompt('Enter name of room to join, without preceding # sign:'))window.location.href='/room/'+new_room;">Join room</a>
+        </li>
+      </ul>
+
+<!-- The list of messages will appear here: -->
+<ul id='msg-list' class='row' style='list-style: none; min-height:400px; padding: 10px; max-height: 400px; overflow: scroll'></ul>
+
+<div class="row">
+  <div class="col-xs-3">
+    <input type="text" value="<%= @name %>" id="name" class="form-control" placeholder="Your Name">
+  </div>
+  <div class="col-xs-9">
+    <input type="text" id="msg" class="form-control" placeholder="Your Message" autofocus>
+  </div>
+</div>