Show player list when connected to a server

public/css/style.css

@@ -61,6 +61,31 @@ body {
   outline: none;
 }
 
+#players {
+  position: fixed;
+  top: 70px;
+  right: 20px;
+  width: 200px;
+  background-color: rgba(255,255,255,0.1);
+}
+
+#players .header {
+  padding: 10px;
+  background-color: rgba(0,0,0,0.3);
+}
+
+#players .body {
+  max-height: 400px;
+  overflow-y: scroll;
+  overflow-x: hidden;
+}
+
+#players ul {
+  list-style: none;
+  padding: 10px;
+  margin: 0;
+}
+
 .color-a { color: #50FF38; }
 .color-b { color: #5BFFFF; }
 .color-c { color: #EA3A3F; }

public/templates/windows/chat.html

@@ -1,4 +1,18 @@
-<div id="buffer" ng-controller="bufferController"></div>
+<div id="buffer" ng-controller="bufferController">
+
+  <div id="players" ng-controller="playersController" ng-show="players.length">
+    <div class="header">Players</div>
+    <div class="body">
+      <ul>
+        <li ng-repeat="player in players">
+          <img src="//cravatar.eu/helmavatar/{{player}}/18" width="18px">
+          {{player}}
+        </li>
+      </ul>
+    </div>
+  </div>
+
+</div>
 
 <form ng-submit="send()" ng-controller="chatController">
   <div id="chat">