Adding the chat to the games themselves.

This commit is contained in:
marcins78@gmail.com
2011-09-12 20:51:02 +00:00
parent c8460ebf73
commit a8f9dec190
7 changed files with 139 additions and 74 deletions

View File

@@ -10,6 +10,10 @@ public class ChatRoom {
private LinkedList<ChatMessage> _lastMessages = new LinkedList<ChatMessage>();
private Map<String, ChatRoomListener> _chatRoomListeners = new HashMap<String, ChatRoomListener>();
public ChatRoom() {
postMessage("System", "Welcome to the room");
}
public void postMessage(String from, String message) {
ChatMessage chatMessage = new ChatMessage(new Date(), from, message);
_lastMessages.add(chatMessage);

View File

@@ -17,6 +17,11 @@
<artifactId>gemp-lotr-server</artifactId>
<version>${project.version}</version>
</dependency>
<dependency>
<groupId>commons-lang</groupId>
<artifactId>commons-lang</artifactId>
<version>2.6</version>
</dependency>
<dependency>
<groupId>javax.servlet</groupId>
<artifactId>servlet-api</artifactId>

View File

@@ -17,6 +17,7 @@ import com.gempukku.lotro.game.ParticipantCommunicationVisitor;
import com.gempukku.lotro.logic.decisions.AwaitingDecision;
import com.gempukku.lotro.logic.timing.Action;
import com.sun.jersey.spi.resource.Singleton;
import org.apache.commons.lang.StringEscapeUtils;
import org.apache.log4j.Logger;
import org.w3c.dom.Document;
import org.w3c.dom.Element;
@@ -368,9 +369,14 @@ public class ServerResource {
if (chatRoom == null)
sendError(Response.Status.NOT_FOUND);
chatRoom.sendMessage(participantId, message);
if (message != null)
chatRoom.sendMessage(participantId, StringEscapeUtils.escapeHtml(message));
List<ChatMessage> chatMessages = chatRoom.getPendingMessages(participantId);
if (chatMessages == null)
sendError(Response.Status.NOT_FOUND);
DocumentBuilderFactory documentBuilderFactory = DocumentBuilderFactory.newInstance();
DocumentBuilder documentBuilder = documentBuilderFactory.newDocumentBuilder();

View File

@@ -64,6 +64,7 @@
<script type="text/javascript" src="js/inheritance.js"></script>
<script type="text/javascript" src="js/communication.js"></script>
<script type="text/javascript" src="js/chat.js"></script>
<script type="text/javascript" src="js/gameUi.js"></script>
<script type="text/javascript" src="js/jCardGroup.js"></script>
<script type="text/javascript" src="js/jCards.js"></script>
@@ -98,12 +99,14 @@
$(document).ready(
function () {
ui = new GempLotrGameUI();
communication = new GempLotrCommunication("/gemp-lotr/server",
function() {
ui.processError();
alert("There was a problem communicaiton with server, most likely the game does not exist");
});
ui = new GempLotrGameUI(communication);
ui.setUpdateState(function() {
communication.updateGameState(function(xml) {
ui.processXml(xml);

View File

@@ -19,8 +19,25 @@
<script type="text/javascript" src="js/inheritance.js"></script>
<script type="text/javascript" src="js/logging.js"></script>
<script type="text/javascript" src="js/chat.js"></script>
<script type="text/javascript" src="js/communication.js"></script>
<script type="text/javascript">
function getUrlParam(param) {
var search = window.location.search.substring(1);
if (search.indexOf('&') > -1) {
var params = search.split('&');
for (var i = 0; i < params.length; i++) {
var key_value = params[i].split('=');
if (key_value[0] == param) return key_value[1];
}
} else {
var params = search.split('=');
if (params[0] == param) return params[1];
}
return null;
}
$(document).ready(
function() {
/* attach a submit handler to the form */
@@ -45,7 +62,7 @@
});
var chat = new ChatBoxUI("default", $("#chat"), comm);
chat.setSize(800, 300);
chat.setBounds(2, 2, 800 - 4, 300 - 4);
});
</script>

View File

@@ -4,6 +4,7 @@ var ChatBoxUI = Class.extend({
communication: null,
chatMessagesDiv: null,
chatTalkDiv: null,
talkBoxHeight: 25,
init: function(name, div, communication) {
this.name = name;
@@ -20,19 +21,28 @@ var ChatBoxUI = Class.extend({
this.communication.startChat(this.name, function(xml) {
that.processMessages(xml, true);
})
});
this.chatTalkDiv.bind("keypress", function(e) {
var code = (e.keyCode ? e.keyCode : e.which);
if (code == 13) {
that.sendMessage($(this).value);
var value = $(this).val();
that.sendMessage(value);
that.appendMessage("<b>Me:</b> " + that.escapeHtml(value));
$(this).val("");
}
});
},
setSize: function(width, height) {
this.chatMessagesDiv.css({ position: "absolute", left: 0 + "px", top: 0 + "px", width: width, height: height - 30, overflow: "scroll" });
this.chatTalkDiv.css({ position: "absolute", left: 0 + "px", top: (height - 30) + "px", width: width, height: 30 });
escapeHtml: function(text) {
return $('<div/>').text(text).html();
},
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" });
this.chatTalkDiv.css({ position: "absolute", left: x + talkBoxPadding + "px", top: y - 2 * talkBoxPadding + (height - this.talkBoxHeight) + "px", width: width - 3 * talkBoxPadding , height: this.talkBoxHeight });
},
appendMessage: function(message) {
@@ -40,21 +50,26 @@ var ChatBoxUI = Class.extend({
if ($("p", this.chatMessagesDiv).length > 50) {
$("p", this.chatMessagesDiv).first().remove();
}
this.chatMessagesDiv.prop({ scrollTop: this.chatMessagesDiv.prop("scrollHeight") });
},
processMessages: function(xml, processAgain) {
var root = xml.documentElement;
if (root.tagName == 'chat') {
var messages = element.getElementsByTagName("message");
var messages = root.getElementsByTagName("message");
for (var i = 0; i < messages.length; i++) {
var message = messages[i];
var from = message.getAttribute("from");
var text = message.childNodes[0].nodeValue;
this.appendMessage("<b>" + from + ":</b>" + text);
this.appendMessage("<b>" + from + ":</b> " + text);
}
var that = this;
if (processAgain)
setTimeout(this.updateChatMessages, 1000);
setTimeout(function() {
that.updateChatMessages();
}, 1000);
}
},

View File

@@ -35,8 +35,13 @@ var GempLotrGameUI = Class.extend({
swipeOptions: null,
init: function() {
chatBoxDiv: null,
chatBox: null,
communication: null,
init: function(communication) {
log("ui initialized");
this.communication = communication;
$.expr[':'].cardId = function(obj, index, meta, stack) {
var cardIds = meta[3].split(",");
@@ -123,6 +128,12 @@ var GempLotrGameUI = Class.extend({
this.alert.css({"border-radius": "7px"});
$("#main").append(this.alert);
this.chatBoxDiv = $("<div class='ui-widget-content'><div id='chatBox'></div></div>");
this.chatBoxDiv.css({"border-radius": "7px"});
$("#main").append(this.chatBoxDiv);
this.chatBox = new ChatBoxUI("Game" + getUrlParam("gameId"), $("#chatBox"), this.communication);
$("body").click(
function (event) {
that.clickCardFunction(event);
@@ -147,7 +158,7 @@ var GempLotrGameUI = Class.extend({
},
displayCardInfo: function(card) {
this.infoDialog.html("<div><div style='float: left;'><img src='" + card.imageUrl + "' height='250'></div><div id='cardEffects'></div></div>");
this.infoDialog.html("<div style='scroll: auto'><div style='float: left;'><img src='" + card.imageUrl + "'></div><div id='cardEffects'></div></div>");
var cardId = card.cardId;
if (cardId.length < 4 || cardId.substring(0, 4) != "temp")
@@ -163,52 +174,52 @@ var GempLotrGameUI = Class.extend({
initializeDialogs: function() {
this.dialogInstance = $("<div></div>")
.dialog({
autoOpen: false,
closeOnEscape: false,
resizable: false,
minHeight: 80
});
autoOpen: false,
closeOnEscape: false,
resizable: false,
minHeight: 80
});
this.assignmentDialog = $("<div></div>")
.dialog({
autoOpen: false,
closeOnEscape: false,
title: "Assignments",
resizable: true,
minHeight: 240,
minWidth: 400,
width: 500,
height: 200,
position: ["right", "bottom"]
});
autoOpen: false,
closeOnEscape: false,
title: "Assignments",
resizable: true,
minHeight: 240,
minWidth: 400,
width: 500,
height: 200,
position: ["right", "bottom"]
});
this.skirmishDialog = $("<div></div>")
.dialog({
autoOpen: false,
closeOnEscape: false,
title: "Skirmish",
resizable: true,
minHeight: 240,
minWidth: 400,
width: 500,
height: 200,
position: ["right", "top"]
});
autoOpen: false,
closeOnEscape: false,
title: "Skirmish",
resizable: true,
minHeight: 240,
minWidth: 400,
width: 500,
height: 200,
position: ["right", "top"]
});
$(".ui-dialog-titlebar-close").hide();
this.infoDialog = $("<div></div>")
.dialog({
autoOpen: false,
closeOnEscape: true,
resizable: false,
title: "Card information",
minHeight: 80,
minWidth: 200,
width: 600,
height: 300,
maxHeight: 300
});
autoOpen: false,
closeOnEscape: true,
resizable: false,
title: "Card information",
minHeight: 80,
minWidth: 200,
width: 600,
height: 300,
maxHeight: 300
});
},
@@ -234,7 +245,9 @@ var GempLotrGameUI = Class.extend({
var alertHeight = 120;
this.advPathGroup.setBounds(padding, padding, advPathWidth, height - (padding * 2));
var chatHeight = 200;
this.advPathGroup.setBounds(padding, padding, advPathWidth, height - (padding * 3) - chatHeight);
this.supportOpponent.setBounds(advPathWidth + specialUiWidth + (padding * 2), padding + yScales[0] * heightPerScale, width - (advPathWidth + specialUiWidth + shadowSupportWidth + padding * 4), heightScales[0] * heightPerScale);
this.charactersOpponent.setBounds(advPathWidth + specialUiWidth + (padding * 2), padding * 2 + yScales[1] * heightPerScale, width - (advPathWidth + specialUiWidth + shadowSupportWidth + padding * 4), heightScales[1] * heightPerScale);
this.shadow.setBounds(advPathWidth + specialUiWidth + (padding * 2), padding * 3 + yScales[2] * heightPerScale, width - (advPathWidth + specialUiWidth + padding * 3), heightScales[2] * heightPerScale);
@@ -244,8 +257,10 @@ var GempLotrGameUI = Class.extend({
this.shadowOpponent.setBounds(width - (shadowSupportWidth + padding), padding, shadowSupportWidth, padding + (heightScales[0] + heightScales[1]) * heightPerScale);
this.shadowPlayer.setBounds(width - (shadowSupportWidth + padding), padding * 4 + yScales[3] * heightPerScale, shadowSupportWidth, padding + (heightScales[3] + heightScales[4]) * heightPerScale);
this.gameStateElem.css({ position: "absolute", left: padding * 2 + advPathWidth, top: padding, width: specialUiWidth - padding, height: height - padding * 3 - alertHeight });
this.alert.css({ position: "absolute", left: padding * 2 + advPathWidth, top: height - padding - alertHeight, width: specialUiWidth - padding, height: alertHeight });
this.gameStateElem.css({ position: "absolute", left: padding * 2 + advPathWidth, top: padding, width: specialUiWidth - padding, height: height - padding * 4 - alertHeight - chatHeight});
this.alert.css({ position: "absolute", left: padding * 2 + advPathWidth, top: height - (padding * 2) - alertHeight - chatHeight, width: specialUiWidth - padding, height: alertHeight });
this.chatBoxDiv.css({ position: "absolute", left: padding, top: height - padding - chatHeight, width: specialUiWidth + advPathWidth, height: chatHeight });
this.chatBox.setBounds(4, 4, specialUiWidth + advPathWidth - 8, chatHeight - 8);
}
},
@@ -457,7 +472,7 @@ var GempLotrGameUI = Class.extend({
if (index != -1)
cardData.attachedCards.splice(index, 1);
}
);
);
var card = $(".card:cardId(" + cardId + ")");
var cardData = card.data("card");
@@ -522,7 +537,7 @@ var GempLotrGameUI = Class.extend({
if (index != -1)
cardData.attachedCards.splice(index, 1);
}
);
);
}
card.remove();
@@ -587,13 +602,13 @@ var GempLotrGameUI = Class.extend({
this.dialogInstance
.html(text + "<br /><input id='integerDecision' type='text' value='0'>")
.dialog("option", "buttons",
{
"OK": function() {
$(this).dialog("close");
that.decisionFunction(id, $("#integerDecision").val());
}
}
)
{
"OK": function() {
$(this).dialog("close");
that.decisionFunction(id, $("#integerDecision").val());
}
}
)
.dialog("option", "width", "400")
.dialog("option", "height", "auto");
;
@@ -627,13 +642,13 @@ var GempLotrGameUI = Class.extend({
this.dialogInstance
.html(html)
.dialog("option", "buttons",
{
"OK": function() {
$(this).dialog("close");
that.decisionFunction(id, $("#multipleChoiceDecision").val());
}
}
)
{
"OK": function() {
$(this).dialog("close");
that.decisionFunction(id, $("#multipleChoiceDecision").val());
}
}
)
.dialog("option", "width", "400")
.dialog("option", "height", "auto");
@@ -966,13 +981,13 @@ var GempLotrGameUI = Class.extend({
if (this.shadowAssignGroups[characterId] == null) {
this.shadowAssignGroups[characterId] = new NormalCardGroup(this.assignmentDialog, function (card) {
return (card.zone == "SHADOW_CHARACTERS" && card.assign == characterId);
}
);
return (card.zone == "SHADOW_CHARACTERS" && card.assign == characterId);
}
);
this.freePeopleAssignGroups[characterId] = new NormalCardGroup(this.assignmentDialog, function (card) {
return (card.cardId == characterId);
}
);
return (card.cardId == characterId);
}
);
this.moveCardToElement(characterId, this.assignmentDialog);
this.assignDialogResized();