Author: ngn
Date: Thu Aug 5 21:34:42 2010
New Revision: 982793
URL: http://svn.apache.org/viewvc?rev=982793&view=rev
Log:
Example client to support receiving messages, and have a nicer UI (VYSPER-226,
VYSPER-227, VYSPER-228, by Bogdan Pistol).
Modified:
mina/vysper/trunk/server/extensions/xep0124-xep0206-bosh/src/examples/client/client.html
mina/vysper/trunk/server/extensions/xep0124-xep0206-bosh/src/examples/client/client.js
Modified:
mina/vysper/trunk/server/extensions/xep0124-xep0206-bosh/src/examples/client/client.html
URL:
http://svn.apache.org/viewvc/mina/vysper/trunk/server/extensions/xep0124-xep0206-bosh/src/examples/client/client.html?rev=982793&r1=982792&r2=982793&view=diff
==============================================================================
---
mina/vysper/trunk/server/extensions/xep0124-xep0206-bosh/src/examples/client/client.html
(original)
+++
mina/vysper/trunk/server/extensions/xep0124-xep0206-bosh/src/examples/client/client.html
Thu Aug 5 21:34:42 2010
@@ -53,26 +53,14 @@
<div id="workspace" style="display: none;">
-<div id="buttons" style="float: right;">
-<input type="button" value="Chat with JID..." id="chat" disabled="disabled"/>
-<input type="button" value="Disconnect" id="disconnect" disabled="disabled"/>
-</div>
-
-<div>
-<select size="10" style="width: 150px;" id="roster">
-</select>
-<br/>
-Roster
-</div>
+<div id="roster"></div>
-<div id="tabs">
+<div id="tabs" style="width: 50%; height: 400px; display: none;">
<ul></ul>
</div>
-<div style="position: absolute; left: 0; width: 100%; bottom: 0px;">
-<div id="logger"
- style="border: 1px solid; height: 300px; overflow: scroll; margin:
10px;">
-</div>
+<div style="position: absolute; left: 0; width: 100%; height: 30%; bottom:
0px;">
+<div id="logger" style="border: 1px solid; height: 100%; overflow: auto;"/>
</div>
</div>
Modified:
mina/vysper/trunk/server/extensions/xep0124-xep0206-bosh/src/examples/client/client.js
URL:
http://svn.apache.org/viewvc/mina/vysper/trunk/server/extensions/xep0124-xep0206-bosh/src/examples/client/client.js?rev=982793&r1=982792&r2=982793&view=diff
==============================================================================
---
mina/vysper/trunk/server/extensions/xep0124-xep0206-bosh/src/examples/client/client.js
(original)
+++
mina/vysper/trunk/server/extensions/xep0124-xep0206-bosh/src/examples/client/client.js
Thu Aug 5 21:34:42 2010
@@ -23,6 +23,8 @@ var port;
var jid;
var password;
var connection;
+var subscribeRequests = [];
+var isDisconnecting = false;
var connectionStatuses = {};
connectionStatuses[Strophe.Status.ERROR] = "ERROR";
@@ -39,8 +41,18 @@ connectionStatuses[Strophe.Status.ATTACH
window.flensed.base_path="../resources/flxhr/";
$(document).ready(function() {
- $("#disconnect").click(disconnect);
- $("#chat").click(chat);
+ $("#tabs").tabs();
+ $("#roster").dialog({
+ autoOpen: false,
+ buttons: {"Disconnect": disconnect, "Add contact...":
addContact},
+ closeOnEscape: false,
+ width: 400,
+ height: 250,
+ position: ["right", "top"],
+ title: "Roster",
+ beforeclose: function() {return isDisconnecting;}
+ });
+
$("#connect").click(function() {
$("#connect-form").hide();
$("#workspace").show();
@@ -48,6 +60,14 @@ $(document).ready(function() {
});
});
+function getSubscribeRequest(jid) {
+ for (var i = 0; i < subscribeRequests.length; i++) {
+ if (jid === subscribeRequests[i]) {
+ return i;
+ }
+ }
+ return -1;
+}
function formatTime(val) {
return val < 10 ? "0" + val : val;
@@ -93,56 +113,137 @@ function connect() {
}
function userConnected() {
- // get roster
- var iq = $iq({type: 'get'}).c('query', {xmlns: 'jabber:iq:roster'});
- log("Requesting roster", iq.toString());
- connection.sendIQ(iq, rosterReceived);
-
+ getRoster();
// handle received messages
connection.addHandler(messageReceived, null, "message", "chat");
- $("#chat, #disconnect").removeAttr("disabled");
+ // handle presence
+ connection.addHandler(presenceReceived, null, "presence");
+ isDisconnecting = false;
+ $("#roster").dialog("open");
+}
+
+function getRoster() {
+ var iq = $iq({type: 'get'}).c('query', {xmlns: 'jabber:iq:roster'});
+ log("Requesting roster", iq.toString());
+ connection.sendIQ(iq, rosterReceived);
}
function rosterReceived(iq) {
log("Received roster", Strophe.serialize(iq));
+ $("#roster").empty();
+
$(iq).find("item").each(function() {
// if a contact is still pending subscription then do not show
it in the list
if ($(this).attr('ask')) {
return true;
}
var jid = $(this).attr('jid');
- $("#roster").append("<option value='" + jid + "'>" + jid +
"</option>");
+ $("#roster").append("<div jid='" + jid2id(jid) + "'>" + jid + "
(offline)</div>");
});
+ log("Sending my presence", $pres().toString());
+ connection.send($pres());
}
function jid2id(jid) {
- return jid.replace("@", "AT").replace(/\./g, "_").replace(/\//g, "-");
+ return Strophe.getBareJidFromJid(jid).replace("@", "AT").replace(/\./g,
"_");
}
function messageReceived(msg) {
- var jid = $(message).attr("from");
+ log("Received chat message", Strophe.serialize(msg));
+ var jid = $(msg).attr("from");
+ var bareJid = Strophe.getBareJidFromJid(jid);
var id = jid2id(jid);
- if ($("#" + id).length === 0) {
- initChatArea(jid, id);
+
+ $("#tabs").show()
+
+ if ($("#chat" + id).length === 0) {
+ $("#tabs").tabs("add", "#chat" + id, bareJid);
+ $("#chat" + id).append("<div style='height: 290px;
margin-bottom: 10px; overflow: auto;'></div><input type='text' style='width:
100%;'/>");
}
- $("#tabs").tabs("select", "#" + id);
- $("#" + id + " > input").focus();
-}
+
+ if($(msg).find("> body")) {
+ $("#chat" + id + " > div").append("<p>" + $(msg).find(">
body").text() + "</p>");
+ $("#chat" + id + " > div").get(0).scrollTop = $("#chat" + id +
" > div").get(0).scrollHeight;
+ }
+
+ $("#chat" + id).data("jid", jid);
+ $("#tabs").tabs("select", "#chat" + id);
+ $("#chat" + id + " > input").focus();
-function initChatArea(jid, id) {
- $("#tabs").tabs("add", id, jid);
- $("#" + id).append("<div></div><input type='text'/>");
- $("#" + id).attr("jid", jid);
+ return true;
}
+
function disconnect() {
+ isDisconnecting = true;
+ $("#roster").dialog("close");
$("#roster").empty();
- $("#chat, #disconnect").attr("disabled", "disabled");
- log("Disconnecting...");
+
+ log("Disconnecting...");
+
+ connection.send($pres({type: "unavailable"}));
+ connection.flush();
connection.disconnect();
}
function chat() {
+}
+
+function presenceReceived(presence) {
+ log("Received presence", Strophe.serialize(presence));
+ var fromJid = $(presence).attr('from');
+ var bareFromJid = Strophe.getBareJidFromJid(fromJid);
+ var type = $(presence).attr('type');
+ var id = jid2id(fromJid);
+ if (type === "error") {
+ alert("Received presence error!");
+ } else if (type === "subscribe") {
+ if (confirm(fromJid + " wants to subscribe to your presence. Do
you allow it?")) {
+ var pres = $pres({to: fromJid, type: "subscribed"});
+ log("Allowing subscribe", pres.toString());
+ connection.send(pres);
+ if ($("#roster > div[jid=" + id + "]").length === 0) {
+ $("#roster").append("<div jid='" + id + "'>" +
bareFromJid + " (offline)</div>");
+ pres = $pres({to: fromJid, type: "subscribe"});
+ log("Requesting subscribe from " + fromJid,
pres.toString());
+ connection.send(pres);
+ }
+ } else {
+ var pres = $pres({to: fromJid, type: "unsubscribed"});
+ log("Denying subscribe", pres.toString());
+ connection.send(pres);
+ }
+ } else if (bareFromJid !== jid) {
+ $("#roster > div[jid=" + id + "]").text(bareFromJid + " (" +
(type === "unavailable" ? "offline" : "online") + ")");
+ if (getSubscribeRequest(bareFromJid) === -1) {
+ log("Sending presence", $pres().toString());
+ connection.send($pres());
+ } else {
+
subscribeRequests.splice(getSubscribeRequest(bareFromJid), 1);
+ }
+ }
+ return true;
+}
+
+function addContact() {
+ var toJid = prompt("Please type the JID of the contact you want to
add");
+ var id = jid2id(toJid);
+ if (toJid === null) {
+ return;
+ }
+ if (toJid === jid) {
+ alert("You cannot add yourself to the roster!");
+ return;
+ }
+ if ($("#roster > div[jid=" + id + "]").length > 0) {
+ alert("JID already present in the roster!");
+ return;
+ }
+ $("#roster").append("<div jid='" + jid2id(toJid) + "'>" + toJid + "
(offline)</div>");
+ subscribeRequests.push(toJid);
+ var pres = $pres({to: toJid, type: "subscribe"});
+ log("Requesting subscribe to " + toJid, pres.toString());
+ connection.send(pres);
}
\ No newline at end of file