<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<title>IRC7 WebChat</title>
</head>
<body>
<div id="wrapper">
<div id="Login">
<h1>IRC7 Client Login Form</h1>
Nickname:<input id="chatNickname" type="text" />
Chatroom:<input id="chatRoom" type="text" />
<button onclick="OpenSocket()" id="Connect">Join</button>
</div> <!-- #Login -->
<div id="ChatContainer" style="visibility: hidden">
<h1>IRC7 Client</h1>
<div id="Chatlog">
</div><!-- #chatLog -->
<input id="ChatTextBox" type="text" size="200" onkeypress="{if (event.keyCode==13)SsendMsg()}" />
</div><!-- #container -->
</div>
</body>
</html>
<script type="text/javascript">
function OpenSocket()
{
if ("WebSocket" in window)
{
var websocket = new WebSocket("ws://99.103.172.48:7000/");
// webSocket is supported lets open a socket to irc7
websocket.onopen = function()
{
// connected to irc7 , lets send info back and forth
if (websocket.readyState == 1) {
swapButtons(false);
var txtData = document.getElementById('chatNickname');
var txt = txtData.value;
var cTxtData = document.getElementById('chatRoom');
var ctxt = cTxtData.value;
websocket.send(ctxt);
}
};
websocket.onmessage = function (Message)
{
var recieved_msg = Message.data;
//alert(recieved_msg);
msg('<p class="message">Received: '+recieved_msg)
// $('#chatLog').append(recieved_msg+'</p>');
//do stuff with message
};
websocket.onclose = function()
{
// websocket is closed.
alert("Connection is closed...");
$("#Chatlog").empty();
swapButtons(true);
};
}
else
{
// the browser doesnt support WebSocket
alert("WebSocket unsupported by this browser!");
}
}
function msg(Message){
$('#Chatlog').append(Message+'</p>');
};
function swapButtons(show1) {
document.getElementById('Login').style.visibility = show1 ? 'visible' : 'hidden';
document.getElementById('ChatContainer').style.visibility = show1 ? 'hidden' : 'visible';
};

function SsendMsg() {
websocket.send("h");
};
</script>
</html>