<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Aristochat</title>
<link href="chat.css" media="screen" rel="stylesheet" type="text/css" />
<script type='text/javascript'>
//
// SETTINGS
//
// BOSH URL of your XMPP server.
var BOSH_SERVICE = 'http://localhost:4000/http-bind/'
// MUC compoenent JID
var MUC_COMPONENT = "conference.localhost";
// Room Name
var MUC_ROOM = "testing";
// Useful if you need to debug : content will be shown in the "log" div (which has a CSS display:none property)
var DEBUG = true;
// END OF SETTINGS
</script>
<script language='javascript' type='text/javascript' src='jquery-1-1.3.2.js'></script>
<script language='javascript' type='text/javascript' src='strophejs/src/b64.js'></script>
<script language='javascript' type='text/javascript' src='strophejs/src/md5.js'></script>
<script language='javascript' type='text/javascript' src='strophejs/src/sha1.js'></script>
<script language='javascript' type='text/javascript' src='strophejs/src/strophe.js'></script>
<script language='javascript' type='text/javascript' src='chat.js'></script>
</head>
<div id="content">
<div id="sidechat">
<h2>Chatroom</h2>
<div id='login'>
<p>
<label for='user'>JID:</label><br />
<input type='text' id='jid' value="guest" />
</p>
<p>
<label for='pass'>Password:</label><br />
<input type='password' id='pass' value="superfeedr" />
</p>
<p>
<label for='user'>Nick</label> <small>(Optional)</small><br />
<input type='text' id='nick' />
</p>
</div>
<input type='button' id='connect' value='Connect' />
<div id="roster">
<h2>Who is online</h2>
<ul id="users">
</ul>
</div>
<p>
<img id="loader" src="ajax-loader.gif" style="display:none;"><br />
<span><strong>Status:</strong> <small id="status">Disconnected</small></span>
</p>
</div>
<div id="chatroom">
<h1>Welcome</h1>
<p>
This is a simple <a href="http://xmpp.org/extensions/xep-0045.html">Multi User Chat</a> web-based application. Connect with your JID and password.
</p>
<p>
You can as well use your favorite XMPP/Jabber client.
</p>
<p>
<a href="http://github.com/superfeedr/aristochat/tree/master">Aristochat</a> is Open Source, fork it on Github.
</p>
<table id="chat">
</table>
</div>
<div id="publish">
<textarea id='message_input'></textarea>
<input type='button' id='post' disabled='disabled' value='Send Message' />
<small><i>All messages will be logged</i></small>
</div>
<div id='log' style="display:none;"></div>
</body>
</html>