diff --git a/chat.js b/chat.js
index 416a558f7..b6ae5a7e7 100644
--- a/chat.js
+++ b/chat.js
@@ -141,7 +141,6 @@ xmppchat.ChatBox = Backbone.Model.extend({
});
xmppchat.ChatBoxView = Backbone.View.extend({
-
tagName: 'div',
className: 'chatbox',
@@ -150,6 +149,12 @@ xmppchat.ChatBoxView = Backbone.View.extend({
'keypress textarea.chat-textarea': 'keyPressed'
},
+ message_template: _.template(
+ '
'),
+
appendMessage: function (message) {
var time,
now = new Date(),
@@ -161,17 +166,19 @@ xmppchat.ChatBoxView = Backbone.View.extend({
list = message.match(/\b(http:\/\/www\.\S+\.\w+|www\.\S+\.\w+|http:\/\/(?=[^w]){3}\S+[\.:]\S+)[^ ]+\b/g);
if (list) {
for (i = 0; i < list.length; i++) {
- message = message.replace( list[i], ""+ list[i] + "" );
+ message = message.replace(list[i], ""+ list[i] + "" );
}
}
if (minutes.length==1) {minutes = '0'+minutes;}
time = now.toLocaleTimeString().substring(0,5);
$chat_content = $(this.el).find('.chat-content');
- $chat_content.append(
- '' +
- ''+time+' me: ' +
- ''+message+'' +
- '
');
+ $chat_content.append(this.message_template({
+ 'sender': 'me',
+ 'time': time,
+ 'message': message,
+ 'username': 'me',
+ 'extra_classes': ''
+ }));
$chat_content.scrollTop($chat_content[0].scrollHeight);
},
@@ -184,47 +191,77 @@ xmppchat.ChatBoxView = Backbone.View.extend({
var body = $(message).children('body').text(),
jid = $(message).attr('from'),
composing = $(message).find('composing'),
- div = $(''),
$chat_content = $(this.el).find('.chat-content'),
user_id = Strophe.getNodeFromJid(jid);
if (!body) {
if (composing.length > 0) {
- message_html = div.addClass('chat-event').text(user_id+ ' is typing...');
- $chat_content.find('div.chat-event').remove().end().append(message_html);
+ $chat_content.find('div.chat-event').remove().end()
+ .append($('').text(user_id+ ' is typing...'));
}
} else {
// TODO: ClientStorage
xmppchat.Messages.ClientStorage.addMessage(jid, body, 'from');
if (xmppchat.xmppstatus.getOwnStatus() === 'offline') {
+ // only update the UI if the user is not offline
return;
}
- // only update the UI if the user is not offline
- var time = (new Date()).toLocaleTimeString().substring(0,5),
- text = body.replace(/
/g, "");
-
- div.addClass('chat-message');
- if (($(message).find('delay').length > 0)) {
- div.addClass('delayed');
- }
$chat_content.find('div.chat-event').remove();
- message_html = div.append(
- ''+time+' '+user_id+': ' +
- ''+text+''
- );
- $chat_content.append(message_html);
- // FIXME:
+ $chat_content.append(
+ this.message_template({
+ 'sender': 'them',
+ 'time': (new Date()).toLocaleTimeString().substring(0,5),
+ 'message': body.replace(/
/g, ""),
+ 'username': user_id,
+ 'extra_classes': ($(message).find('delay').length > 0) && 'delayed' || ''
+ }));
+
+ // TODO:
// xmppchat.UI.msg_counter += 1;
// xmppchat.UI.updateMsgCounter();
}
$chat_content.scrollTop($chat_content[0].scrollHeight);
},
+ insertClientStoredMessages: function () {
+ var that = this;
+ xmppchat.Messages.getMessages(this.model.get('jid'), function (msgs) {
+ var $content = that.$el.find('.chat-content');
+ for (var i=0; i<_.size(msgs); i++) {
+ var msg = msgs[i],
+ msg_array = msg.split(' ', 2),
+ date = msg_array[0];
+
+ if (msg_array[1] == 'to') {
+ $content.append(
+ that.message_template({
+ 'sender': 'me',
+ 'time': new Date(Date.parse(date)).toLocaleTimeString().substring(0,5),
+ 'message': String(msg).replace(/(.*?\s.*?\s)/, ''),
+ 'username': 'me',
+ 'extra_classes': 'delayed'
+ }));
+ } else {
+ $content.append(
+ that.message_template({
+ 'sender': 'them',
+ 'time': new Date(Date.parse(date)).toLocaleTimeString().substring(0,5),
+ 'message': String(msg).replace(/(.*?\s.*?\s)/, ''),
+ 'username': that.model.get('user_id'),
+ 'extra_classes': 'delayed'
+ }));
+ }
+ }
+ });
+ },
+
sendMessage: function (text) {
+ // TODO: Also send message to all my own connected resources, so that
+ // they can display it as well....
+
// TODO: Look in ChatPartners to see what resources we have for the recipient.
// if we have one resource, we sent to only that resources, if we have multiple
// we send to the bare jid.
- // FIXME: see if @@content-transform is required
var bare_jid = this.model.get('jid');
var message = $msg({to: bare_jid, type: 'chat'})
.c('body').t(text).up()
@@ -330,6 +367,7 @@ xmppchat.ChatBoxView = Backbone.View.extend({
render: function () {
$(this.el).attr('id', this.model.get('chat_id'));
$(this.el).html(this.template(this.model.toJSON()));
+ this.insertClientStoredMessages();
return this;
},
@@ -348,8 +386,12 @@ xmppchat.ChatBoxView = Backbone.View.extend({
that.focus();
});
return this;
- }
+ },
+ scrolldown: function () {
+ var $content = this.$el.find('.chat-content');
+ $content.scrollTop($content[0].scrollHeight);
+ }
});
xmppchat.ControlBox = xmppchat.ChatBox.extend({
@@ -369,6 +411,10 @@ xmppchat.ControlBoxView = xmppchat.ChatBoxView.extend({
'click a.close-controlbox-button': 'closeChat'
},
+ initialize: function () {
+ // Override to avoid chatbox's initialization.
+ },
+
render: function () {
return this;
},
@@ -439,13 +485,11 @@ xmppchat.ChatBoxesView = Backbone.View.extend({
},
positionNewChat: function (jid) {
- //FIXME: Sort the deferred stuff out
var view = this.views[jid],
that = this,
open_chats = 0,
offset;
-
if (view.isVisible()) {
view.focus();
} else {
@@ -466,6 +510,7 @@ xmppchat.ChatBoxesView = Backbone.View.extend({
$(view.el).css({'right': (offset+'px')});
$(view.el).show('fast', function () {
view.el.focus();
+ view.scrolldown();
});
}
view.addChatToCookie();
diff --git a/chatui.js b/chatui.js
index cbe362e70..4c0724ca5 100644
--- a/chatui.js
+++ b/chatui.js
@@ -2,11 +2,6 @@ xmppchat.UI = (function (xmppUI, $, console) {
var ob = xmppUI;
ob.chats = [];
ob.chat_focus = [];
- ob.chatbox_width = 205;
-
- ob.sanitizePath = function (call) {
- return xmppchat.base_url + call;
- };
ob.addUserToRosterUI = function (user_id, bare_jid, fullname, userstatus) {};
@@ -108,47 +103,8 @@ xmppchat.UI = (function (xmppUI, $, console) {
});
};
- ob.insertClientStoredMessages = function ($chat, bare_jid, recipient_name) {
- xmppchat.Messages.getMessages(bare_jid, function (msgs) {
- $(msgs).each(function (idx, msg) {
- var msg_array = msg.split(' ', 2),
- date = msg_array[0],
- time = new Date(Date.parse(date)).toLocaleTimeString().substring(0,5),
- direction = msg_array[1],
- text = String(msg).replace(/(.*?\s.*?\s)/, '');
- $content = $chat.find('.chat-content');
- div = $('');
-
- if (direction == 'to') {
- message_html = div.append(
- ''+time+' me: ' +
- ''+text+''
- );
- } else {
- message_html = div.append(
- ''+time+' '+recipient_name+': ' +
- ''+text+''
- );
- }
- $content.append(message_html);
- $content.scrollTop($content[0].scrollHeight);
- });
- });
- };
-
+ ob.insertClientStoredMessages = function ($chat, bare_jid, recipient_name) {};
ob.createChatbox = function (bare_jid, callback) {};
- /*
- $chat.find('.chat-message .time').each(function () {
- var jthis = $(this);
- var time = jthis.text().split(':');
- var hour = time[0];
- var minutes = time[1];
- var date = new Date();
- date.setHours(hour - date.getTimezoneOffset() / 60);
- date.setMinutes(minutes);
- jthis.replaceWith(date.toLocaleTimeString().substring(0,5));
- });
- */
ob.prepNewChat = function (chat, jid) {
// Some operations that need to be applied on a chatbox
@@ -173,56 +129,8 @@ xmppchat.UI = (function (xmppUI, $, console) {
this.addChatToCookie(jid);
};
- ob.getChatbox = function (jid, callback) {
- // Get a chatbox. Either it exists, then just ensure
- // that it's visible and return it. Otherwise, create it.
- //
- // This method can be deferred.
- // http://www.erichynds.com/jquery/using-deferreds-in-jquery/
- var bare_jid = Strophe.getBareJidFromJid(jid),
- chat_content,
- chat_id = helpers.hash(bare_jid),
- $chat = $("#"+chat_id),
- that = this,
- dfd = $.Deferred();
-
- if (callback === undefined) {
- callback = function () {};
- }
- if ($chat.length > 0) {
- if ($chat.is(':visible')) {
- callback($chat);
- dfd.resolve();
- } else {
- // The chatbox exists, merely hidden
- $chat.show('fast', function () {
- that.prepNewChat(this, bare_jid);
- that.reorderChats();
- callback(this);
- dfd.resolve();
- });
- }
- } else {
- this.createChatbox(bare_jid, function ($chat) {
- // that.retrieveCollections();
- that.positionNewChat($chat);
- $chat.show('fast', function () {
- that.prepNewChat(this, bare_jid);
- that.handleChatEvents(chat_id);
- callback(this);
- dfd.resolve();
- // FIXME: We need to check here whether local or remote storage
- // must be used. For now we just use local storage.
- // ob.insertCollectionMessages
- that.insertClientStoredMessages($chat, bare_jid, $chat.find('.chat-title').text());
- });
- });
- }
- return dfd.promise();
- };
-
+ ob.getChatbox = function (jid, callback) {};
ob.reorderChats = function () {};
-
ob.addChatToCookie = function (jid) {};
return ob;