Skip to content

C
converse.js
Commit efa5e305 authored by JC Brand's avatar JC Brand
Browse files
Options

updates #1069 Highlight currently open private chat in the sidebar

parent 58ee1460
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 442 additions and 323 deletions
css/converse.css
View file @ efa5e305
This diff is collapsed.
dist/converse.js
View file @ efa5e305
This diff is collapsed.
mockup/chatbox.html
View file @ efa5e305
...@@ -9,7 +9,7 @@ ...@@ -9,7 +9,7 @@
</head> </head>
<body class="reset"> <body class="reset">
<div id="conversejs" class="fullscreen"> <div id="conversejs" class="fullscreen converse-fullscreen">
<div class="sidebar"></div> <div class="sidebar"></div>
<div class="converse-chatboxes row no-gutters"> <div class="converse-chatboxes row no-gutters">
<div id="controlbox" class="chatbox"> <div id="controlbox" class="chatbox">
......
mockup/user-panel.html
View file @ efa5e305
...@@ -109,12 +109,12 @@ ...@@ -109,12 +109,12 @@
<a href="#" class="group-toggle controlbox-padded " title="Click to hide these contacts"> <a href="#" class="group-toggle controlbox-padded " title="Click to hide these contacts">
<span class="fa fa-caret-down"></span> Contact Requests</a> <span class="fa fa-caret-down"></span> Contact Requests</a>
<ul class="roster-group-contacts"> <ul class="roster-group-contacts">
<li class=" controlbox-padded offline requesting-xmpp-contact d-flex"> <li class="list-item controlbox-padded offline requesting-xmpp-contact d-flex">
<span class="req-contact-name w-100">The Nurse</span> <span class="req-contact-name w-100">The Nurse</span>
<a class="accept-xmpp-request fa fa-check" title="Click here to accept this contact's request" href="#"></a> <a class="accept-xmpp-request fa fa-check" title="Click here to accept this contact's request" href="#"></a>
<a class="decline-xmpp-request fa fa-times" title="Click here to decline this contact's request" href="#"></a> <a class="decline-xmpp-request fa fa-times" title="Click here to decline this contact's request" href="#"></a>
</li> </li>
<li class=" controlbox-padded offline requesting-xmpp-contact d-flex"> <li class="list-item controlbox-padded offline requesting-xmpp-contact d-flex">
<span class="req-contact-name w-100">Friar Laurence</span> <span class="req-contact-name w-100">Friar Laurence</span>
<a class="accept-xmpp-request fa fa-check" title="Click here to accept this contact's request" href="#"></a> <a class="accept-xmpp-request fa fa-check" title="Click here to accept this contact's request" href="#"></a>
<a class="decline-xmpp-request fa fa-times" title="Click here to decline this contact's request" href="#"></a> <a class="decline-xmpp-request fa fa-times" title="Click here to decline this contact's request" href="#"></a>
...@@ -126,12 +126,12 @@ ...@@ -126,12 +126,12 @@
<a href="#" data-group="Colleagues" class="group-toggle controlbox-padded " title="Click to hide these contacts"> <a href="#" data-group="Colleagues" class="group-toggle controlbox-padded " title="Click to hide these contacts">
<span class="fa fa-caret-down"></span> Colleagues</a> <span class="fa fa-caret-down"></span> Colleagues</a>
<ul> <ul>
<li class=" controlbox-padded away current-xmpp-contact d-flex"> <li class="list-item controlbox-padded away current-xmpp-contact d-flex">
<a class="open-chat w-100" title="Click to chat with this contact" href="chatbox.html"> <a class="open-chat w-100" title="Click to chat with this contact" href="chatbox.html">
<span class="fa fa-circle-o" title="this contact is away"></span> Balthasar</a> <span class="fa fa-circle-o" title="this contact is away"></span> Balthasar</a>
<a class="remove-xmpp-contact fa fa-trash" title="Click to remove this contact" href="#"></a> <a class="remove-xmpp-contact fa fa-trash" title="Click to remove this contact" href="#"></a>
</li> </li>
<li class=" controlbox-padded dnd current-xmpp-contact d-flex"> <li class="list-item controlbox-padded dnd current-xmpp-contact d-flex">
<a class="open-chat w-100" title="Click to chat with this contact" href="chatbox.html"> <a class="open-chat w-100" title="Click to chat with this contact" href="chatbox.html">
<span class="fa fa-minus-circle" title="This contact is busy"></span> Escalus, Prince of Verona</a> <span class="fa fa-minus-circle" title="This contact is busy"></span> Escalus, Prince of Verona</a>
<a class="remove-xmpp-contact fa fa-trash" title="Click to remove this contact" href="#"></a> <a class="remove-xmpp-contact fa fa-trash" title="Click to remove this contact" href="#"></a>
...@@ -143,17 +143,17 @@ ...@@ -143,17 +143,17 @@
<a href="#" data-group="Family" class="group-toggle controlbox-padded " title="Click to hide these contacts"> <a href="#" data-group="Family" class="group-toggle controlbox-padded " title="Click to hide these contacts">
<span class="fa fa-caret-down"></span> Family</a> <span class="fa fa-caret-down"></span> Family</a>
<ul> <ul>
<li class=" controlbox-padded online current-xmpp-contact d-flex"> <li class="list-item controlbox-padded online current-xmpp-contact d-flex">
<a class="open-chat w-100" title="Click to chat with this contact" href="chatbox.html"> <a class="open-chat w-100" title="Click to chat with this contact" href="chatbox.html">
<span class="fa fa-circle" title="This contact is online"></span> Benvolio Montague</a> <span class="fa fa-circle" title="This contact is online"></span> Benvolio Montague</a>
<a class="remove-xmpp-contact fa fa-trash" title="Click to remove this contact" href="#"></a> <a class="remove-xmpp-contact fa fa-trash" title="Click to remove this contact" href="#"></a>
</li> </li>
<li class=" controlbox-padded offline current-xmpp-contact d-flex"> <li class="list-item controlbox-padded offline current-xmpp-contact d-flex">
<a class="open-chat w-100" title="Click to chat with this contact" href="chatbox.html"> <a class="open-chat w-100" title="Click to chat with this contact" href="chatbox.html">
<span class="fa fa-times-circle" title="This contact is offline"></span> Montague</a> <span class="fa fa-times-circle" title="This contact is offline"></span> Montague</a>
<a class="remove-xmpp-contact fa fa-trash" title="Click to remove this contact" href="#"></a> <a class="remove-xmpp-contact fa fa-trash" title="Click to remove this contact" href="#"></a>
</li> </li>
<li class=" controlbox-padded offline current-xmpp-contact d-flex"> <li class="list-item controlbox-padded offline current-xmpp-contact d-flex">
<a class="open-chat w-100" title="Click to chat with this contact" href="chatbox.html"> <a class="open-chat w-100" title="Click to chat with this contact" href="chatbox.html">
<span class="fa fa-times-circle" title="This contact is offline"></span> Lady Montague</a> <span class="fa fa-times-circle" title="This contact is offline"></span> Lady Montague</a>
<a class="remove-xmpp-contact fa fa-trash" title="Click to remove this contact" href="#"></a> <a class="remove-xmpp-contact fa fa-trash" title="Click to remove this contact" href="#"></a>
...@@ -165,7 +165,7 @@ ...@@ -165,7 +165,7 @@
<a href="#" data-group="Friends" class="group-toggle controlbox-padded " title="Click to hide these contacts"> <a href="#" data-group="Friends" class="group-toggle controlbox-padded " title="Click to hide these contacts">
<span class="fa fa-caret-down"></span> Friends</a> <span class="fa fa-caret-down"></span> Friends</a>
<ul> <ul>
<li class=" controlbox-padded online current-xmpp-contact d-flex"> <li class="list-item controlbox-padded online current-xmpp-contact d-flex">
<a class="open-chat w-100" title="Click to chat with this contact" href="chatbox.html"> <a class="open-chat w-100" title="Click to chat with this contact" href="chatbox.html">
<span class="fa fa-circle" title="This contact is online"></span> Mercutio</a> <span class="fa fa-circle" title="This contact is online"></span> Mercutio</a>
<a class="remove-xmpp-contact fa fa-trash" title="Click to remove this contact" href="#"></a> <a class="remove-xmpp-contact fa fa-trash" title="Click to remove this contact" href="#"></a>
...@@ -177,17 +177,17 @@ ...@@ -177,17 +177,17 @@
<a href="#" class="group-toggle controlbox-padded " title="Click to hide these contacts"> <a href="#" class="group-toggle controlbox-padded " title="Click to hide these contacts">
<span class="fa fa-caret-down"></span> Ungrouped</a> <span class="fa fa-caret-down"></span> Ungrouped</a>
<ul> <ul>
<li class=" controlbox-padded online current-xmpp-contact d-flex"> <li class="list-item controlbox-padded online current-xmpp-contact d-flex">
<a class="open-chat w-100" title="Click to chat with this contact" href="chatbox.html"> <a class="open-chat w-100" title="Click to chat with this contact" href="chatbox.html">
<span class="fa fa-circle" title="This contact is online"></span> Gregory</a> <span class="fa fa-circle" title="This contact is online"></span> Gregory</a>
<a class="remove-xmpp-contact fa fa-trash" title="Click to remove this contact" href="#"></a> <a class="remove-xmpp-contact fa fa-trash" title="Click to remove this contact" href="#"></a>
</li> </li>
<li class=" controlbox-padded online current-xmpp-contact d-flex"> <li class="list-item controlbox-padded online current-xmpp-contact d-flex">
<a class="open-chat w-100" title="Click to chat with this contact" href="chatbox.html"> <a class="open-chat w-100" title="Click to chat with this contact" href="chatbox.html">
<span class="fa fa-circle" title="This contact is online"></span> Peter</a> <span class="fa fa-circle" title="This contact is online"></span> Peter</a>
<a class="remove-xmpp-contact fa fa-trash" title="Click to remove this contact" href="#"></a> <a class="remove-xmpp-contact fa fa-trash" title="Click to remove this contact" href="#"></a>
</li> </li>
<li class=" controlbox-padded online current-xmpp-contact d-flex"> <li class="list-item controlbox-padded online current-xmpp-contact d-flex">
<a class="open-chat w-100" title="Click to chat with this contact" href="chatbox.html"> <a class="open-chat w-100" title="Click to chat with this contact" href="chatbox.html">
<span class="fa fa-circle" title="This contact is online"></span> Sampson</a> <span class="fa fa-circle" title="This contact is online"></span> Sampson</a>
<a class="remove-xmpp-contact fa fa-trash" title="Click to remove this contact" href="#"></a> <a class="remove-xmpp-contact fa fa-trash" title="Click to remove this contact" href="#"></a>
...@@ -199,11 +199,11 @@ ...@@ -199,11 +199,11 @@
<a href="#" class="group-toggle controlbox-padded " title="Click to hide these contacts"> <a href="#" class="group-toggle controlbox-padded " title="Click to hide these contacts">
<span class="fa fa-caret-down"></span> Pending Contacts</a> <span class="fa fa-caret-down"></span> Pending Contacts</a>
<ul> <ul>
<li class=" controlbox-padded offline pending-xmpp-contact d-flex"> <li class="list-item controlbox-padded offline pending-xmpp-contact d-flex">
<span class="pending-contact-name w-100">An Apothecary</span> <span class="pending-contact-name w-100">An Apothecary</span>
<a class="remove-xmpp-contact fa fa-trash" title="Click to remove this contact" href="#"></a> <a class="remove-xmpp-contact fa fa-trash" title="Click to remove this contact" href="#"></a>
</li> </li>
<li class=" controlbox-padded offline pending-xmpp-contact d-flex"> <li class="list-item controlbox-padded offline pending-xmpp-contact d-flex">
<span class="pending-contact-name w-100">Abram</span> <span class="pending-contact-name w-100">Abram</span>
<a class="remove-xmpp-contact fa fa-trash" title="Click to remove this contact" href="#"></a> <a class="remove-xmpp-contact fa fa-trash" title="Click to remove this contact" href="#"></a>
</li> </li>
......
sass/_controlbox.scss
View file @ efa5e305
...@@ -20,7 +20,9 @@ ...@@ -20,7 +20,9 @@
} }
} }
.set-xmpp-status, .xmpp-status, .roster-contacts { .set-xmpp-status,
.xmpp-status,
.roster-contacts {
.fa-circle { .fa-circle {
color: $green; color: $green;
} }
...@@ -30,9 +32,7 @@ ...@@ -30,9 +32,7 @@
.fa-dot-circle-o { .fa-dot-circle-o {
color: $orange, color: $orange,
} }
.fa-circle-o { .fa-circle-o,
color: $subdued-color;
}
.fa-times-circle { .fa-times-circle {
color: $subdued-color; color: $subdued-color;
} }
......
sass/_lists.scss 0 → 100644
View file @ efa5e305
#conversejs {
.list-container {
text-align: left;
padding: 0.3em 0;
.rooms-toggle {
font-family: $heading-font;
display: block;
color: $text-color;
padding: 0 0 0.5rem 0;
&:hover {
color: $dark-gray-color;
}
}
}
.items-list {
text-align: left;
.list-item {
border: none;
clear: both;
color: $text-color;
display: block;
height: 2em;
overflow: hidden;
padding-top: 0.5em;
text-shadow: 0 1px 0 $text-shadow-color;
word-wrap: break-word;
&.open {
background-color: $controlbox-head-color;
&:hover {
background-color: $controlbox-head-color !important;
}
a {
color: white !important;
}
.fa:hover {
color: white;
}
.fa-circle {
color: lighten($green, 25%);
}
.fa-minus-circle {
color: lighten($red, 15%);
}
.fa-dot-circle-o {
color: lighten($orange, 15%);
}
.fa-circle-o,
.fa-times-circle {
color: lighten($subdued-color, 25%);
}
}
}
.available-chatroom,
.open-headline,
.open-chatroom,
.list-item {
&:hover {
background-color: lighten($controlbox-head-color, 45%);
.fa {
display: block !important;
}
}
&.unread-msgs {
.msgs-indicator {
border-radius: 10%;
opacity: 1;
}
.available-room,
.open-room {
width: 100%;
font-weight: bold;
}
}
a {
&:hover {
color: $dark-link-color;
}
&.fa {
display: none;
&:before {
font-size: 15px;
}
}
&.open-room {
width: 68%;
float: left;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
padding-right: 0.5em;
}
&.available-room {
width: 85%;
}
}
.add-bookmark,
.remove-bookmark,
.close-room,
.room-info {
&.button-on {
color: $link-color;
&:hover {
color: $dark-link-color;
}
}
color: $subdued-color;
}
}
}
}
sass/_roomslist.scss deleted 100644 → 0
View file @ 58ee1460
#conversejs {
.list-container {
text-align: left;
padding: 0.3em 0;
.rooms-toggle {
font-family: $heading-font;
display: block;
color: $text-color;
padding: 0 0 0.5rem 0;
&:hover {
color: $dark-gray-color;
}
}
.items-list {
text-align: left;
.list-item {
border: none;
clear: both;
color: $text-color;
display: block;
height: 2em;
overflow: hidden;
padding-top: 0.5em;
text-shadow: 0 1px 0 $text-shadow-color;
word-wrap: break-word;
}
.available-chatroom,
.open-headline,
.open-chatroom {
&:hover {
background-color: lighten($controlbox-head-color, 45%);
.remove-bookmark,
.add-bookmark,
.close-room,
.room-info {
display: block !important;
}
}
&.open {
background-color: $controlbox-head-color;
a {
color: white !important;
}
}
&.unread-msgs {
.msgs-indicator {
border-radius: 10%;
opacity: 1;
}
.available-room,
.open-room {
width: 100%;
font-weight: bold;
}
}
a {
&:hover {
color: $dark-link-color;
}
&.remove-bookmark,
&.add-bookmark,
&.close-room,
&.room-info {
display: none;
&:before {
font-size: 15px;
}
}
&.open-room {
width: 68%;
float: left;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
padding-right: 0.5em;
}
&.available-room {
width: 85%;
}
}
.add-bookmark,
.remove-bookmark,
.close-room,
.room-info {
&.button-on {
color: $link-color;
&:hover {
color: $dark-link-color;
}
}
color: $subdued-color;
}
}
}
}
}
sass/_roster.scss
View file @ efa5e305
...@@ -94,14 +94,6 @@ ...@@ -94,14 +94,6 @@
padding: 0 0.2em 0 0; padding: 0 0.2em 0 0;
} }
} }
a {
&:hover {
color: $dark-link-color;
}
.fa:hover {
color: white;
}
}
.open-chat { .open-chat {
margin: 0; margin: 0;
......
sass/converse.scss
View file @ efa5e305
...@@ -43,7 +43,7 @@ ...@@ -43,7 +43,7 @@
@import "profile"; @import "profile";
@import "chatbox"; @import "chatbox";
@import "controlbox"; @import "controlbox";
@import "roomslist"; @import "lists";
@import "roster"; @import "roster";
@import "chatrooms"; @import "chatrooms";
@import "headline"; @import "headline";
......
src/converse-chatboxes.js
View file @ efa5e305
...@@ -417,7 +417,7 @@ ...@@ -417,7 +417,7 @@
if (type === 'error') { if (type === 'error') {
const error = message.querySelector('error'); const error = message.querySelector('error');
return _.propertyOf(error.querySelector('text'))('textContent') || return _.propertyOf(error.querySelector('text'))('textContent') ||
__('Sorry, an error occured:') + ' ' + error.innerHTML; __('Sorry, an error occurred:') + ' ' + error.innerHTML;
} else { } else {
return _.propertyOf(message.querySelector('body'))('textContent'); return _.propertyOf(message.querySelector('body'))('textContent');
} }
......
src/converse-core.js
View file @ efa5e305
...@@ -740,8 +740,8 @@ ...@@ -740,8 +740,8 @@
this.connection.addHandler((iq) => { this.connection.addHandler((iq) => {
if (iq.querySelectorAll('error').length > 0) { if (iq.querySelectorAll('error').length > 0) {
_converse.log( _converse.log(
'An error occured while trying to enable message carbons.', 'An error occurred while trying to enable message carbons.',
Strophe.LogLevel.ERROR); Strophe.LogLevel.WARN);
} else { } else {
this.session.save({'carbons_enabled': true}); this.session.save({'carbons_enabled': true});
_converse.log('Message carbons have been enabled.'); _converse.log('Message carbons have been enabled.');
......
src/converse-roster.js
View file @ efa5e305
...@@ -232,10 +232,20 @@ ...@@ -232,10 +232,20 @@
'user_id': Strophe.getNodeFromJid(jid) 'user_id': Strophe.getNodeFromJid(jid)
}, attributes)); }, attributes));
this.setChatBox();
this.presence.on('change:show', () => _converse.emit('contactPresenceChanged', this)); this.presence.on('change:show', () => _converse.emit('contactPresenceChanged', this));
this.presence.on('change:show', () => this.trigger('presenceChanged')); this.presence.on('change:show', () => this.trigger('presenceChanged'));
}, },
setChatBox (chatbox=null) {
chatbox = chatbox || _converse.chatboxes.get(this.get('jid'));
if (chatbox) {
this.chatbox = chatbox;
this.chatbox.on('change:hidden', this.render, this);
}
},
getDisplayName () { getDisplayName () {
return this.vcard.get('fullname') || this.get('jid'); return this.vcard.get('fullname') || this.get('jid');
}, },
...@@ -450,7 +460,7 @@ ...@@ -450,7 +460,7 @@
* (String) name - The name of that user * (String) name - The name of that user
* (Array of Strings) groups - Any roster groups the user might belong to * (Array of Strings) groups - Any roster groups the user might belong to
* (Function) callback - A function to call once the IQ is returned * (Function) callback - A function to call once the IQ is returned
* (Function) errback - A function to call if an error occured * (Function) errback - A function to call if an error occurred
*/ */
name = _.isEmpty(name)? jid: name; name = _.isEmpty(name)? jid: name;
const iq = $iq({type: 'set'}) const iq = $iq({type: 'set'})
...@@ -798,6 +808,16 @@ ...@@ -798,6 +808,16 @@
/********** Event Handlers *************/ /********** Event Handlers *************/
function updateUnreadCounter (chatbox) {
const contact = _converse.roster.findWhere({'jid': chatbox.get('jid')});
if (!_.isUndefined(contact)) {
contact.save({'num_unread': chatbox.get('num_unread')});
}
}
_converse.api.listen.on('chatBoxesInitialized', () => {
_converse.chatboxes.on('change:num_unread', updateUnreadCounter)
});
_converse.api.listen.on('beforeTearDown', _converse.unregisterPresenceHandler()); _converse.api.listen.on('beforeTearDown', _converse.unregisterPresenceHandler());
_converse.api.listen.on('afterTearDown', () => { _converse.api.listen.on('afterTearDown', () => {
......
src/converse-rosterview.js
View file @ efa5e305
...@@ -358,7 +358,7 @@ ...@@ -358,7 +358,7 @@
_converse.RosterContactView = Backbone.NativeView.extend({ _converse.RosterContactView = Backbone.NativeView.extend({
tagName: 'li', tagName: 'li',
className: 'd-flex hidden controlbox-padded', className: 'list-item d-flex hidden controlbox-padded',
events: { events: {
"click .accept-xmpp-request": "acceptRequest", "click .accept-xmpp-request": "acceptRequest",
...@@ -369,10 +369,11 @@ ...@@ -369,10 +369,11 @@
initialize () { initialize () {
this.model.on("change", this.render, this); this.model.on("change", this.render, this);
this.model.on("highlight", this.highlight, this);
this.model.on("destroy", this.remove, this); this.model.on("destroy", this.remove, this);
this.model.on("open", this.openChat, this); this.model.on("open", this.openChat, this);
this.model.on("remove", this.remove, this); this.model.on("remove", this.remove, this);
this.model.presence.on("change:show", this.render, this); this.model.presence.on("change:show", this.render, this);
this.model.vcard.on('change:fullname', this.render, this); this.model.vcard.on('change:fullname', this.render, this);
}, },
...@@ -383,11 +384,10 @@ ...@@ -383,11 +384,10 @@
u.hideElement(this.el); u.hideElement(this.el);
return this; return this;
} }
const item = this.model, const ask = this.model.get('ask'),
ask = item.get('ask'), show = this.model.presence.get('show'),
show = item.presence.get('show'), requesting = this.model.get('requesting'),
requesting = item.get('requesting'), subscription = this.model.get('subscription');
subscription = item.get('subscription');
const classes_to_remove = [ const classes_to_remove = [
'current-xmpp-contact', 'current-xmpp-contact',
...@@ -403,6 +403,18 @@ ...@@ -403,6 +403,18 @@
}); });
this.el.classList.add(show); this.el.classList.add(show);
this.el.setAttribute('data-status', show); this.el.setAttribute('data-status', show);
this.highlight();
if (_converse.isSingleton()) {
const chatbox = _converse.chatboxes.get(this.model.get('jid'));
if (chatbox) {
if (chatbox.get('hidden')) {
this.el.classList.remove('open');
} else {
this.el.classList.add('open');
}
}
}
if ((ask === 'subscribe') || (subscription === 'from')) { if ((ask === 'subscribe') || (subscription === 'from')) {
/* ask === 'subscribe' /* ask === 'subscribe'
...@@ -416,20 +428,20 @@ ...@@ -416,20 +428,20 @@
* *
* So in both cases the user is a "pending" contact. * So in both cases the user is a "pending" contact.
*/ */
const display_name = item.getDisplayName(); const display_name = this.model.getDisplayName();
this.el.classList.add('pending-xmpp-contact'); this.el.classList.add('pending-xmpp-contact');
this.el.innerHTML = tpl_pending_contact( this.el.innerHTML = tpl_pending_contact(
_.extend(item.toJSON(), { _.extend(this.model.toJSON(), {
'display_name': display_name, 'display_name': display_name,
'desc_remove': __('Click to remove %1$s as a contact', display_name), 'desc_remove': __('Click to remove %1$s as a contact', display_name),
'allow_chat_pending_contacts': _converse.allow_chat_pending_contacts 'allow_chat_pending_contacts': _converse.allow_chat_pending_contacts
}) })
); );
} else if (requesting === true) { } else if (requesting === true) {
const display_name = item.getDisplayName(); const display_name = this.model.getDisplayName();
this.el.classList.add('requesting-xmpp-contact'); this.el.classList.add('requesting-xmpp-contact');
this.el.innerHTML = tpl_requesting_contact( this.el.innerHTML = tpl_requesting_contact(
_.extend(item.toJSON(), { _.extend(this.model.toJSON(), {
'display_name': display_name, 'display_name': display_name,
'desc_accept': __("Click to accept the contact request from %1$s", display_name), 'desc_accept': __("Click to accept the contact request from %1$s", display_name),
'desc_decline': __("Click to decline the contact request from %1$s", display_name), 'desc_decline': __("Click to decline the contact request from %1$s", display_name),
...@@ -440,11 +452,26 @@ ...@@ -440,11 +452,26 @@
this.el.classList.add('current-xmpp-contact'); this.el.classList.add('current-xmpp-contact');
this.el.classList.remove(_.without(['both', 'to'], subscription)[0]); this.el.classList.remove(_.without(['both', 'to'], subscription)[0]);
this.el.classList.add(subscription); this.el.classList.add(subscription);
this.renderRosterItem(item); this.renderRosterItem(this.model);
} }
return this; return this;
}, },
highlight () {
/* If appropriate, highlight the contact (by adding the 'open' class).
*/
if (_converse.isSingleton()) {
const chatbox = _converse.chatboxes.get(this.model.get('jid'));
if (chatbox) {
if (chatbox.get('hidden')) {
this.el.classList.remove('open');
} else {
this.el.classList.add('open');
}
}
}
},
renderRosterItem (item) { renderRosterItem (item) {
let status_icon = 'fa-times-circle'; let status_icon = 'fa-times-circle';
const show = item.presence.get('show') || 'offline'; const show = item.presence.get('show') || 'offline';
...@@ -880,15 +907,14 @@ ...@@ -880,15 +907,14 @@
}, },
updateChatBox (contact) { updateChatBox (contact) {
const chatbox = _converse.chatboxes.get(contact.get('jid')), if (!this.model.chatbox) {
changes = {};
if (!chatbox) {
return this; return this;
} }
const changes = {};
if (_.has(contact.changed, 'status')) { if (_.has(contact.changed, 'status')) {
changes.status = contact.get('status'); changes.status = contact.get('status');
} }
chatbox.save(changes); this.model.chatbox.save(changes);
return this; return this;
}, },
...@@ -937,15 +963,14 @@ ...@@ -937,15 +963,14 @@
/* -------- Event Handlers ----------- */ /* -------- Event Handlers ----------- */
function updateUnreadCounter (chatbox) {
const contact = _.head(_converse.roster.where({'jid': chatbox.get('jid')}));
if (!_.isUndefined(contact)) {
contact.save({'num_unread': chatbox.get('num_unread')});
}
}
_converse.api.listen.on('chatBoxesInitialized', () => { _converse.api.listen.on('chatBoxesInitialized', () => {
_converse.chatboxes.on('change:num_unread', updateUnreadCounter)
_converse.chatboxes.on('change:hidden', (chatbox) => {
const contact = _converse.roster.findWhere({'jid': chatbox.get('jid')});
if (!_.isUndefined(contact)) {
contact.trigger('highlight', contact);
}
});
}); });
function initRoster () { function initRoster () {
......
src/templates/group_header.html
View file @ efa5e305
<a href="#" class="group-toggle controlbox-padded" title="{{{o.desc_group_toggle}}}"> <a href="#" class="group-toggle controlbox-padded" title="{{{o.desc_group_toggle}}}">
<span class="fa {[ if (o.toggle_state === o._converse.OPENED) { ]} fa-caret-down {[ } else { ]} fa-caret-right {[ } ]}"> <span class="fa {[ if (o.toggle_state === o._converse.OPENED) { ]} fa-caret-down {[ } else { ]} fa-caret-right {[ } ]}">
</span> {{{o.label_group}}}</a> </span> {{{o.label_group}}}</a>
<ul class="roster-group-contacts {[ if (o.toggle_state === o._converse.CLOSED) { ]} collapsed {[ } ]}"></ul> <ul class="items-list roster-group-contacts {[ if (o.toggle_state === o._converse.CLOSED) { ]} collapsed {[ } ]}"></ul>
src/templates/roster_item.html
View file @ efa5e305
<a class="open-chat w-100 {[ if (o.num_unread) { ]} unread-msgs {[ } ]}" <a class="cbox-list-item open-chat w-100 {[ if (o.num_unread) { ]} unread-msgs {[ } ]}"
title="{{{o.desc_chat}}}" href="#"> title="{{{o.desc_chat}}}" href="#">
<span class="fa {{{o.status_icon}}}" title="{{{o.desc_status}}}"></span> <span class="fa {{{o.status_icon}}}" title="{{{o.desc_status}}}"></span>
{[ if (o.num_unread) { ]} {[ if (o.num_unread) { ]}
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment
GitLab Nexedi Edition | About GitLab | About Nexedi | 沪ICP备2021021310号-2 | 沪ICP备2021021310号-7