<h2>Chat</h2>
<label for="nick">Your chat nickname:</label><br />
<input type="text" name="nick" id="nick" />
<br /><br />
<label for="message">Message:</label><br />
<input type="text" name="message" id="message" maxlength="100" />
<div id="chatWindow" style="width: 100%; height: 300px; overflow: scroll; border: 1px solid grey"></div>
<br />
<script src="~/Scripts/jquery-2.0.3.min.js"></script>
<script src="~/Scripts/jquery.signalR-2.0.0.min.js"></script>
<script type="text/javascript" src="/signalr/hubs"></script>
<script>
$(function () {
// get handle to chat hub generated by SignalR
var playersHub = $.connection.playersHub;
// add method that can be called by the hub to update chat
playersHub.client.publishMessage = function (nick, msg) {
var chatWin = $("#chatWindow");
chatWin.html(chatWin.html() + "<b>" + nick + "</b>: " + msg + "<br />");
};
// start the connection with the hub
$.connection.hub.start();
$(document).keypress(function (e) {
if (e.which == 13) {
// when the 'Enter' key is pressed, send the message to hub
playersHub.server.sendMessage($("#nick").val(), $("#message").val());
$("#message").val("");
}
});
});
</script>
