Don't call disco#info for all chatrooms
It's way to inefficient when there are multiple chatrooms. Instead, I added an info icon that can be clicked and which will fetch and display additional info on the chatroom.
This commit is contained in:
parent
1904c62095
commit
7142dc58c7
38
converse.css
38
converse.css
@ -441,7 +441,7 @@ form.search-xmpp-contact input {
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
display: inline-block;
|
||||
width: 160px;
|
||||
width: 170px;
|
||||
}
|
||||
|
||||
#available-chatrooms dt,
|
||||
@ -468,6 +468,38 @@ dd.available-chatroom,
|
||||
text-shadow: 0 1px 0 rgba(250, 250, 250, 1);
|
||||
}
|
||||
|
||||
p.room-info {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
font-size: 11px;
|
||||
font-style: normal;
|
||||
font-weight: normal;
|
||||
display: block;
|
||||
white-space: normal;
|
||||
}
|
||||
|
||||
a.room-info {
|
||||
background: url('images/information.png') no-repeat right top;
|
||||
width: 22px;
|
||||
float: right;
|
||||
display: none;
|
||||
}
|
||||
|
||||
a.open-room {
|
||||
display: inline-block;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
overflow-x: hidden;
|
||||
}
|
||||
|
||||
dd.available-chatroom:hover a.room-info {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
dd.available-chatroom:hover a.open-room {
|
||||
width: 75%;
|
||||
}
|
||||
|
||||
#converse-roster dd a.remove-xmpp-contact {
|
||||
background: url('images/delete_icon.png') no-repeat right top;
|
||||
padding: 0 0 1em 0;
|
||||
@ -477,11 +509,11 @@ dd.available-chatroom,
|
||||
display: none;
|
||||
}
|
||||
|
||||
#converse-roster dd:hover *[class*="remove-xmpp-contact"] {
|
||||
#converse-roster dd:hover a.remove-xmpp-contact {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
#converse-roster dd:hover *[class*="open-chat"] {
|
||||
#converse-roster dd:hover a.open-chat {
|
||||
width: 75%;
|
||||
}
|
||||
|
||||
|
89
converse.js
89
converse.js
@ -684,14 +684,24 @@
|
||||
events: {
|
||||
'submit form.add-chatroom': 'createChatRoom',
|
||||
'click input#show-rooms': 'showRooms',
|
||||
'click a.open-room': 'createChatRoom'
|
||||
'click a.open-room': 'createChatRoom',
|
||||
'click a.room-info': 'showRoomInfo'
|
||||
},
|
||||
room_template: _.template(
|
||||
'<dd class="available-chatroom">' +
|
||||
'<a class="open-room {{classes}}" data-room-jid="{{jid}}"' +
|
||||
' title="{{desc}}"' +
|
||||
' href="#">' +
|
||||
'{{name}}</a> {{occ}}</dd>'),
|
||||
'<dd class="available-chatroom">'+
|
||||
'<a class="open-room" data-room-jid="{{jid}}" title="Click to open this room" href="#">{{name}}</a>'+
|
||||
'<a class="room-info" data-room-jid="{{jid}}" title="Show more information on this room" href="#"> </a>'+
|
||||
'</dd>'),
|
||||
|
||||
room_description_template: _.template(
|
||||
'<div class="room-info">'+
|
||||
'<p class="room-info"><strong>Description:</strong> {{desc}}</p>' +
|
||||
'<p class="room-info"><strong>Occupants:</strong> {{occ}}</p>' +
|
||||
'{[ if (locked) { ]}' +
|
||||
'<p class="room-info locked">Requires authentication</p>' +
|
||||
'{[ } ]}' +
|
||||
'</div>'
|
||||
),
|
||||
|
||||
tab_template: _.template('<li><a class="s" href="#chatrooms">Rooms</a></li>'),
|
||||
|
||||
@ -720,37 +730,23 @@
|
||||
converse.connection.muc.listRooms(
|
||||
this.muc_domain,
|
||||
$.proxy(function (iq) { // Success
|
||||
var name, jid, i, that = this, $available_chatrooms = this.$el.find('#available-chatrooms');
|
||||
this.rdict = {};
|
||||
var name, jid, i, fragment,
|
||||
that = this,
|
||||
$available_chatrooms = this.$el.find('#available-chatrooms');
|
||||
this.rooms = $(iq).find('query').find('item');
|
||||
this.rooms.each(function (i) { that.rdict[$(this).attr('jid')] = this; });
|
||||
this.fragment = document.createDocumentFragment();
|
||||
if (this.rooms.length) {
|
||||
$available_chatrooms.html('<dt>Rooms on '+this.muc_domain+'</dt>');
|
||||
_.each(this.rooms, $.proxy(function (room, idx) {
|
||||
converse.connection.disco.info(
|
||||
$(room).attr('jid'),
|
||||
null,
|
||||
$.proxy(function (stanza) {
|
||||
var name = $(stanza).find('identity').attr('name');
|
||||
var desc = $(stanza).find('field[var="muc#roominfo_description"] value').text();
|
||||
var occ = $(stanza).find('field[var="muc#roominfo_occupants"] value').text();
|
||||
var locked = $(stanza).find('feature[var="muc_passwordprotected"]').length;
|
||||
var jid = $(stanza).attr('from');
|
||||
var classes = locked && 'locked' || '';
|
||||
delete this.rdict[jid];
|
||||
this.$el.find('#available-chatrooms').append(
|
||||
this.room_template({'name':name,
|
||||
'desc':desc,
|
||||
'occ':occ,
|
||||
'jid':jid,
|
||||
'classes': classes
|
||||
}));
|
||||
if (_.keys(this.rdict).length === 0) {
|
||||
$('input#show-rooms').show().siblings('img.spinner').remove();
|
||||
}
|
||||
}, this));
|
||||
}, this));
|
||||
fragment = document.createDocumentFragment();
|
||||
for (i=0; i<this.rooms.length; i++) {
|
||||
name = Strophe.unescapeNode($(this.rooms[i]).attr('name')||$(this.rooms[i]).attr('jid'));
|
||||
jid = $(this.rooms[i]).attr('jid');
|
||||
fragment.appendChild($(this.room_template({
|
||||
'name':name,
|
||||
'jid':jid
|
||||
}))[0]);
|
||||
}
|
||||
$available_chatrooms.append(fragment);
|
||||
$('input#show-rooms').show().siblings('img.spinner').remove();
|
||||
} else {
|
||||
$available_chatrooms.html('<dt>No rooms on '+this.muc_domain+'</dt>');
|
||||
$('input#show-rooms').show().siblings('img.spinner').remove();
|
||||
@ -780,6 +776,31 @@
|
||||
this.updateRoomsList();
|
||||
},
|
||||
|
||||
showRoomInfo: function (ev) {
|
||||
var target = ev.target,
|
||||
$dd = $(target).parent('dd'),
|
||||
$div = $dd.find('div.room-info');
|
||||
if ($div.length) {
|
||||
$div.remove();
|
||||
} else {
|
||||
$dd.append('<img class="spinner" src="images/spinner.gif"/>');
|
||||
converse.connection.disco.info(
|
||||
$(target).attr('data-room-jid'),
|
||||
null,
|
||||
$.proxy(function (stanza) {
|
||||
var desc = $(stanza).find('field[var="muc#roominfo_description"] value').text();
|
||||
var occ = $(stanza).find('field[var="muc#roominfo_occupants"] value').text();
|
||||
var locked = $(stanza).find('feature[var="muc_passwordprotected"]').length;
|
||||
$dd.find('img.spinner').replaceWith(
|
||||
this.room_description_template({
|
||||
'desc':desc,
|
||||
'occ':occ,
|
||||
'locked':locked
|
||||
}));
|
||||
}, this));
|
||||
}
|
||||
},
|
||||
|
||||
createChatRoom: function (ev) {
|
||||
ev.preventDefault();
|
||||
var name, server, jid, $name, $server, errors;
|
||||
|
Loading…
Reference in New Issue
Block a user