]> git.babelmonkeys.de Git - xmppchat.git/commitdiff
projects / xmppchat.git / commitdiff
? search:
summary | shortlog | log | commit | commitdiff | tree
raw | patch | inline | side by side (initial)
Initial commit
authorFlorian Zeitz <florob@babelmonkeys.de>
Sun, 1 Jun 2008 14:41:51 +0000 (16:41 +0200)
committerFlorian Zeitz <florob@babelmonkeys.de>
Sun, 1 Jun 2008 18:02:06 +0000 (20:02 +0200)
.gitignore [new file with mode: 0644] patch | blob
index.html [new file with mode: 0644] patch | blob
main.js [new file with mode: 0644] patch | blob
style.css [new file with mode: 0644] patch | blob

diff --git a/.gitignore b/.gitignore
new file mode 100644 (file)
index 0000000..d054878
--- /dev/null
+++ b/.gitignore
@@ -0,0 +1 @@
+jsjac*
diff --git a/index.html b/index.html
new file mode 100644 (file)
index 0000000..3069d5f
--- /dev/null
+++ b/index.html
@@ -0,0 +1,37 @@
+<?xml version="1.0" encoding="utf-8" ?>
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
+       "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+<head>
+<title>XMPP Chat</title>
+<link rel="stylesheet" type="text/css" href="style.css" />
+<meta http-equiv="Content-Type" content="application/xhtml+xml; charset=utf-8" />
+<script type="text/javascript" src="jsjac-1.3/jsjac.js"></script>
+<script type="text/javascript" src="main.js"></script> 
+</head>
+<body>
+
+<div id="login">
+  <form id="loginForm" onsubmit="return doLogin(this);" action="#">
+    Nickname:
+    <input type="text" name="nickname" id="nickname" />
+    <input type="submit" value="Join" />
+  </form>
+</div>
+
+<div id="chat"></div>
+
+<div id="roster">
+  <ul id="roster_list">
+  </ul>
+</div>
+
+<div id="entry">
+  <form id="textForm" onsubmit="return sendMessage(this);" action="#">
+    <input type="text" name="text" id ="text" />
+    <input type="submit" id="text_submit" value="Senden"/>
+  </form>
+</div>
+
+</body>
+</html>
diff --git a/main.js b/main.js
new file mode 100644 (file)
index 0000000..f1f878a
--- /dev/null
+++ b/main.js
@@ -0,0 +1,161 @@
+function doLogin(aForm) {
+       room = 'guests@conference.babelmonkeys.de';
+       if (!aForm.nickname.value)
+               return false;
+       try {
+               oArgs = new Object();
+               oArgs.httpbase = '/http-bind/';
+               oArgs.timerval = 2000;
+               con = new JSJaCHttpBindingConnection(oArgs)
+
+               nickname = aForm.nickname.value;
+               setupHandlers(con);
+               
+               oArgs = new Object();
+               oArgs.domain = 'babelmonkeys.de';
+               oArgs.username = 'muckl';
+               oArgs.resource = randomString();
+               oArgs.pass = 'ooje0OjuJeekaek6';
+               con.connect(oArgs);
+       } catch (e) {
+               alert(e);
+       } finally {
+               return false;   
+       }
+}
+
+function setupHandlers(con) {
+       con.registerHandler('message', handleMessage);
+       con.registerHandler('presence', handlePresence);
+       con.registerHandler('iq', handleIQ);
+       con.registerHandler('onconnect', handleConnected);
+       con.registerHandler('onerror', handleError);
+       // con.registerHandler('status_changed', handleStatusChanged);
+       con.registerHandler('ondisconnect', handleDisconnected);
+
+       con.registerIQGet('query', NS_VERSION, handleIqVersion);
+       con.registerIQGet('query', NS_TIME, handleIqTime);
+}
+
+function handleConnected() {
+       con.send(new JSJaCPresence());
+       GCpresence = new JSJaCPresence();
+       GCpresence.setTo(room + '/' + nickname);
+       con.send(GCpresence);
+
+       // Make things (in)visible
+       document.getElementById('login').style.display = 'none';
+       document.getElementById('chat').style.display = 'block';
+       document.getElementById('roster').style.display = 'block';
+       document.getElementById('entry').style.display  = 'block';
+}
+
+function handleError(e) {
+       alert("An error occured:" + 
+               "\nCode: " + e.getAttribute('code') + 
+               "\nType: " + e.getAttribute('type') +
+               "\nCondition: " + e.firstChild.nodeName); 
+       // Make things (in)visible
+       document.getElementById('login').style.display = 'block';
+       document.getElementById('chat').style.display = 'none';
+       document.getElementById('roster').style.display = 'none';
+       document.getElementById('entry').style.display  = 'none';
+
+  
+       if (con.connected())
+               con.disconnect();
+}
+
+function handleDisconnected() {
+       // Make things (in)visible
+       document.getElementById('login').style.display = 'block';
+       document.getElementById('chat').style.display = 'none';
+       document.getElementById('roster').style.display = 'none';
+       document.getElementById('entry').style.display  = 'none';
+}
+
+function handleMessage(aJSJaCPacket) {
+       var html = '';
+       html += '<div class="msg">';
+       if (aJSJaCPacket.getFromJID().getResource()) {
+               html += '<span class="sender">';
+               html += aJSJaCPacket.getFromJID().getResource();
+               html += ':</span> ';
+               html += aJSJaCPacket.getBody().htmlEnc() + '</div>';
+       } else {
+               html += '<span class="server">';
+               html += aJSJaCPacket.getBody().htmlEnc() + '</span></div>';
+       }
+
+       document.getElementById('chat').innerHTML += html;
+       document.getElementById('chat').lastChild.scrollIntoView();
+}
+
+function handlePresence(aJSJaCPacket) {
+       if (aJSJaCPacket.getFromJID().toString().split('/')[0] != room)
+               return
+       roster_list = document.getElementById('roster_list');
+       nick = aJSJaCPacket.getFromJID().getResource();
+       if (aJSJaCPacket.getType() == 'unavailable') {
+               element = document.getElementById(nick);
+               roster_list.removeChild(element);
+       } else {
+               roster_list.innerHTML += '<li id="' + nick + '">' + nick + '</li>';
+       }
+}
+
+function handleIQ(iq) {
+       con.send(iq.errorReply(ERR_FEATURE_NOT_IMPLEMENTED));
+}
+
+function handleIqVersion(iq) {
+       con.send(iq.reply([
+                     iq.buildNode('name', 'jsjacChatClient'),
+                     iq.buildNode('version', JSJaC.Version),
+                     iq.buildNode('os', navigator.userAgent)
+                     ]));
+       return true;
+}
+
+function handleIqTime(iq) {
+       var now = new Date();
+       con.send(iq.reply([iq.buildNode('display',
+                                  now.toLocaleString()),
+                     iq.buildNode('utc',
+                                  now.jabberDate()),
+                     iq.buildNode('tz',
+                                  now.toLocaleString().substring(now.toLocaleString().lastIndexOf(' ')+1))
+                     ]));
+       return true;
+}
+
+function sendMessage(aForm) {
+       if (aForm.text.value) {
+               message = new JSJaCMessage();
+               message.setBody(aForm.text.value);
+               message.setType('groupchat');
+               message.setTo(room);
+               con.send(message);
+               aForm.text.value = '';
+       }
+       return false;
+}
+
+function randomString() {
+       var chars = "0123456789ABCDEFGHIJKLMNOPQRSTUVWXTZabcdefghiklmnopqrstuvwxyz";
+       var string_length = 20;
+       var randomstring = '';
+       for (var i=0; i<string_length; i++) {
+               var rnum = Math.floor(Math.random() * chars.length);
+               randomstring += chars.substring(rnum,rnum+1);
+       }
+       return randomstring;
+}
+
+
+
+onunload = function() {
+       if (con.connected())
+               con.disconnect();
+}
+
diff --git a/style.css b/style.css
new file mode 100644 (file)
index 0000000..6f77278
--- /dev/null
+++ b/style.css
@@ -0,0 +1,78 @@
+* {
+       margin: 0px;
+       padding: 0px;
+}
+
+html, body {
+       height: 100%;
+       width: 100%;
+}
+
+#login {
+       width: 20em;
+       padding: 20px;
+       border: 3px dashed;
+       background: lightgrey;
+       text-align: center;
+       position: relative;
+       margin: auto;
+       margin-top: 5em;
+}
+
+#roster {
+       display: none;
+       border: 1px solid;
+       position: fixed;
+       right: 0px;
+       top: 5em;
+       width: 10%;
+       padding: 5px;
+}
+
+#roster ul {
+       padding: 0px;
+}
+
+#roster li {
+       margin: 5px;
+       list-style-position: inside;
+}
+
+#chat {
+       display: none;
+       margin-right: 10%;
+       padding-right: 1em;
+       padding-bottom: 3em;
+}
+
+#entry {
+       display: none;
+       width: 100%;
+       height: 2em;
+       position: fixed;
+       bottom: 0px;
+       left: 0px;
+       right: 0px;
+       background: white;
+       margin-top: 1em;
+       border-top: 1px solid;
+       clear: both;
+}
+
+#text_submit {
+       width: 10%;
+       position: absolute;
+       right: 2em;
+}
+
+#text {
+       width: 80%;
+}
+
+.sender {
+       font-weight: bold;
+}
+
+.server {
+       color: green;
+}
A simple XMPP webchat