Also show different days on chatrooms.
- Use a template to show the day's date. - Use time element for the date and datetime attr
This commit is contained in:
parent
acbcf3fd2a
commit
07a65f5b6a
@ -11,6 +11,7 @@ Changelog
|
|||||||
chat messages. [jcbrand]
|
chat messages. [jcbrand]
|
||||||
- Fixed user status handling, which wasn't 100% according to the
|
- Fixed user status handling, which wasn't 100% according to the
|
||||||
spec. [jcbrand]
|
spec. [jcbrand]
|
||||||
|
- Separate messages according to day in chats. [jcbrand]
|
||||||
|
|
||||||
|
|
||||||
0.2 (unreleased)
|
0.2 (unreleased)
|
||||||
|
@ -158,6 +158,11 @@ input.new-chatroom-name {
|
|||||||
color: #808080;
|
color: #808080;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.chat-date {
|
||||||
|
display: inline-block;
|
||||||
|
padding-top: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
div#settings,
|
div#settings,
|
||||||
div#chatrooms,
|
div#chatrooms,
|
||||||
div#login-dialog {
|
div#login-dialog {
|
||||||
|
37
converse.js
37
converse.js
@ -303,6 +303,10 @@
|
|||||||
'<span class="chat-message-content">{{message}}</span>' +
|
'<span class="chat-message-content">{{message}}</span>' +
|
||||||
'</div>'),
|
'</div>'),
|
||||||
|
|
||||||
|
new_day_template: _.template(
|
||||||
|
'<time class="chat-date" datetime="{{isodate}}">{{datestring}}</time>'
|
||||||
|
),
|
||||||
|
|
||||||
insertStatusNotification: function (message, replace) {
|
insertStatusNotification: function (message, replace) {
|
||||||
var $chat_content = this.$el.find('.chat-content');
|
var $chat_content = this.$el.find('.chat-content');
|
||||||
$chat_content.find('div.chat-event').remove().end()
|
$chat_content.find('div.chat-event').remove().end()
|
||||||
@ -315,7 +319,7 @@
|
|||||||
times = this.model.messages.pluck('time'),
|
times = this.model.messages.pluck('time'),
|
||||||
this_date = xmppchat.parseISO8601(time),
|
this_date = xmppchat.parseISO8601(time),
|
||||||
$chat_content = this.$el.find('.chat-content'),
|
$chat_content = this.$el.find('.chat-content'),
|
||||||
previous_message, idx, prev_date;
|
previous_message, idx, prev_date, isodate;
|
||||||
|
|
||||||
// If this message is on a different day than the one received
|
// If this message is on a different day than the one received
|
||||||
// prior, then indicate it on the chatbox.
|
// prior, then indicate it on the chatbox.
|
||||||
@ -323,12 +327,16 @@
|
|||||||
if (idx >= 0) {
|
if (idx >= 0) {
|
||||||
previous_message = this.model.messages.at(idx);
|
previous_message = this.model.messages.at(idx);
|
||||||
prev_date = xmppchat.parseISO8601(previous_message.get('time'));
|
prev_date = xmppchat.parseISO8601(previous_message.get('time'));
|
||||||
|
isodate = this_date;
|
||||||
|
isodate.setUTCHours(0,0,0,0);
|
||||||
|
isodate = xmppchat.toISOString(isodate);
|
||||||
if (this.isDifferentDay(prev_date, this_date)) {
|
if (this.isDifferentDay(prev_date, this_date)) {
|
||||||
$chat_content.append($('<div class="chat-date"> </div>'));
|
$chat_content.append(this.new_day_template({
|
||||||
$chat_content.append($('<div class="chat-date"></div>').text(this_date.toString().substring(0,15)));
|
isodate: isodate,
|
||||||
|
datestring: this_date.toString().substring(0,15)
|
||||||
|
}));
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
if (xmppchat.xmppstatus.getStatus() === 'offline') {
|
if (xmppchat.xmppstatus.getStatus() === 'offline') {
|
||||||
// only update the UI if the user is not offline
|
// only update the UI if the user is not offline
|
||||||
return;
|
return;
|
||||||
@ -914,17 +922,30 @@
|
|||||||
sender = Strophe.unescapeNode(Strophe.getResourceFromJid(jid)),
|
sender = Strophe.unescapeNode(Strophe.getResourceFromJid(jid)),
|
||||||
delayed = $message.find('delay').length > 0,
|
delayed = $message.find('delay').length > 0,
|
||||||
subject = $message.children('subject').text(),
|
subject = $message.children('subject').text(),
|
||||||
match, template;
|
match, template, message_datetime, message_date, dates, isodate;
|
||||||
if (!body) { return true; } // XXX: Necessary?
|
if (!body) { return true; } // XXX: Necessary?
|
||||||
if (subject) {
|
if (subject) {
|
||||||
this.$el.find('.chatroom-topic').text(subject).attr('title', subject);
|
this.$el.find('.chatroom-topic').text(subject).attr('title', subject);
|
||||||
}
|
}
|
||||||
if (delayed) {
|
if (delayed) {
|
||||||
stamp = $message.find('delay').attr('stamp');
|
stamp = $message.find('delay').attr('stamp');
|
||||||
time = (new Date(stamp)).toLocaleTimeString().substring(0,5);
|
message_datetime = xmppchat.parseISO8601(stamp);
|
||||||
} else {
|
} else {
|
||||||
time = (new Date()).toLocaleTimeString().substring(0,5);
|
message_datetime = new Date();
|
||||||
}
|
}
|
||||||
|
// If this message is on a different day than the one received
|
||||||
|
// prior, then indicate it on the chatbox.
|
||||||
|
dates = $chat_content.find("time").map(function(){return $(this).attr("datetime");}).get();
|
||||||
|
message_date = message_datetime;
|
||||||
|
message_date.setUTCHours(0,0,0,0);
|
||||||
|
isodate = xmppchat.toISOString(message_date);
|
||||||
|
if (_.indexOf(dates, isodate) == -1) {
|
||||||
|
$chat_content.append(this.new_day_template({
|
||||||
|
isodate: isodate,
|
||||||
|
datestring: message_date.toString().substring(0,15)
|
||||||
|
}));
|
||||||
|
}
|
||||||
|
|
||||||
match = body.match(/^\/(.*?)(?: (.*))?$/);
|
match = body.match(/^\/(.*?)(?: (.*))?$/);
|
||||||
if ((match) && (match[1] === 'me')) {
|
if ((match) && (match[1] === 'me')) {
|
||||||
body = body.replace(/^\/me/, '*'+sender);
|
body = body.replace(/^\/me/, '*'+sender);
|
||||||
@ -938,7 +959,7 @@
|
|||||||
$chat_content.append(
|
$chat_content.append(
|
||||||
template({
|
template({
|
||||||
'sender': sender == 'me' && sender || 'room',
|
'sender': sender == 'me' && sender || 'room',
|
||||||
'time': time,
|
'time': message_date.toLocaleTimeString().substring(0,5),
|
||||||
'message': body,
|
'message': body,
|
||||||
'username': sender,
|
'username': sender,
|
||||||
'extra_classes': delayed && 'delayed' || ''
|
'extra_classes': delayed && 'delayed' || ''
|
||||||
|
Loading…
Reference in New Issue
Block a user