1
0
mirror of https://github.com/moparisthebest/kaiwa synced 2024-11-25 18:52:20 -05:00

Clean up, add support for mention highlights in MUC

This commit is contained in:
Lance Stout 2013-12-16 20:20:29 -08:00
parent 72eaa59ff7
commit 8712c3ab5e
10 changed files with 59 additions and 42 deletions

View File

@ -91,13 +91,18 @@ module.exports = HumanModel.define({
}
},
processedBody: {
deps: ['body', 'meAction'],
deps: ['body', 'meAction', 'mentions'],
fn: function () {
var body = this.body;
if (this.meAction) {
body = body.substr(4);
}
return htmlify.toHTML(body);
body = htmlify.toHTML(body);
if (this.mentions) {
var existing = htmlify.toHTML(this.mentions);
body = body.replace(existing, '<span class="mention">' + existing + '</span>');
}
return body;
}
},
partialTemplateHtml: {
@ -146,7 +151,8 @@ module.exports = HumanModel.define({
_mucMine: 'bool',
receiptReceived: ['bool', true, false],
edited: ['bool', true, false],
delay: 'object'
delay: 'object',
mentions: ['string', false, '']
},
correct: function (msg) {
if (this.from.full !== msg.from.full) return false;

View File

@ -61,8 +61,18 @@ module.exports = HumanModel.define({
addMessage: function (message, notify) {
message.owner = me.jid.bare;
if (notify && (!this.activeContact || (this.activeContact && !app.state.focused)) && message.from.resource !== this.nick) {
var mine = message.from.resource === this.nick;
if (mine) {
message._mucMine = true;
}
if (!mine && message.body.toLowerCase().indexOf(this.nick.toLowerCase()) >= 0) {
message.mentions = this.nick;
}
if (notify && (!this.activeContact || (this.activeContact && !app.state.focused)) && !mine) {
this.unreadCount++;
if (message.mentions) {
app.notifications.create(this.displayName, {
body: message.body,
icon: this.avatar,
@ -70,13 +80,14 @@ module.exports = HumanModel.define({
onclick: _.bind(app.navigate, app, '/groupchat/' + this.jid)
});
}
}
message.acked = true;
this.messages.add(message);
if (message.from.resource === this.nick) {
message = this.messages.get(message.id); // Grab the existing message object that was updated
message._mucMine = true;
if (mine) {
// Grab and save the existing message object that was updated
message = this.messages.get(message.id);
this.lastSentMessage = message;
}

View File

@ -20,7 +20,6 @@ module.exports = BasePage.extend(chatHelpers).extend({
this.listenTo(this, 'pageunloaded', this.handlePageUnloaded);
this.listenTo(this.model.messages, 'change:body', this.refreshModel);
this.listenTo(this.model.messages, 'change:meAction', this.refreshModel);
this.listenTo(this.model.messages, 'change:edited', this.refreshModel);
this.listenTo(this.model.messages, 'change:pending', this.refreshModel);

View File

@ -20,7 +20,6 @@ module.exports = BasePage.extend(chatHelpers).extend({
this.listenTo(this.model.messages, 'change:body', this.refreshModel);
this.listenTo(this.model.messages, 'change:edited', this.refreshModel);
this.listenTo(this.model.messages, 'change:pending', this.refreshModel);
this.listenTo(this.model.messages, 'change:mine', this.refreshModel);
this.render();
},
@ -33,9 +32,6 @@ module.exports = BasePage.extend(chatHelpers).extend({
classBindings: {
joined: '.controls'
},
srcBindings: {
avatar: 'header .avatar'
},
textBindings: {
displayName: 'header .name'
},

View File

@ -120,12 +120,7 @@ exports.includes.mucBareMessage = function anonymous(locals) {
exports.includes.mucListItem = function anonymous(locals) {
var buf = [];
with (locals || {}) {
buf.push('<li class="contact"><img' + jade.attrs({
src: contact.avatar,
"class": "avatar"
}, {
src: true
}) + '/><div class="name">' + jade.escape(null == (jade.interp = contact.displayName) ? "" : jade.interp) + '</div><div class="unread">' + jade.escape(null == (jade.interp = contact.unreadCount) ? "" : jade.interp) + "</div></li>");
buf.push('<li class="contact"><div class="name">' + jade.escape(null == (jade.interp = contact.displayName) ? "" : jade.interp) + '</div><div class="unread">' + jade.escape(null == (jade.interp = contact.unreadCount) ? "" : jade.interp) + "</div></li>");
}
return buf.join("");
};
@ -208,7 +203,7 @@ exports.pages.chat = function anonymous(locals) {
exports.pages.groupchat = function anonymous(locals) {
var buf = [];
with (locals || {}) {
buf.push('<section class="page chat"><section class="conversation"><header><img class="avatar"/><h1 class="name"></h1><div class="controls"><button class="primary joinRoom">Join</button><button class="secondary leaveRoom">Leave</button></div></header><ul class="messages"></ul><div class="chatBox"><form><textarea name="chatInput" type="text" placeholder="Send a message..." autocomplete="off"></textarea></form></div></section></section>');
buf.push('<section class="page chat"><section class="conversation"><header><h1 class="name"></h1><div class="controls"><button class="primary joinRoom">Join</button><button class="secondary leaveRoom">Leave</button></div></header><ul class="messages"></ul><div class="chatBox"><form><textarea name="chatInput" type="text" placeholder="Send a message..." autocomplete="off"></textarea></form></div></section></section>');
}
return buf.join("");
};

View File

@ -1,4 +1,3 @@
li.contact
img.avatar(src=contact.avatar)
.name=contact.displayName
.unread=contact.unreadCount

View File

@ -1,7 +1,6 @@
section.page.chat
section.conversation
header
img.avatar
h1.name
.controls
button.primary.joinRoom Join

View File

@ -1046,7 +1046,7 @@ button.secondary:hover:not(:disabled) {
font-size: 12px;
font-weight: bold;
color: #565656;
padding: 10px;
padding: 5px;
text-align: right;
background-color: #f7f7f7;
border-top: 1px solid #e1e1e1;
@ -1056,10 +1056,8 @@ button.secondary:hover:not(:disabled) {
padding-left: 10px;
}
.messages .messageWrapper {
padding-left: 50px;
display: table-cell;
vertical-align: middle;
padding: 10px;
padding: 5px;
border-top: 1px solid #eee;
width: 99%;
}
@ -1094,8 +1092,8 @@ button.secondary:hover:not(:disabled) {
}
.messages .message.meAction {
font-style: italic;
color: #ec008c;
background-color: #fce8f1;
color: #12acef;
background-color: #e7f7fd;
padding: 2px;
padding-left: 8px;
border-radius: 2px;
@ -1108,12 +1106,20 @@ button.secondary:hover:not(:disabled) {
position: relative;
left: -10px;
font-style: normal;
color: #f8bee0;
color: #88d5f7;
}
.messages .message .body {
display: inline;
word-break: break-word;
}
.messages .message .body .mention {
color: #ec008c;
background-color: #fce8f1;
padding: 1px;
font-weight: bold;
border-radius: 4px;
border: 1px solid #ee7db0;
}
.messages .message .timestamp {
font-size: 10px;
color: #88d5f7;

View File

@ -155,7 +155,7 @@
font-size: 12px
font-weight: bold
color: $gray
padding: 10px
padding: 5px
text-align: right
background-color: #f7f7f7
border-top: 1px solid #e1e1e1
@ -165,10 +165,8 @@
padding-left: 10px
.messageWrapper
padding-left: 50px
display: table-cell
vertical-align: middle
padding: 10px
padding: 5px
border-top: 1px solid #eee
width: 99%
@ -203,8 +201,8 @@
&.meAction
font-style: italic
color: $pink
background-color: $pink-lighter
color: $blue
background-color: $blue-lighter
padding: 2px
padding-left: 8px
border-radius: 2px
@ -217,12 +215,20 @@
position: relative
left: -10px
font-style: normal
color: $pink-light
color: $blue-light
.body
display: inline
word-break: break-word
.mention
color: $pink
background-color: $pink-lighter
padding: 1px
font-weight: bold
border-radius: 4px
border: 1px solid darken($pink-lighter, 25%)
.timestamp
font-size: $font-size-smaller
color: lighten($blue, 50%)

View File

@ -1,5 +1,5 @@
CACHE MANIFEST
# 0.0.1 1387250191209
# 0.0.1 1387253893324
CACHE:
/app.js