Skip to content

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

Some initial refactoring to support roster groups. updates #83 

Made sure that the non-group usecase is still covered.
parent df374d3d
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 117 additions and 80 deletions
converse.js
View file @ 04d2b3ae
This diff is collapsed.
less/converse.less
View file @ 04d2b3ae
...@@ -983,7 +983,7 @@ dl.add-converse-contact { ...@@ -983,7 +983,7 @@ dl.add-converse-contact {
height: ~"calc(100% - 70px)"; height: ~"calc(100% - 70px)";
} }
#converse-roster .roster-group { #converse-roster .group-toggle {
color: #666; color: #666;
} }
...@@ -1070,12 +1070,12 @@ dl.add-converse-contact { ...@@ -1070,12 +1070,12 @@ dl.add-converse-contact {
line-height: 16px; line-height: 16px;
} }
#conversejs .roster-group { #conversejs .group-toggle {
display: block; display: block;
width: 100%; width: 100%;
} }
#conversejs .roster-group:hover, #conversejs .group-toggle:hover,
#conversejs dd.available-chatroom:hover, #conversejs dd.available-chatroom:hover,
#conversejs #converse-roster dd:hover { #conversejs #converse-roster dd:hover {
background-color: #eee; background-color: #eee;
......
mockup/controlbox.html
View file @ 04d2b3ae
...@@ -115,8 +115,8 @@ ...@@ -115,8 +115,8 @@
</dd> </dd>
</dl> </dl>
<dl id="converse-roster" style="display: block;"> <dl id="converse-roster" style="display: block;">
<dt id="xmpp-contacts" style="display: block;"> <dt class="roster-group" style="display: block;">
<a href="#" class="roster-group icon-opened" title="Click to hide these contacts">Colleagues</a> <a href="#" class="group-toggle icon-opened" title="Click to hide these contacts">Colleagues</a>
</dt> </dt>
<dd class="online current-xmpp-contact"> <dd class="online current-xmpp-contact">
<a class="open-chat" title="Click to chat with this contact" href="#"> <a class="open-chat" title="Click to chat with this contact" href="#">
...@@ -140,8 +140,8 @@ ...@@ -140,8 +140,8 @@
<a class="remove-xmpp-contact icon-remove" title="Click to remove this contact" href="#"></a> <a class="remove-xmpp-contact icon-remove" title="Click to remove this contact" href="#"></a>
</dd> </dd>
<dt id="xmpp-contacts" style="display: block;"> <dt class="roster-group" style="display: block;">
<a href="#" class="roster-group icon-opened" title="Click to hide these contacts">Family</a> <a href="#" class="group-toggle icon-opened" title="Click to hide these contacts">Family</a>
</dt> </dt>
<dd class="away current-xmpp-contact"> <dd class="away current-xmpp-contact">
<a class="open-chat" title="Click to chat with this contact" href="#"> <a class="open-chat" title="Click to chat with this contact" href="#">
...@@ -158,8 +158,8 @@ ...@@ -158,8 +158,8 @@
<a class="remove-xmpp-contact icon-remove" title="Click to remove this contact" href="#"></a> <a class="remove-xmpp-contact icon-remove" title="Click to remove this contact" href="#"></a>
</dd> </dd>
<dt id="xmpp-contacts" style="display: block;"> <dt class="roster-group" style="display: block;">
<a href="#" class="roster-group icon-opened" title="Click to hide these contacts">Friends</a> <a href="#" class="group-toggle icon-opened" title="Click to hide these contacts">Friends</a>
</dt> </dt>
<dd class="online current-xmpp-contact"> <dd class="online current-xmpp-contact">
<a class="open-chat" title="Click to chat with this contact" href="#"> <a class="open-chat" title="Click to chat with this contact" href="#">
...@@ -176,8 +176,8 @@ ...@@ -176,8 +176,8 @@
<a class="remove-xmpp-contact icon-remove" title="Click to remove this contact" href="#"></a> <a class="remove-xmpp-contact icon-remove" title="Click to remove this contact" href="#"></a>
</dd> </dd>
<dt id="xmpp-contacts" style="display: block;"> <dt class="roster-group" style="display: block;">
<a href="#" class="roster-group icon-opened" title="Click to hide these contacts">Ungrouped</a> <a href="#" class="group-toggle icon-opened" title="Click to hide these contacts">Ungrouped</a>
</dt> </dt>
<dd class="online current-xmpp-contact"> <dd class="online current-xmpp-contact">
<a class="open-chat" title="Click to chat with this contact" href="#"> <a class="open-chat" title="Click to chat with this contact" href="#">
...@@ -188,7 +188,7 @@ ...@@ -188,7 +188,7 @@
</dd> </dd>
<dt id="xmpp-contact-requests" style="display: block;"> <dt id="xmpp-contact-requests" style="display: block;">
<a href="#" class="roster-group icon-opened" title="Click to hide these contacts">Contact Requests</a> <a href="#" class="group-toggle icon-opened" title="Click to hide these contacts">Contact Requests</a>
</dt> </dt>
<dd class="offline requesting-xmpp-contact"> <dd class="offline requesting-xmpp-contact">
<span>Bob Skinstad</span> <span>Bob Skinstad</span>
...@@ -206,7 +206,7 @@ ...@@ -206,7 +206,7 @@
</dd> </dd>
<dt id="pending-xmpp-contacts" style="display: block;"> <dt id="pending-xmpp-contacts" style="display: block;">
<a href="#" class="roster-group icon-opened" title="Click to hide these contacts">Pending Contacts</a> <a href="#" class="group-toggle icon-opened" title="Click to hide these contacts">Pending Contacts</a>
</dt> </dt>
<dd class="offline pending-xmpp-contact"><span>Rassie Erasmus</span> <dd class="offline pending-xmpp-contact"><span>Rassie Erasmus</span>
<a class="remove-xmpp-contact icon-remove" title="Click to remove this contact" href="#"></a> <a class="remove-xmpp-contact icon-remove" title="Click to remove this contact" href="#"></a>
...@@ -302,7 +302,7 @@ $(document).ready(function () { ...@@ -302,7 +302,7 @@ $(document).ready(function () {
} }
$(function() { $(function() {
$('.roster-group').click(function(ev) { $('.group-toggle').click(function(ev) {
ev.preventDefault(); ev.preventDefault();
var $el = $(ev.target); var $el = $(ev.target);
$el.parent().nextUntil('dt').slideToggle(); $el.parent().nextUntil('dt').slideToggle();
......
spec/chatbox.js
View file @ 04d2b3ae
...@@ -29,7 +29,7 @@ ...@@ -29,7 +29,7 @@
spyOn(this.chatboxviews, 'trimChats'); spyOn(this.chatboxviews, 'trimChats');
expect($("#conversejs .chatbox").length).toBe(1); // Controlbox is open expect($("#conversejs .chatbox").length).toBe(1); // Controlbox is open
var online_contacts = this.rosterview.$el.find('dt#xmpp-contacts').siblings('dd.current-xmpp-contact').find('a.open-chat'); var online_contacts = this.rosterview.$el.find('dt.roster-group').siblings('dd.current-xmpp-contact').find('a.open-chat');
for (i=0; i<online_contacts.length; i++) { for (i=0; i<online_contacts.length; i++) {
$el = $(online_contacts[i]); $el = $(online_contacts[i]);
jid = $el.text().replace(/ /g,'.').toLowerCase() + '@localhost'; jid = $el.text().replace(/ /g,'.').toLowerCase() + '@localhost';
...@@ -60,7 +60,7 @@ ...@@ -60,7 +60,7 @@
expect($("#conversejs .chatbox").length).toBe(1); // Controlbox is open expect($("#conversejs .chatbox").length).toBe(1); // Controlbox is open
// Test that they can be trimmed // Test that they can be trimmed
var online_contacts = this.rosterview.$el.find('dt#xmpp-contacts').siblings('dd.current-xmpp-contact').find('a.open-chat'); var online_contacts = this.rosterview.$el.find('dt.roster-group').siblings('dd.current-xmpp-contact').find('a.open-chat');
for (i=0; i<online_contacts.length; i++) { for (i=0; i<online_contacts.length; i++) {
$el = $(online_contacts[i]); $el = $(online_contacts[i]);
jid = $el.text().replace(/ /g,'.').toLowerCase() + '@localhost'; jid = $el.text().replace(/ /g,'.').toLowerCase() + '@localhost';
......
spec/controlbox.js
View file @ 04d2b3ae
...@@ -216,7 +216,7 @@ ...@@ -216,7 +216,7 @@
it("do not have a heading if there aren't any", $.proxy(function () { it("do not have a heading if there aren't any", $.proxy(function () {
converse.rosterview.model.reset(); converse.rosterview.model.reset();
expect(this.rosterview.$el.find('dt#xmpp-contacts').css('display')).toEqual('none'); expect(this.rosterview.$el.find('dt.roster-group').css('display')).toEqual('none');
}, converse)); }, converse));
it("can be added to the roster and they will be sorted alphabetically", $.proxy(function () { it("can be added to the roster and they will be sorted alphabetically", $.proxy(function () {
...@@ -234,14 +234,14 @@ ...@@ -234,14 +234,14 @@
}); });
expect(this.rosterview.render).toHaveBeenCalled(); expect(this.rosterview.render).toHaveBeenCalled();
expect(converse.emit).toHaveBeenCalledWith('rosterViewUpdated'); expect(converse.emit).toHaveBeenCalledWith('rosterViewUpdated');
// Check that they are sorted alphabetically
t = this.rosterview.$el.find('dt#xmpp-contacts').siblings('dd.current-xmpp-contact.offline').find('a.open-chat').text();
expect(t).toEqual(mock.cur_names.slice(0,i+1).sort().join(''));
} }
// Check that they are sorted alphabetically
t = this.rosterview.$el.find('dt.roster-group').siblings('dd.current-xmpp-contact.offline').find('a.open-chat').text();
expect(t).toEqual(mock.cur_names.slice(0,i+1).sort().join(''));
}, converse)); }, converse));
it("will have their own heading once they have been added", $.proxy(function () { it("will have their own heading once they have been added", $.proxy(function () {
expect(this.rosterview.$el.find('dt#xmpp-contacts').css('display')).toEqual('block'); expect(this.rosterview.$el.find('dt.roster-group').css('display')).toEqual('block');
}, converse)); }, converse));
it("can change their status to online and be sorted alphabetically", $.proxy(function () { it("can change their status to online and be sorted alphabetically", $.proxy(function () {
...@@ -258,7 +258,7 @@ ...@@ -258,7 +258,7 @@
expect(this.rosterview.render).toHaveBeenCalled(); expect(this.rosterview.render).toHaveBeenCalled();
expect(converse.emit).toHaveBeenCalledWith('rosterViewUpdated'); expect(converse.emit).toHaveBeenCalledWith('rosterViewUpdated');
// Check that they are sorted alphabetically // Check that they are sorted alphabetically
t = this.rosterview.$el.find('dt#xmpp-contacts').siblings('dd.current-xmpp-contact.online').find('a.open-chat').text(); t = this.rosterview.$el.find('dt.roster-group').siblings('dd.current-xmpp-contact.online').find('a.open-chat').text();
expect(t).toEqual(mock.cur_names.slice(0,i+1).sort().join('')); expect(t).toEqual(mock.cur_names.slice(0,i+1).sort().join(''));
} }
}, converse)); }, converse));
...@@ -277,7 +277,7 @@ ...@@ -277,7 +277,7 @@
expect(this.rosterview.render).toHaveBeenCalled(); expect(this.rosterview.render).toHaveBeenCalled();
expect(converse.emit).toHaveBeenCalledWith('rosterViewUpdated'); expect(converse.emit).toHaveBeenCalledWith('rosterViewUpdated');
// Check that they are sorted alphabetically // Check that they are sorted alphabetically
t = this.rosterview.$el.find('dt#xmpp-contacts').siblings('dd.current-xmpp-contact.dnd').find('a.open-chat').text(); t = this.rosterview.$el.find('dt.roster-group').siblings('dd.current-xmpp-contact.dnd').find('a.open-chat').text();
expect(t).toEqual(mock.cur_names.slice(0,i+1).sort().join('')); expect(t).toEqual(mock.cur_names.slice(0,i+1).sort().join(''));
} }
}, converse)); }, converse));
...@@ -296,7 +296,7 @@ ...@@ -296,7 +296,7 @@
expect(this.rosterview.render).toHaveBeenCalled(); expect(this.rosterview.render).toHaveBeenCalled();
expect(converse.emit).toHaveBeenCalledWith('rosterViewUpdated'); expect(converse.emit).toHaveBeenCalledWith('rosterViewUpdated');
// Check that they are sorted alphabetically // Check that they are sorted alphabetically
t = this.rosterview.$el.find('dt#xmpp-contacts').siblings('dd.current-xmpp-contact.away').find('a.open-chat').text(); t = this.rosterview.$el.find('dt.roster-group').siblings('dd.current-xmpp-contact.away').find('a.open-chat').text();
expect(t).toEqual(mock.cur_names.slice(0,i+1).sort().join('')); expect(t).toEqual(mock.cur_names.slice(0,i+1).sort().join(''));
} }
}, converse)); }, converse));
...@@ -315,7 +315,7 @@ ...@@ -315,7 +315,7 @@
expect(this.rosterview.render).toHaveBeenCalled(); expect(this.rosterview.render).toHaveBeenCalled();
expect(converse.emit).toHaveBeenCalledWith('rosterViewUpdated'); expect(converse.emit).toHaveBeenCalledWith('rosterViewUpdated');
// Check that they are sorted alphabetically // Check that they are sorted alphabetically
t = this.rosterview.$el.find('dt#xmpp-contacts').siblings('dd.current-xmpp-contact.xa').find('a.open-chat').text(); t = this.rosterview.$el.find('dt.roster-group').siblings('dd.current-xmpp-contact.xa').find('a.open-chat').text();
expect(t).toEqual(mock.cur_names.slice(0,i+1).sort().join('')); expect(t).toEqual(mock.cur_names.slice(0,i+1).sort().join(''));
} }
}, converse)); }, converse));
...@@ -334,7 +334,7 @@ ...@@ -334,7 +334,7 @@
expect(this.rosterview.render).toHaveBeenCalled(); expect(this.rosterview.render).toHaveBeenCalled();
expect(converse.emit).toHaveBeenCalledWith('rosterViewUpdated'); expect(converse.emit).toHaveBeenCalledWith('rosterViewUpdated');
// Check that they are sorted alphabetically // Check that they are sorted alphabetically
t = this.rosterview.$el.find('dt#xmpp-contacts').siblings('dd.current-xmpp-contact.unavailable').find('a.open-chat').text(); t = this.rosterview.$el.find('dt.roster-group').siblings('dd.current-xmpp-contact.unavailable').find('a.open-chat').text();
expect(t).toEqual(mock.cur_names.slice(0, i+1).sort().join('')); expect(t).toEqual(mock.cur_names.slice(0, i+1).sort().join(''));
} }
}, converse)); }, converse));
......
src/templates/contacts.html
View file @ 04d2b3ae
<dt id="xmpp-contacts">{{label_contacts}}</dt> <dt class="roster-group">{{label_contacts}}</dt>
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