Save the chat content area on the view.
To reduce $.find queries.
This commit is contained in:
JC Brand
parent
1a7a5e8054
commit
6bd0037cbb
72
converse.js
72
converse.js
@ -1269,8 +1269,9 @@
|
||||
)
|
||||
)
|
||||
);
|
||||
this.$content = this.$el.find('.chat-content');
|
||||
this.renderToolbar().renderAvatar();
|
||||
this.$el.find('.chat-content').on('scroll', _.debounce(this.onScroll.bind(this), 100));
|
||||
this.$content.on('scroll', _.debounce(this.onScroll.bind(this), 100));
|
||||
converse.emit('chatBoxOpened', this);
|
||||
setTimeout(converse.refreshWebkit, 50);
|
||||
return this.showStatusMessage();
|
||||
@ -1281,7 +1282,7 @@
|
||||
if ($(ev.target).scrollTop() === 0) {
|
||||
oldest = this.model.messages.where({'time': this.model.messages.pluck('time').sort()[0]});
|
||||
if (oldest) {
|
||||
this.$el.find('.chat-content').prepend('<span class="spinner"/>');
|
||||
this.$content.prepend('<span class="spinner"/>');
|
||||
this.fetchArchivedMessages({
|
||||
'before': oldest[0].get('archive_id'),
|
||||
'with': this.model.get('jid'),
|
||||
@ -1368,11 +1369,10 @@
|
||||
},
|
||||
|
||||
showStatusNotification: function (message, keep_old) {
|
||||
var $chat_content = this.$el.find('.chat-content');
|
||||
if (!keep_old) {
|
||||
$chat_content.find('div.chat-event').remove();
|
||||
this.$content.find('div.chat-event').remove();
|
||||
}
|
||||
$chat_content.append($('<div class="chat-event"></div>').text(message));
|
||||
this.$content.append($('<div class="chat-event"></div>').text(message));
|
||||
this.scrollDown();
|
||||
},
|
||||
|
||||
@ -1380,27 +1380,25 @@
|
||||
if (typeof ev !== "undefined") { ev.stopPropagation(); }
|
||||
var result = confirm(__("Are you sure you want to clear the messages from this room?"));
|
||||
if (result === true) {
|
||||
this.$el.find('.chat-content').empty();
|
||||
this.$content.empty();
|
||||
}
|
||||
return this;
|
||||
},
|
||||
|
||||
clearSpinner: function () {
|
||||
var $content = this.$el.find('.chat-content');
|
||||
if ($content.children(':first').is('span.spinner')) {
|
||||
$content.children(':first').first().remove();
|
||||
if (this.$content.children(':first').is('span.spinner')) {
|
||||
this.$content.children(':first').first().remove();
|
||||
}
|
||||
},
|
||||
|
||||
showMessage: function (msg_dict) {
|
||||
var $content = this.$el.find('.chat-content'),
|
||||
msg_time = moment(msg_dict.time) || moment,
|
||||
var msg_time = moment(msg_dict.time) || moment,
|
||||
text = msg_dict.message,
|
||||
match = text.match(/^\/(.*?)(?: (.*))?$/),
|
||||
fullname = this.model.get('fullname') || msg_dict.fullname,
|
||||
extra_classes = msg_dict.delayed && 'delayed' || '',
|
||||
num_messages = this.model.messages.length,
|
||||
has_scrollbar = $content.get(0).scrollHeight > $content[0].clientHeight,
|
||||
has_scrollbar = this.$content.get(0).scrollHeight > this.$content[0].clientHeight,
|
||||
template, username, insertMessage;
|
||||
|
||||
// FIXME: A better approach here is probably to look at what is
|
||||
@ -1412,12 +1410,12 @@
|
||||
insertMessage = _.compose(
|
||||
this.scrollDownMessageHeight.bind(this),
|
||||
function ($el) {
|
||||
$content.prepend($el);
|
||||
this.$content.prepend($el);
|
||||
return $el;
|
||||
}
|
||||
}.bind(this)
|
||||
);
|
||||
} else {
|
||||
insertMessage = _.compose(_.debounce(this.scrollDown.bind(this), 50), $content.append.bind($content));
|
||||
insertMessage = _.compose(_.debounce(this.scrollDown.bind(this), 50), this.$content.append.bind(this.$content));
|
||||
}
|
||||
if ((match) && (match[1] === 'me')) {
|
||||
text = text.replace(/^\/me/, '');
|
||||
@ -1427,7 +1425,7 @@
|
||||
template = converse.templates.message;
|
||||
username = msg_dict.sender === 'me' && __('me') || fullname;
|
||||
}
|
||||
$content.find('div.chat-event').remove();
|
||||
this.$content.find('div.chat-event').remove();
|
||||
|
||||
if (this.is_chatroom && msg_dict.sender == 'them' && (new RegExp("\\b"+this.model.get('nick')+"\\b")).test(text)) {
|
||||
// Add special class to mark groupchat messages in which we
|
||||
@ -1450,15 +1448,14 @@
|
||||
},
|
||||
|
||||
showHelpMessages: function (msgs, type, spinner) {
|
||||
var $chat_content = this.$el.find('.chat-content'), i,
|
||||
msgs_length = msgs.length;
|
||||
var i, msgs_length = msgs.length;
|
||||
for (i=0; i<msgs_length; i++) {
|
||||
$chat_content.append($('<div class="chat-'+(type||'info')+'">'+msgs[i]+'</div>'));
|
||||
this.$content.append($('<div class="chat-'+(type||'info')+'">'+msgs[i]+'</div>'));
|
||||
}
|
||||
if (spinner === true) {
|
||||
$chat_content.append('<span class="spinner"/>');
|
||||
this.$content.append('<span class="spinner"/>');
|
||||
} else if (spinner === false) {
|
||||
$chat_content.find('span.spinner').remove();
|
||||
this.$content.find('span.spinner').remove();
|
||||
}
|
||||
return this.scrollDown();
|
||||
},
|
||||
@ -1476,7 +1473,7 @@
|
||||
prev_date = moment(previous_message.get('time'));
|
||||
if (prev_date.isBefore(time, 'day')) {
|
||||
this_date = moment(time);
|
||||
this.$el.find('.chat-content').append(converse.templates.new_day({
|
||||
this.$content.append(converse.templates.new_day({
|
||||
isodate: this_date.format("YYYY-MM-DD"),
|
||||
datestring: this_date.format("dddd MMM Do YYYY")
|
||||
}));
|
||||
@ -1490,7 +1487,7 @@
|
||||
this.showStatusNotification(message.get('fullname')+' '+__('has stopped typing'));
|
||||
return;
|
||||
} else if (_.contains([INACTIVE, ACTIVE], message.get('chat_state'))) {
|
||||
this.$el.find('.chat-content div.chat-event').remove();
|
||||
this.$content.find('div.chat-event').remove();
|
||||
return;
|
||||
} else if (message.get('chat_state') === GONE) {
|
||||
this.showStatusNotification(message.get('fullname')+' '+__('has gone away'));
|
||||
@ -1673,7 +1670,7 @@
|
||||
if (ev && ev.preventDefault) { ev.preventDefault(); }
|
||||
var result = confirm(__("Are you sure you want to clear the messages from this chat box?"));
|
||||
if (result === true) {
|
||||
this.$el.find('.chat-content').empty();
|
||||
this.$content.empty();
|
||||
this.model.messages.reset();
|
||||
this.model.messages.browserStorage._clear();
|
||||
}
|
||||
@ -1985,17 +1982,15 @@
|
||||
},
|
||||
|
||||
scrollDownMessageHeight: function ($message) {
|
||||
var $content = this.$('.chat-content');
|
||||
if ($content.is(':visible')) {
|
||||
$content.scrollTop($content.scrollTop() + $message[0].scrollHeight);
|
||||
if (this.$content.is(':visible')) {
|
||||
this.$content.scrollTop(this.$content.scrollTop() + $message[0].scrollHeight);
|
||||
}
|
||||
return this;
|
||||
},
|
||||
|
||||
scrollDown: function () {
|
||||
var $content = this.$('.chat-content');
|
||||
if ($content.is(':visible')) {
|
||||
$content.scrollTop($content[0].scrollHeight);
|
||||
if (this.$content.is(':visible')) {
|
||||
this.$content.scrollTop(this.$content[0].scrollHeight);
|
||||
}
|
||||
return this;
|
||||
}
|
||||
@ -2749,6 +2744,7 @@
|
||||
}))
|
||||
.append(this.occupantsview.render().$el);
|
||||
this.renderToolbar();
|
||||
this.$content = this.$el.find('.chat-content');
|
||||
}
|
||||
// XXX: This is a bit of a hack, to make sure that the
|
||||
// sidebar's state is remembered.
|
||||
@ -2767,16 +2763,12 @@
|
||||
this.model.save({hidden_occupants: true});
|
||||
$el.removeClass('icon-hide-users').addClass('icon-show-users');
|
||||
this.$('form.sendXMPPMessage, .chat-area').animate({width: '100%'});
|
||||
this.$('div.participants').animate({width: 0}, function () {
|
||||
this.scrollDown();
|
||||
}.bind(this));
|
||||
this.$('div.participants').animate({width: 0}, this.scrollDown.bind(this));
|
||||
} else {
|
||||
this.model.save({hidden_occupants: false});
|
||||
$el.removeClass('icon-show-users').addClass('icon-hide-users');
|
||||
this.$('.chat-area, form.sendXMPPMessage').css({width: ''});
|
||||
this.$('div.participants').show().animate({width: 'auto'}, function () {
|
||||
this.scrollDown();
|
||||
}.bind(this));
|
||||
this.$('div.participants').show().animate({width: 'auto'}, this.scrollDown.bind(this));
|
||||
}
|
||||
},
|
||||
|
||||
@ -3213,8 +3205,7 @@
|
||||
* Allow user to configure chat room if they are the owner.
|
||||
* See: http://xmpp.org/registrar/mucstatus.html
|
||||
*/
|
||||
var $chat_content,
|
||||
disconnect_msgs = [],
|
||||
var disconnect_msgs = [],
|
||||
msgs = [],
|
||||
reasons = [];
|
||||
$el.find('x[xmlns="'+Strophe.NS.MUC_USER+'"]').each(function (idx, x) {
|
||||
@ -3258,9 +3249,8 @@
|
||||
this.model.set('connection_status', Strophe.Status.DISCONNECTED);
|
||||
return;
|
||||
}
|
||||
$chat_content = this.$el.find('.chat-content');
|
||||
for (i=0; i<msgs.length; i++) {
|
||||
$chat_content.append(converse.templates.info({message: msgs[i]}));
|
||||
this.$content.append(converse.templates.info({message: msgs[i]}));
|
||||
}
|
||||
for (i=0; i<reasons.length; i++) {
|
||||
this.showStatusNotification(__('The reason given is: "'+reasons[i]+'"'), true);
|
||||
@ -3337,7 +3327,7 @@
|
||||
this.$el.find('.chatroom-topic').text(subject).attr('title', subject);
|
||||
// # For translators: the %1$s and %2$s parts will get replaced by the user and topic text respectively
|
||||
// # Example: Topic set by JC Brand to: Hello World!
|
||||
this.$el.find('.chat-content').append(
|
||||
this.$content.append(
|
||||
converse.templates.info({
|
||||
'message': __('Topic set by %1$s to: %2$s', sender, subject)
|
||||
}));
|
||||
|
||||
Loading…
Reference in New Issue
Block a user