|
@@ -18,6 +18,7 @@
|
|
], factory);
|
|
], factory);
|
|
}(this, function (utils, converse, muc, tpl_rooms_list, tpl_rooms_list_item) {
|
|
}(this, function (utils, converse, muc, tpl_rooms_list, tpl_rooms_list_item) {
|
|
const { Backbone, Promise, b64_sha1, sizzle, _ } = converse.env;
|
|
const { Backbone, Promise, b64_sha1, sizzle, _ } = converse.env;
|
|
|
|
+ const u = converse.env.utils;
|
|
|
|
|
|
converse.plugins.add('converse-roomslist', {
|
|
converse.plugins.add('converse-roomslist', {
|
|
|
|
|
|
@@ -42,13 +43,93 @@
|
|
const { _converse } = this,
|
|
const { _converse } = this,
|
|
{ __ } = _converse;
|
|
{ __ } = _converse;
|
|
|
|
|
|
|
|
+
|
|
|
|
+ _converse.OpenRooms = Backbone.Collection.extend({
|
|
|
|
+ comparator (room) {
|
|
|
|
+ if (room.get('bookmarked')) {
|
|
|
|
+ const bookmark = _.head(_converse.bookmarksview.model.where({'jid': room.get('jid')}));
|
|
|
|
+ return bookmark.get('name');
|
|
|
|
+ } else {
|
|
|
|
+ return room.get('name');
|
|
|
|
+ }
|
|
|
|
+ },
|
|
|
|
+
|
|
|
|
+ initialize () {
|
|
|
|
+ this.browserStorage = new Backbone.BrowserStorage[_converse.storage](
|
|
|
|
+ b64_sha1(`converse.open-rooms-{_converse.bare_jid}`));
|
|
|
|
+ _converse.chatboxes.on('add', this.onChatBoxAdded, this);
|
|
|
|
+ _converse.chatboxes.on('change:bookmarked', this.onChatBoxChanged, this);
|
|
|
|
+ _converse.chatboxes.on('change:name', this.onChatBoxChanged, this);
|
|
|
|
+ _converse.chatboxes.on('change:num_unread', this.onChatBoxChanged, this);
|
|
|
|
+ _converse.chatboxes.on('change:num_unread_general', this.onChatBoxChanged, this);
|
|
|
|
+ _converse.chatboxes.on('remove', this.onChatBoxRemoved, this);
|
|
|
|
+ this.reset(_.map(_converse.chatboxes.where({'type': 'chatroom'}), 'attributes'));
|
|
|
|
+ },
|
|
|
|
+
|
|
|
|
+ onChatBoxAdded (item) {
|
|
|
|
+ if (item.get('type') === 'chatroom') {
|
|
|
|
+ this.create(item.attributes);
|
|
|
|
+ }
|
|
|
|
+ },
|
|
|
|
+
|
|
|
|
+ onChatBoxChanged (item) {
|
|
|
|
+ if (item.get('type') === 'chatroom') {
|
|
|
|
+ const room = this.get(item.get('jid'));
|
|
|
|
+ if (!_.isNil(room)) {
|
|
|
|
+ room.set(item.attributes);
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ },
|
|
|
|
+
|
|
|
|
+ onChatBoxRemoved (item) {
|
|
|
|
+ if (item.get('type') === 'chatroom') {
|
|
|
|
+ const room = this.get(item.get('jid'))
|
|
|
|
+ this.remove(room);
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ });
|
|
|
|
+
|
|
|
|
+
|
|
_converse.RoomsList = Backbone.Model.extend({
|
|
_converse.RoomsList = Backbone.Model.extend({
|
|
defaults: {
|
|
defaults: {
|
|
"toggle-state": _converse.OPENED
|
|
"toggle-state": _converse.OPENED
|
|
}
|
|
}
|
|
});
|
|
});
|
|
|
|
|
|
- _converse.RoomsListView = Backbone.NativeView.extend({
|
|
|
|
|
|
+ _converse.RoomsListElementView = Backbone.VDOMView.extend({
|
|
|
|
+ initialize () {
|
|
|
|
+ this.model.on('destroy', this.remove, this);
|
|
|
|
+ this.model.on('remove', this.remove, this);
|
|
|
|
+ this.model.on('change:bookmarked', this.render, this);
|
|
|
|
+ this.model.on('change:name', this.render, this);
|
|
|
|
+ this.model.on('change:num_unread', this.render, this);
|
|
|
|
+ this.model.on('change:num_unread_general', this.render, this);
|
|
|
|
+ },
|
|
|
|
+
|
|
|
|
+ getRoomsListElementName () {
|
|
|
|
+ if (this.model.get('bookmarked')) {
|
|
|
|
+ const bookmark = _.head(_converse.bookmarksview.model.where({'jid': this.model.get('jid')}));
|
|
|
|
+ return bookmark.get('name');
|
|
|
|
+ } else {
|
|
|
|
+ return this.model.get('name');
|
|
|
|
+ }
|
|
|
|
+ },
|
|
|
|
+
|
|
|
|
+ toHTML () {
|
|
|
|
+ return tpl_rooms_list_item(
|
|
|
|
+ _.extend(this.model.toJSON(), {
|
|
|
|
+ 'allow_bookmarks': _converse.allow_bookmarks,
|
|
|
|
+ 'info_leave_room': __('Leave this room'),
|
|
|
|
+ 'info_remove_bookmark': __('Unbookmark this room'),
|
|
|
|
+ 'info_add_bookmark': __('Bookmark this room'),
|
|
|
|
+ 'info_title': __('Show more information on this room'),
|
|
|
|
+ 'name': this.getRoomsListElementName(),
|
|
|
|
+ 'open_title': __('Click to open this room')
|
|
|
|
+ }));
|
|
|
|
+ }
|
|
|
|
+ });
|
|
|
|
+
|
|
|
|
+ _converse.RoomsListView = Backbone.OrderedListView.extend({
|
|
tagName: 'div',
|
|
tagName: 'div',
|
|
className: 'open-rooms-list rooms-list-container',
|
|
className: 'open-rooms-list rooms-list-container',
|
|
events: {
|
|
events: {
|
|
@@ -57,16 +138,15 @@
|
|
'click .open-rooms-toggle': 'toggleRoomsList',
|
|
'click .open-rooms-toggle': 'toggleRoomsList',
|
|
'click .remove-bookmark': 'removeBookmark',
|
|
'click .remove-bookmark': 'removeBookmark',
|
|
},
|
|
},
|
|
|
|
+ listSelector: '.rooms-list',
|
|
|
|
+ ItemView: _converse.RoomsListElementView,
|
|
|
|
+ subviewIndex: 'jid',
|
|
|
|
|
|
initialize () {
|
|
initialize () {
|
|
- this.toggleRoomsList = _.debounce(this.toggleRoomsList, 600, {'leading': true});
|
|
|
|
|
|
+ Backbone.OrderedListView.prototype.initialize.apply(this, arguments);
|
|
|
|
|
|
- this.model.on('add', this.renderRoomsListElement, this);
|
|
|
|
- this.model.on('change:bookmarked', this.renderRoomsListElement, this);
|
|
|
|
- this.model.on('change:name', this.renderRoomsListElement, this);
|
|
|
|
- this.model.on('change:num_unread', this.renderRoomsListElement, this);
|
|
|
|
- this.model.on('change:num_unread_general', this.renderRoomsListElement, this);
|
|
|
|
- this.model.on('remove', this.removeRoomsListElement, this);
|
|
|
|
|
|
+ this.model.on('add', this.showOrHide, this);
|
|
|
|
+ this.model.on('remove', this.showOrHide, this);
|
|
|
|
|
|
const cachekey = `converse.roomslist${_converse.bare_jid}`;
|
|
const cachekey = `converse.roomslist${_converse.bare_jid}`;
|
|
this.list_model = new _converse.RoomsList();
|
|
this.list_model = new _converse.RoomsList();
|
|
@@ -76,6 +156,7 @@
|
|
);
|
|
);
|
|
this.list_model.fetch();
|
|
this.list_model.fetch();
|
|
this.render();
|
|
this.render();
|
|
|
|
+ this.sortAndPositionAllItems();
|
|
},
|
|
},
|
|
|
|
|
|
render () {
|
|
render () {
|
|
@@ -85,13 +166,16 @@
|
|
'desc_rooms': __('Click to toggle the rooms list'),
|
|
'desc_rooms': __('Click to toggle the rooms list'),
|
|
'label_rooms': __('Open Rooms')
|
|
'label_rooms': __('Open Rooms')
|
|
});
|
|
});
|
|
- this.hide();
|
|
|
|
if (this.list_model.get('toggle-state') !== _converse.OPENED) {
|
|
if (this.list_model.get('toggle-state') !== _converse.OPENED) {
|
|
this.el.querySelector('.open-rooms-list').classList.add('collapsed');
|
|
this.el.querySelector('.open-rooms-list').classList.add('collapsed');
|
|
}
|
|
}
|
|
- this.model.each(this.renderRoomsListElement.bind(this));
|
|
|
|
- const controlboxview = _converse.chatboxviews.get('controlbox');
|
|
|
|
|
|
+ this.showOrHide();
|
|
|
|
+ this.insertIntoControlBox();
|
|
|
|
+ return this;
|
|
|
|
+ },
|
|
|
|
|
|
|
|
+ insertIntoControlBox () {
|
|
|
|
+ const controlboxview = _converse.chatboxviews.get('controlbox');
|
|
if (!_.isUndefined(controlboxview) &&
|
|
if (!_.isUndefined(controlboxview) &&
|
|
!document.body.contains(this.el)) {
|
|
!document.body.contains(this.el)) {
|
|
const container = controlboxview.el.querySelector('#chatrooms');
|
|
const container = controlboxview.el.querySelector('#chatrooms');
|
|
@@ -99,15 +183,14 @@
|
|
container.insertBefore(this.el, container.firstChild);
|
|
container.insertBefore(this.el, container.firstChild);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
- return this.el;
|
|
|
|
},
|
|
},
|
|
|
|
|
|
hide () {
|
|
hide () {
|
|
- this.el.classList.add('hidden');
|
|
|
|
|
|
+ u.hideElement(this.el);
|
|
},
|
|
},
|
|
|
|
|
|
show () {
|
|
show () {
|
|
- this.el.classList.remove('hidden');
|
|
|
|
|
|
+ u.showElement(this.el);
|
|
},
|
|
},
|
|
|
|
|
|
closeRoom (ev) {
|
|
closeRoom (ev) {
|
|
@@ -146,6 +229,14 @@
|
|
this.show();
|
|
this.show();
|
|
},
|
|
},
|
|
|
|
|
|
|
|
+ showOrHide (item) {
|
|
|
|
+ if (!this.model.models.length) {
|
|
|
|
+ u.hideElement(this.el);
|
|
|
|
+ } else {
|
|
|
|
+ u.showElement(this.el);
|
|
|
|
+ }
|
|
|
|
+ },
|
|
|
|
+
|
|
removeBookmark: _converse.removeBookmarkViaEvent,
|
|
removeBookmark: _converse.removeBookmarkViaEvent,
|
|
addBookmark: _converse.addBookmarkViaEvent,
|
|
addBookmark: _converse.addBookmarkViaEvent,
|
|
|
|
|
|
@@ -181,7 +272,7 @@
|
|
|
|
|
|
const initRoomsListView = function () {
|
|
const initRoomsListView = function () {
|
|
_converse.rooms_list_view = new _converse.RoomsListView(
|
|
_converse.rooms_list_view = new _converse.RoomsListView(
|
|
- {'model': _converse.chatboxes}
|
|
|
|
|
|
+ {'model': new _converse.OpenRooms() }
|
|
);
|
|
);
|
|
};
|
|
};
|
|
|
|
|