Commit d1d43edf authored by JC Brand's avatar JC Brand

Move MUC views into a new plugin

parent d9709af7
...@@ -76,6 +76,7 @@ require.config({ ...@@ -76,6 +76,7 @@ require.config({
"converse-mam": "src/converse-mam", "converse-mam": "src/converse-mam",
"converse-minimize": "src/converse-minimize", "converse-minimize": "src/converse-minimize",
"converse-muc": "src/converse-muc", "converse-muc": "src/converse-muc",
"converse-muc-views": "src/converse-muc-views",
"converse-muc-embedded": "src/converse-muc-embedded", "converse-muc-embedded": "src/converse-muc-embedded",
"converse-notification": "src/converse-notification", "converse-notification": "src/converse-notification",
"converse-otr": "src/converse-otr", "converse-otr": "src/converse-otr",
......
...@@ -415,21 +415,10 @@ ...@@ -415,21 +415,10 @@
_converse.ChatBoxViews = Backbone.Overview.extend({ _converse.ChatBoxViews = Backbone.Overview.extend({
initialize () {
this.model.on("add", this.onChatBoxAdded, this);
this.model.on("destroy", this.removeChat, this);
this.render();
},
render () {
this.el.innerHTML = tpl_chatboxes();
this.row_el = this.el.querySelector('.row');
},
_ensureElement () { _ensureElement () {
/* Override method from backbone.js /* Override method from backbone.js
* If the #conversejs element doesn't exist, create it. * If the #conversejs element doesn't exist, create it.
*/ */
if (!this.el) { if (!this.el) {
let el = _converse.root.querySelector('#conversejs'); let el = _converse.root.querySelector('#conversejs');
if (_.isNull(el)) { if (_.isNull(el)) {
...@@ -453,6 +442,17 @@ ...@@ -453,6 +442,17 @@
} }
}, },
initialize () {
this.model.on("add", this.onChatBoxAdded, this);
this.model.on("destroy", this.removeChat, this);
this.render();
},
render () {
this.el.innerHTML = tpl_chatboxes();
this.row_el = this.el.querySelector('.row');
},
insertRowColumn (el) { insertRowColumn (el) {
/* Add a new DOM element (likely a chat box) into the /* Add a new DOM element (likely a chat box) into the
* the row managed by this overview. * the row managed by this overview.
...@@ -507,7 +507,13 @@ ...@@ -507,7 +507,13 @@
} }
}); });
// BEGIN: Event handlers // TODO: move to converse-chatboxviews.js and use there in the API
_converse.getViewForChatBox = function (chatbox) {
if (!chatbox) { return; }
return _converse.chatboxviews.get(chatbox.get('id'));
};
/************************ BEGIN Event Handlers ************************/
_converse.api.listen.on('pluginsInitialized', () => { _converse.api.listen.on('pluginsInitialized', () => {
_converse.chatboxes = new _converse.ChatBoxes(); _converse.chatboxes = new _converse.ChatBoxes();
_converse.chatboxviews = new _converse.ChatBoxViews({ _converse.chatboxviews = new _converse.ChatBoxViews({
...@@ -520,33 +526,36 @@ ...@@ -520,33 +526,36 @@
_converse.chatboxes.remove(); // Don't call off(), events won't get re-registered upon reconnect. _converse.chatboxes.remove(); // Don't call off(), events won't get re-registered upon reconnect.
delete _converse.chatboxes.browserStorage; delete _converse.chatboxes.browserStorage;
}); });
// END: Event handlers /************************ END Event Handlers ************************/
_converse.getViewForChatBox = function (chatbox) {
if (!chatbox) { return; }
return _converse.chatboxviews.get(chatbox.get('id'));
};
/* We extend the default converse.js API */ /************************ BEGIN API ************************/
_.extend(_converse.api, { _.extend(_converse.api, {
'chats': { 'chats': {
'open' (jids, attrs) { 'create' (jids, attrs) {
if (_.isUndefined(jids)) { if (_.isUndefined(jids)) {
_converse.log("chats.open: You need to provide at least one JID", Strophe.LogLevel.ERROR); _converse.log("chats.create: You need to provide at least one JID", Strophe.LogLevel.ERROR);
return null; return null;
} else if (_.isString(jids)) { } else if (_.isString(jids)) {
const chatbox = _converse.chatboxes.getChatBox(jids, true, attrs); const chatbox = _converse.chatboxes.getChatBox(jids, attrs, true);
if (_.isNil(chatbox)) { if (_.isNil(chatbox)) {
_converse.log("Could not open chatbox for JID: "+jids); _converse.log("Could not open chatbox for JID: "+jids, Strophe.LogLevel.ERROR);
return; return;
} }
return _converse.getViewForChatBox(chatbox.trigger('show')); return chatbox;
} }
return _.map(jids, (jid) => return _.map(jids, (jid) => _converse.chatboxes.getChatBox(jid, attrs, true).trigger('show'));
_converse.getViewForChatBox( },
_converse.chatboxes.getChatBox(jid, true, attrs).trigger('show') 'open' (jids, attrs) {
) if (_.isUndefined(jids)) {
); _converse.log("chats.open: You need to provide at least one JID", Strophe.LogLevel.ERROR);
return null;
} else if (_.isString(jids)) {
const chatbox = _converse.api.chats.create(jids, attrs);
chatbox.trigger('show');
return chatbox;
}
return _.map(jids, (jid) => _converse.api.chats.create(jid, attrs).trigger('show'));
}, },
'get' (jids) { 'get' (jids) {
if (_.isUndefined(jids)) { if (_.isUndefined(jids)) {
...@@ -555,21 +564,14 @@ ...@@ -555,21 +564,14 @@
// FIXME: Leaky abstraction from MUC. We need to add a // FIXME: Leaky abstraction from MUC. We need to add a
// base type for chat boxes, and check for that. // base type for chat boxes, and check for that.
if (chatbox.get('type') !== 'chatroom') { if (chatbox.get('type') !== 'chatroom') {
result.push(_converse.getViewForChatBox(chatbox)); result.push(chatbox);
} }
}); });
return result; return result;
} else if (_.isString(jids)) { } else if (_.isString(jids)) {
return _converse.getViewForChatBox(_converse.chatboxes.getChatBox(jids)); return _converse.chatboxes.getChatBox(jids);
} }
return _.map(jids, return _.map(jids, _.partial(_converse.chatboxes.getChatBox.bind(_converse.chatboxes), _, {}, true));
_.partial(
_.flow(
_converse.chatboxes.getChatBox.bind(_converse.chatboxes),
_converse.getViewForChatBox.bind(_converse)
), _, true
)
);
} }
} }
}); });
......
...@@ -80,6 +80,7 @@ ...@@ -80,6 +80,7 @@
'converse-minimize', 'converse-minimize',
'converse-muc', 'converse-muc',
'converse-muc-embedded', 'converse-muc-embedded',
'converse-muc-views',
'converse-notification', 'converse-notification',
'converse-otr', 'converse-otr',
'converse-ping', 'converse-ping',
......
This source diff could not be displayed because it is too large. You can view the blob instead.
...@@ -417,156 +417,18 @@ ...@@ -417,156 +417,18 @@
} }
}); });
_converse.ChatRoomView = _converse.ChatBoxView.extend({
/* Backbone.NativeView which renders a chat room, based upon the view
* for normal one-on-one chat boxes.
*/
length: 300,
tagName: 'div',
className: 'chatbox chatroom hidden',
is_chatroom: true,
events: {
'click .close-chatbox-button': 'close',
'click .configure-chatroom-button': 'getAndRenderConfigurationForm',
'click .toggle-smiley': 'toggleEmojiMenu',
'click .toggle-smiley ul.emoji-picker li': 'insertEmoji',
'click .toggle-clear': 'clearChatRoomMessages',
'click .toggle-call': 'toggleCall',
'click .toggle-occupants a': 'toggleOccupants',
'click .new-msgs-indicator': 'viewUnreadMessages',
'click .occupant': 'onOccupantClicked',
'keypress .chat-textarea': 'keyPressed',
'click .send-button': 'onFormSubmitted'
},
initialize () {
this.scrollDown = _.debounce(this._scrollDown, 250);
this.markScrolled = _.debounce(this._markScrolled, 100);
this.model.messages.on('add', this.onMessageAdded, this);
this.model.on('show', this.show, this);
this.model.on('destroy', this.hide, this);
this.model.on('change:connection_status', this.afterConnected, this);
this.model.on('change:affiliation', this.renderHeading, this);
this.model.on('change:chat_state', this.sendChatState, this);
this.model.on('change:description', this.renderHeading, this);
this.model.on('change:name', this.renderHeading, this);
this.createEmojiPicker();
this.createOccupantsView();
this.render().insertIntoDOM();
this.registerHandlers();
if (this.model.get('connection_status') !== converse.ROOMSTATUS.ENTERED) {
const handler = () => {
this.join();
this.fetchMessages();
_converse.emit('chatRoomOpened', this);
}
this.getRoomFeatures().then(handler, handler);
} else {
this.fetchMessages();
_converse.emit('chatRoomOpened', this);
}
},
render () {
this.setClasses();
this.el.setAttribute('id', this.model.get('box_id'));
this.el.innerHTML = tpl_chatroom();
this.renderHeading();
this.renderChatArea();
if (this.model.get('connection_status') !== converse.ROOMSTATUS.ENTERED) {
this.showSpinner();
}
return this;
},
setClasses () {
if (_converse.view_mode === 'fullscreen') {
this.el.classList.add('col-xl-10');
this.el.classList.add('col-md-9');
} else {
this.el.classList.add('col');
this.el.classList.add('col-lg-4');
this.el.classList.add('col-md-6');
this.el.classList.add('col-sm-8');
this.el.classList.add('col-sx-12');
this.el.classList.add('w-100');
}
},
renderHeading () {
/* Render the heading UI of the chat room. */
this.el.querySelector('.chat-head-chatroom').innerHTML = this.generateHeadingHTML();
},
renderChatArea () {
/* Render the UI container in which chat room messages will appear.
*/
if (_.isNull(this.el.querySelector('.chat-area'))) {
const container_el = this.el.querySelector('.chatroom-body');
container_el.innerHTML = tpl_chatarea({
'label_message': __('Message'),
'label_send': __('Send'),
'show_send_button': _converse.show_send_button,
'show_toolbar': _converse.show_toolbar,
'unread_msgs': __('You have unread messages')
});
container_el.insertAdjacentElement('beforeend', this.occupantsview.el);
this.renderToolbar(tpl_chatroom_toolbar);
this.content = this.el.querySelector('.chat-content');
this.toggleOccupants(null, true);
}
return this;
},
createOccupantsView () { _converse.ChatRoomOccupant = Backbone.Model.extend({
/* Create the ChatRoomOccupantsView Backbone.NativeView initialize (attributes) {
*/ this.set(_.extend({
const model = new _converse.ChatRoomOccupants(); 'id': _converse.connection.getUniqueId(),
model.chatroomview = this; }, attributes));
this.occupantsview = new _converse.ChatRoomOccupantsView({'model': model}); }
this.occupantsview.model.on('change:role', this.informOfOccupantsRoleChange, this); });
return this;
},
informOfOccupantsRoleChange (occupant, changed) {
const previous_role = occupant._previousAttributes.role;
if (previous_role === 'moderator') {
this.showStatusNotification(
__("%1$s is no longer a moderator.", occupant.get('nick')),
false, true)
}
if (previous_role === 'visitor') {
this.showStatusNotification(
__("%1$s has been given a voice again.", occupant.get('nick')),
false, true)
}
if (occupant.get('role') === 'visitor') {
this.showStatusNotification(
__("%1$s has been muted.", occupant.get('nick')),
false, true)
}
if (occupant.get('role') === 'moderator') {
this.showStatusNotification(
__("%1$s is now a moderator.", occupant.get('nick')),
false, true)
}
},
generateHeadingHTML () { _converse.ChatRoomOccupants = Backbone.Collection.extend({
/* Returns the heading HTML to be rendered. model: _converse.ChatRoomOccupant,
*/
return tpl_chatroom_head(
_.extend(this.model.toJSON(), {
Strophe: Strophe,
info_close: __('Close and leave this room'),
info_configure: __('Configure this room'),
description: this.model.get('description') || ''
}));
},
afterShown (focus) { afterShown (focus) {
/* Override from converse-chatview, specifically to avoid /* Override from converse-chatview, specifically to avoid
......
...@@ -13,6 +13,7 @@ if (typeof define !== 'undefined') { ...@@ -13,6 +13,7 @@ if (typeof define !== 'undefined') {
"converse-roomslist", // Show currently open chat rooms "converse-roomslist", // Show currently open chat rooms
"converse-mam", // XEP-0313 Message Archive Management "converse-mam", // XEP-0313 Message Archive Management
"converse-muc", // XEP-0045 Multi-user chat "converse-muc", // XEP-0045 Multi-user chat
"converse-muc-views", // Views related to MUC
"converse-muc-embedded", "converse-muc-embedded",
"converse-vcard", // XEP-0054 VCard-temp "converse-vcard", // XEP-0054 VCard-temp
"converse-otr", // Off-the-record encryption for one-on-one messages "converse-otr", // Off-the-record encryption for one-on-one messages
......
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