Busy rewriting the javascript to use backbone.js
This commit is contained in:
parent
be5a8b3c40
commit
d82e72613a
194
chat.js
194
chat.js
|
@ -19,6 +19,7 @@ var helpers = (function (helpers) {
|
||||||
return helpers;
|
return helpers;
|
||||||
})(helpers || {});
|
})(helpers || {});
|
||||||
|
|
||||||
|
|
||||||
var xmppchat = (function (jarnxmpp, $, console) {
|
var xmppchat = (function (jarnxmpp, $, console) {
|
||||||
var ob = jarnxmpp;
|
var ob = jarnxmpp;
|
||||||
/* FIXME: XEP-0136 specifies 'urn:xmpp:archive' but the mod_archive_odbc
|
/* FIXME: XEP-0136 specifies 'urn:xmpp:archive' but the mod_archive_odbc
|
||||||
|
@ -293,52 +294,185 @@ var xmppchat = (function (jarnxmpp, $, console) {
|
||||||
return ob;
|
return ob;
|
||||||
})(jarnxmpp || {}, jQuery, console || {log: function(){}});
|
})(jarnxmpp || {}, jQuery, console || {log: function(){}});
|
||||||
|
|
||||||
xmppchat.Roster = (function (roster, jquery, console) {
|
|
||||||
|
xmppchat.RosterItem = Backbone.Model.extend({
|
||||||
|
/*
|
||||||
|
* RosterItem: {
|
||||||
|
* 'status': String,
|
||||||
|
* 'subscription': String,
|
||||||
|
* 'resources': Array,
|
||||||
|
* 'fullname': String
|
||||||
|
* }
|
||||||
|
*/
|
||||||
|
initialize: function (jid, subscription) {
|
||||||
|
this.id = jid;
|
||||||
|
this.subscription = subscription;
|
||||||
|
|
||||||
|
this.fullname = '';
|
||||||
|
this.resources = [];
|
||||||
|
this.status = 'offline';
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
xmppchat.RosterClass = (function (stropheRoster, _, $, console) {
|
||||||
var contacts = {},
|
var contacts = {},
|
||||||
ob = roster;
|
ob = _.clone(stropheRoster);
|
||||||
|
|
||||||
_updateCache = function () {
|
var Collection = Backbone.Collection.extend({
|
||||||
if (this.subscription === 'none') {
|
model: xmppchat.RosterItem
|
||||||
delete contacts[this.jid];
|
});
|
||||||
} else {
|
var collection = new Collection();
|
||||||
contacts[this.jid] = this;
|
_.extend(ob, collection);
|
||||||
|
_.extend(ob, Backbone.Events);
|
||||||
|
stropheRoster._connection = xmppchat.connection;
|
||||||
|
|
||||||
|
ob.comparator = function (rosteritem) {
|
||||||
|
var status = rosteritem.get('status'),
|
||||||
|
rank = 4;
|
||||||
|
switch(status) {
|
||||||
|
case 'offline':
|
||||||
|
rank = 4;
|
||||||
|
break;
|
||||||
|
case 'unavailable':
|
||||||
|
rank = 3;
|
||||||
|
break;
|
||||||
|
case 'away':
|
||||||
|
rank = 2;
|
||||||
|
break;
|
||||||
|
case 'busy':
|
||||||
|
rank = 1;
|
||||||
|
break;
|
||||||
|
case 'online':
|
||||||
|
rank = 0;
|
||||||
|
break;
|
||||||
}
|
}
|
||||||
|
return rank;
|
||||||
};
|
};
|
||||||
|
|
||||||
_triggerEvent = function () {
|
ob.getRoster = function () {
|
||||||
$(document).trigger('xmppchat.roster_updated');
|
return stropheRoster.get();
|
||||||
};
|
};
|
||||||
|
|
||||||
ob._connection = xmppchat.connection;
|
ob.getItem = function (id) {
|
||||||
|
return Backbone.Collection.prototype.get.call(this, id);
|
||||||
|
};
|
||||||
|
|
||||||
ob.update = function (items, item) {
|
ob.addRosterItem = function (item) {
|
||||||
old_cache = ob.getCached();
|
var user_id = Strophe.getNodeFromJid(item.jid),
|
||||||
|
model = new xmppchat.RosterItem(item.jid, item.subscription);
|
||||||
|
ob.add(model);
|
||||||
|
/*
|
||||||
|
if (!item.name) {
|
||||||
|
// TODO: I think after a user has been added to the roster,
|
||||||
|
// his nickname needs to be calculated. This is only
|
||||||
|
// feasible if the nickname is persisted. We cannot do this
|
||||||
|
// if we have to redo this upon every page load.
|
||||||
|
xmppchat.Presence.getUserInfo(user_id, function (data) {
|
||||||
|
ob.update(item.jid, data.fullname, [], function () {
|
||||||
|
// TODO Store in the model item.
|
||||||
|
model.fullname = data.fullname;
|
||||||
|
ob.add(model);
|
||||||
|
});
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
ob.add(model);
|
||||||
|
}*/
|
||||||
|
};
|
||||||
|
|
||||||
|
ob.updateHandler = function (items) {
|
||||||
|
var model;
|
||||||
for (var i=0; i<items.length; i++) {
|
for (var i=0; i<items.length; i++) {
|
||||||
if (items[i].subscription === 'none') {
|
if (items[i].subscription === 'none') {
|
||||||
delete contacts[items[i].jid];
|
model = ob.getItem(jid);
|
||||||
|
ob.remove(model);
|
||||||
} else {
|
} else {
|
||||||
contacts[items[i].jid] = items[i];
|
if (ob.getItem(items[i].jid)) {
|
||||||
|
// Update the model
|
||||||
|
model = ob.getItem(jid);
|
||||||
|
model.subscription = item.subscription;
|
||||||
|
} else {
|
||||||
|
ob.addRosterItem(items[i]);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
console.log('update, size is: '+ _.size(contacts));
|
|
||||||
if (!_.isEqual(old_cache, ob.getCached())) {
|
|
||||||
console.log('triggering event');
|
|
||||||
$(document).trigger('xmppchat.roster_updated');
|
|
||||||
}
|
|
||||||
|
|
||||||
};
|
};
|
||||||
|
/*
|
||||||
|
addResource: function (bare_jid, resource) {
|
||||||
|
},
|
||||||
|
|
||||||
ob.getCached = function () {
|
removeResource: function (bare_jid, resource) {
|
||||||
return _.values(contacts);
|
},
|
||||||
};
|
|
||||||
|
|
||||||
ob.getCachedJids = function () {
|
removeAll: function (bare_jid) {
|
||||||
return _.keys(contacts);
|
// Remove all resources for bare_jid
|
||||||
};
|
},
|
||||||
|
|
||||||
|
getNumContacts: function () {
|
||||||
|
},
|
||||||
|
|
||||||
|
getJids: function () {
|
||||||
|
return _.keys(storage);
|
||||||
|
}*/
|
||||||
return ob;
|
return ob;
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
||||||
|
xmppchat.RosterItemView = Backbone.View.extend({
|
||||||
|
tagName: 'li',
|
||||||
|
render: function () {
|
||||||
|
var item = this.model,
|
||||||
|
jid = item.id,
|
||||||
|
bare_jid = Strophe.getBareJidFromJid(jid),
|
||||||
|
user_id = Strophe.getNodeFromJid(jid),
|
||||||
|
fullname = (item.fullname) ? item.fullname : user_id;
|
||||||
|
|
||||||
|
// FIXME: Here comes underscore templating
|
||||||
|
this.el = $('<li></li>').addClass(item.status).attr('id', 'online-users-'+user_id).attr('data-recipient', bare_jid);
|
||||||
|
this.el.append($('<a title="Click to chat with this contact"></a>').addClass('user-details-toggle').text(fullname));
|
||||||
|
this.el.append($('<a title="Click to remove this contact" href="#"></a>').addClass('remove-xmpp-contact'));
|
||||||
|
return this;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
|
||||||
|
xmppchat.RosterViewClass = (function (roster, _, $, console) {
|
||||||
|
ob = {};
|
||||||
|
var View = Backbone.View.extend({
|
||||||
|
tagName: 'ul',
|
||||||
|
el: $('#xmpp-contacts'),
|
||||||
|
model: roster,
|
||||||
|
|
||||||
|
// XXX: See if you can use the "events:" thingy here instead of
|
||||||
|
// manually registering the event subscribers below.
|
||||||
|
|
||||||
|
render: function () {
|
||||||
|
this.el.html($el.html());
|
||||||
|
return this;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
var view = new View();
|
||||||
|
_.extend(ob, view);
|
||||||
|
|
||||||
|
// Event handlers
|
||||||
|
roster.on("add", function (item) {
|
||||||
|
console.log('roster add handler called');
|
||||||
|
var view = new xmppchat.RosterItemView({
|
||||||
|
model: item
|
||||||
|
});
|
||||||
|
$(ob.el).append(view.render().el);
|
||||||
|
});
|
||||||
|
|
||||||
|
roster.on("remove", function (msg) {
|
||||||
|
console.log('roster remove handler called!!!!!');
|
||||||
|
ob.render();
|
||||||
|
});
|
||||||
|
|
||||||
|
return ob;
|
||||||
|
});
|
||||||
|
|
||||||
|
// FIXME: Need to get some convention going for naming classes and instances of
|
||||||
|
// models and views.
|
||||||
|
|
||||||
// Event handlers
|
// Event handlers
|
||||||
// --------------
|
// --------------
|
||||||
$(document).ready(function () {
|
$(document).ready(function () {
|
||||||
|
@ -357,9 +491,11 @@ $(document).ready(function () {
|
||||||
|
|
||||||
xmppchat.UI.restoreOpenChats();
|
xmppchat.UI.restoreOpenChats();
|
||||||
|
|
||||||
xmppchat.Roster = xmppchat.Roster(Strophe._connectionPlugins.roster, $, console);
|
xmppchat.Roster = xmppchat.RosterClass(Strophe._connectionPlugins.roster, _, $, console);
|
||||||
xmppchat.Roster.registerCallback(xmppchat.Roster.update);
|
xmppchat.RosterView = Backbone.View.extend(xmppchat.RosterViewClass(xmppchat.Roster, _, $, console));
|
||||||
xmppchat.Roster.get();
|
|
||||||
|
xmppchat.Roster.registerCallback(xmppchat.Roster.updateHandler);
|
||||||
|
xmppchat.Roster.getRoster();
|
||||||
xmppchat.Presence.sendPresence();
|
xmppchat.Presence.sendPresence();
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
Loading…
Reference in New Issue
Block a user