Chat user list.

gemp-lotr/gemp-lotr-server/src/main/java/com/gempukku/lotro/chat/ChatRoom.java

@@ -31,7 +31,7 @@ public class ChatRoom {
     }
 
     public Set<String> getUsersInRoom() {
-        return new HashSet<String>(_chatRoomListeners.keySet());
+        return new TreeSet<String>(_chatRoomListeners.keySet());
     }
 
     private void shrinkLastMessages() {

gemp-lotr/gemp-lotr-web/src/main/java/com/gempukku/lotro/server/ServerResource.java

@@ -337,13 +337,14 @@ public class ServerResource {
             sendError(Response.Status.NOT_FOUND);
 
         List<ChatMessage> chatMessages = chatRoom.joinUser(participantId);
+        Set<String> usersInRoom = chatRoom.getUsersInRoom();
 
         DocumentBuilderFactory documentBuilderFactory = DocumentBuilderFactory.newInstance();
         DocumentBuilder documentBuilder = documentBuilderFactory.newDocumentBuilder();
 
         Document doc = documentBuilder.newDocument();
 
-        serializeChatRoomData(room, chatMessages, doc);
+        serializeChatRoomData(room, chatMessages, usersInRoom, doc);
 
         return doc;
     }
@@ -363,6 +364,7 @@ public class ServerResource {
             chatRoom.sendMessage(participantId, StringEscapeUtils.escapeHtml(message));
 
         List<ChatMessage> chatMessages = chatRoom.getPendingMessages(participantId);
+        Set<String> usersInRoom = chatRoom.getUsersInRoom();
 
         if (chatMessages == null)
             sendError(Response.Status.NOT_FOUND);
@@ -372,7 +374,7 @@ public class ServerResource {
 
         Document doc = documentBuilder.newDocument();
 
-        serializeChatRoomData(room, chatMessages, doc);
+        serializeChatRoomData(room, chatMessages, usersInRoom, doc);
 
         return doc;
     }
@@ -480,7 +482,7 @@ public class ServerResource {
         return sb.toString();
     }
 
-    private void serializeChatRoomData(String room, List<ChatMessage> chatMessages, Document doc) {
+    private void serializeChatRoomData(String room, List<ChatMessage> chatMessages, Set<String> usersInRoom, Document doc) {
         Element chatElem = doc.createElement("chat");
         chatElem.setAttribute("roomName", room);
         doc.appendChild(chatElem);
@@ -492,6 +494,12 @@ public class ServerResource {
             message.appendChild(doc.createTextNode(chatMessage.getMessage()));
             chatElem.appendChild(message);
         }
+
+        for (String userInRoom : usersInRoom) {
+            Element user = doc.createElement("user");
+            user.appendChild(doc.createTextNode(userInRoom));
+            chatElem.appendChild(user);
+        }
     }
 
     private class SerializationVisitor implements ParticipantCommunicationVisitor {

gemp-lotr/gemp-lotr-web/src/main/webapp/index.html

@@ -29,6 +29,9 @@
             color: #ff0000;
         }
 
+        .chatUser {
+            color: #ffffff;
+        }
     </style>
     <link rel="stylesheet" type="text/css" href="css/dark-hive/jquery-ui-1.8.16.custom.css">
     <link rel="stylesheet" type="text/css" href="js/jquery/styles/jquery.spinnercontrol.css">
@@ -75,7 +78,7 @@
                         $("#user").append("You may <a href='deckBuild.html?participantId=" + participantId + "'>edit your deck</a>.<br/>");
                         $("#user").append("Create a table or join one where other player is waiting to start a game.");
 
-                        var chat = new ChatBoxUI("default", $("#chat"), "/gemp-lotr/server");
+                        var chat = new ChatBoxUI("default", $("#chat"), "/gemp-lotr/server", true);
                         chat.setBounds(2, 2, 780 - 4, 200 - 4);
 
                         var hall = new GempLotrHallUI($("#hall"), "/gemp-lotr/server", chat);

gemp-lotr/gemp-lotr-web/src/main/webapp/js/chat.js

@@ -4,9 +4,10 @@ var ChatBoxUI = Class.extend({
     communication: null,
     chatMessagesDiv: null,
     chatTalkDiv: null,
+    chatListDiv: null,
     talkBoxHeight: 25,
 
-    init: function(name, div, url) {
+    init: function(name, div, url, showList) {
         var that = this;
         this.name = name;
         this.div = div;
@@ -17,6 +18,10 @@ var ChatBoxUI = Class.extend({
 
         this.chatMessagesDiv = $("<div class='chatMessages'></div>");
         this.chatTalkDiv = $("<input class='chatTalk'>");
+        if (showList) {
+            this.chatListDiv = $("<div class='userList'></div>");
+            this.div.append(this.chatListDiv);
+        }
 
         this.div.append(this.chatMessagesDiv);
         this.div.append(this.chatTalkDiv);
@@ -45,7 +50,13 @@ var ChatBoxUI = Class.extend({
     setBounds: function(x, y, width, height) {
         var talkBoxPadding = 3;
 
-        this.chatMessagesDiv.css({ position: "absolute", left: x + "px", top: y + "px", width: width, height: height - this.talkBoxHeight - 3 * talkBoxPadding, overflow: "auto" });
+        var userListWidth = 150;
+        if (this.chatListDiv == null)
+            userListWidth = 0;
+
+        if (this.chatListDiv != null)
+            this.chatListDiv.css({ position: "absolute", left: x + width - userListWidth + "px", top: y + "px", width: userListWidth, height: height - this.talkBoxHeight - 3 * talkBoxPadding, overflow: "auto" });
+        this.chatMessagesDiv.css({ position: "absolute", left: x + "px", top: y + "px", width: width - userListWidth, height: height - this.talkBoxHeight - 3 * talkBoxPadding, overflow: "auto" });
         this.chatTalkDiv.css({ position: "absolute", left: x + talkBoxPadding + "px", top: y - 2 * talkBoxPadding + (height - this.talkBoxHeight) + "px", width: width - 3 * talkBoxPadding , height: this.talkBoxHeight });
     },
 
@@ -70,6 +81,16 @@ var ChatBoxUI = Class.extend({
                 this.appendMessage("<b>" + from + ":</b> " + text);
             }
 
+            if (this.chatListDiv != null) {
+                this.chatListDiv.html("");
+                var users = root.getElementsByTagName("user");
+                for (var i = 0; i < users.length; i++) {
+                    var user = users[i];
+                    var userName = user.childNodes[0].nodeValue;
+                    this.chatListDiv.append("<div class='chatUser'>" + userName + "</div>");
+                }
+            }
+
             var that = this;
 
             if (processAgain)