2019-07-11 10:48:52 +02:00
|
|
|
/**
|
2019-11-22 14:38:09 +01:00
|
|
|
* @module converse-headlines
|
2020-01-26 16:21:20 +01:00
|
|
|
* @copyright 2020, the Converse.js contributors
|
2019-09-19 16:54:55 +02:00
|
|
|
* @description XEP-0045 Multi-User Chat Views
|
2019-07-11 10:48:52 +02:00
|
|
|
*/
|
2018-10-23 03:41:38 +02:00
|
|
|
import "converse-chatview";
|
|
|
|
import converse from "@converse/headless/converse-core";
|
2019-09-19 16:54:55 +02:00
|
|
|
import { View } from "skeletor.js/src/view";
|
2019-11-01 16:04:55 +01:00
|
|
|
import { isString } from "lodash";
|
2020-01-22 09:22:38 +01:00
|
|
|
import tpl_headline_list from "templates/headline_list.html";
|
|
|
|
import tpl_headline_panel from "templates/headline_panel.html";
|
2018-10-23 03:41:38 +02:00
|
|
|
|
2019-09-19 16:54:55 +02:00
|
|
|
const u = converse.env.utils;
|
2018-10-23 03:41:38 +02:00
|
|
|
|
|
|
|
|
2019-11-01 16:04:55 +01:00
|
|
|
converse.plugins.add('converse-headlines', {
|
2018-10-23 03:41:38 +02:00
|
|
|
/* Plugin dependencies are other plugins which might be
|
|
|
|
* overridden or relied upon, and therefore need to be loaded before
|
|
|
|
* this plugin.
|
|
|
|
*
|
|
|
|
* If the setting "strict_plugin_dependencies" is set to true,
|
|
|
|
* an error will be raised if the plugin is not found. By default it's
|
|
|
|
* false, which means these plugins are only loaded opportunistically.
|
|
|
|
*
|
|
|
|
* NB: These plugins need to have already been loaded via require.js.
|
|
|
|
*/
|
2019-11-01 16:04:55 +01:00
|
|
|
dependencies: ["converse-chat"],
|
2018-10-23 03:41:38 +02:00
|
|
|
|
|
|
|
overrides: {
|
|
|
|
// Overrides mentioned here will be picked up by converse.js's
|
|
|
|
// plugin architecture they will replace existing methods on the
|
|
|
|
// relevant objects or classes.
|
|
|
|
//
|
|
|
|
// New functions which don't exist yet can also be added.
|
|
|
|
|
|
|
|
ChatBoxes: {
|
|
|
|
model (attrs, options) {
|
|
|
|
const { _converse } = this.__super__;
|
|
|
|
if (attrs.type == _converse.HEADLINES_TYPE) {
|
|
|
|
return new _converse.HeadlinesBox(attrs, options);
|
|
|
|
} else {
|
|
|
|
return this.__super__.model.apply(this, arguments);
|
|
|
|
}
|
|
|
|
},
|
2020-01-22 09:22:38 +01:00
|
|
|
},
|
|
|
|
ControlBoxView: {
|
|
|
|
renderControlBoxPane () {
|
|
|
|
this.__super__.renderControlBoxPane.apply(this, arguments);
|
|
|
|
this.renderHeadlinePanel();
|
|
|
|
},
|
|
|
|
},
|
2018-10-23 03:41:38 +02:00
|
|
|
},
|
2017-12-06 22:10:21 +01:00
|
|
|
|
2016-03-20 00:03:00 +01:00
|
|
|
|
2018-10-23 03:41:38 +02:00
|
|
|
initialize () {
|
|
|
|
/* The initialize function gets called as soon as the plugin is
|
|
|
|
* loaded by converse.js's plugin machinery.
|
|
|
|
*/
|
2020-01-22 09:22:38 +01:00
|
|
|
const { _converse } = this,
|
|
|
|
{ __ } = _converse;
|
|
|
|
|
|
|
|
const viewWithHeadlinePanel = {
|
|
|
|
renderHeadlinePanel () {
|
2019-09-19 16:54:55 +02:00
|
|
|
if (this.headlinepanel && u.isInDOM(this.headlinepanel.el)) {
|
2020-01-22 09:22:38 +01:00
|
|
|
return this.headlinepanel;
|
|
|
|
}
|
|
|
|
this.headlinepanel = new _converse.HeadlinePanel();
|
|
|
|
this.el.querySelector('.controlbox-pane').insertAdjacentElement(
|
|
|
|
'beforeEnd', this.headlinepanel.render().el);
|
|
|
|
|
|
|
|
return this.headlinepanel;
|
|
|
|
},
|
|
|
|
|
|
|
|
getHeadlinePanel () {
|
2019-09-19 16:54:55 +02:00
|
|
|
if (this.headlinepanel && u.isInDOM(this.headlinepanel.el)) {
|
2020-01-22 09:22:38 +01:00
|
|
|
return this.headlinepanel;
|
|
|
|
} else {
|
|
|
|
return this.renderHeadlinePanel();
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
if (_converse.ControlBoxView) {
|
|
|
|
Object.assign(_converse.ControlBoxView.prototype, viewWithHeadlinePanel);
|
|
|
|
}
|
2018-10-23 03:41:38 +02:00
|
|
|
|
2020-01-22 14:27:08 +01:00
|
|
|
/**
|
|
|
|
* Shows headline messages
|
|
|
|
* @class
|
|
|
|
* @namespace _converse.HeadlinesBox
|
|
|
|
* @memberOf _converse
|
|
|
|
*/
|
2018-10-23 03:41:38 +02:00
|
|
|
_converse.HeadlinesBox = _converse.ChatBox.extend({
|
2019-04-17 11:52:41 +02:00
|
|
|
defaults () {
|
|
|
|
return {
|
|
|
|
'bookmarked': false,
|
2019-10-09 16:01:38 +02:00
|
|
|
'hidden': ['mobile', 'fullscreen'].includes(_converse.view_mode),
|
2019-04-17 11:52:41 +02:00
|
|
|
'message_type': 'headline',
|
|
|
|
'num_unread': 0,
|
2019-05-05 19:05:45 +02:00
|
|
|
'time_opened': this.get('time_opened') || (new Date()).getTime(),
|
2019-04-17 11:52:41 +02:00
|
|
|
'type': _converse.HEADLINES_TYPE
|
|
|
|
}
|
2018-10-23 03:41:38 +02:00
|
|
|
},
|
2019-04-17 11:52:41 +02:00
|
|
|
|
|
|
|
initialize () {
|
|
|
|
this.initMessages();
|
|
|
|
this.set({'box_id': `box-${btoa(this.get('jid'))}`});
|
2020-01-22 14:27:08 +01:00
|
|
|
/**
|
|
|
|
* Triggered once a {@link _converse.HeadlinesBox} has been created and initialized.
|
|
|
|
* @event _converse#headlinesBoxInitialized
|
|
|
|
* @type { _converse.HeadlinesBox }
|
|
|
|
* @example _converse.api.listen.on('headlinesBoxInitialized', model => { ... });
|
|
|
|
*/
|
|
|
|
_converse.api.trigger('headlinesBoxInitialized', this);
|
2019-04-17 11:52:41 +02:00
|
|
|
}
|
2018-10-23 03:41:38 +02:00
|
|
|
});
|
|
|
|
|
2020-01-22 09:22:38 +01:00
|
|
|
function getAllHeadlineBoxes (removedBox = null) {
|
|
|
|
const chatboxviews = _converse.chatboxviews.getAll();
|
|
|
|
return Object.keys(chatboxviews)
|
|
|
|
.filter(
|
|
|
|
id => chatboxviews[id].el.classList.contains('headlines') &&
|
|
|
|
id !== removedBox
|
|
|
|
);
|
|
|
|
}
|
|
|
|
|
|
|
|
function renderHeadlineList (removedBox = null) {
|
|
|
|
const controlboxview = _converse.chatboxviews.get('controlbox');
|
|
|
|
if (controlboxview !== undefined) {
|
|
|
|
const el = controlboxview.el.querySelector('.list-container--headline');
|
|
|
|
const headline_list = tpl_headline_list({
|
|
|
|
'headlineboxes': getAllHeadlineBoxes(removedBox),
|
|
|
|
'open_title': __('Click to open this server message'),
|
|
|
|
});
|
|
|
|
el && (el.outerHTML = headline_list);
|
|
|
|
}
|
|
|
|
}
|
2018-10-23 03:41:38 +02:00
|
|
|
|
2019-01-25 11:53:07 +01:00
|
|
|
async function onHeadlineMessage (message) {
|
2019-11-01 16:04:55 +01:00
|
|
|
// Handler method for all incoming messages of type "headline".
|
2019-09-19 16:54:55 +02:00
|
|
|
if (u.isHeadlineMessage(_converse, message)) {
|
2019-01-25 11:53:07 +01:00
|
|
|
const from_jid = message.getAttribute('from');
|
2019-10-09 16:01:38 +02:00
|
|
|
if (from_jid.includes('@') &&
|
2019-04-17 11:52:41 +02:00
|
|
|
!_converse.roster.get(from_jid) &&
|
2018-10-23 03:41:38 +02:00
|
|
|
!_converse.allow_non_roster_messaging) {
|
|
|
|
return;
|
|
|
|
}
|
2019-10-09 16:01:38 +02:00
|
|
|
if (message.querySelector('body') === null) {
|
|
|
|
// Avoid creating a chat box if we have nothing to show inside it.
|
2018-10-23 03:41:38 +02:00
|
|
|
return;
|
2016-12-20 11:42:20 +01:00
|
|
|
}
|
2018-10-23 03:41:38 +02:00
|
|
|
const chatbox = _converse.chatboxes.create({
|
|
|
|
'id': from_jid,
|
|
|
|
'jid': from_jid,
|
|
|
|
'type': _converse.HEADLINES_TYPE,
|
|
|
|
'from': from_jid
|
|
|
|
});
|
2019-01-25 11:53:07 +01:00
|
|
|
const attrs = await chatbox.getMessageAttributesFromStanza(message, message);
|
|
|
|
await chatbox.messages.create(attrs);
|
2019-03-29 21:10:45 +01:00
|
|
|
_converse.api.trigger('message', {'chatbox': chatbox, 'stanza': message});
|
2020-01-22 09:22:38 +01:00
|
|
|
renderHeadlineList();
|
|
|
|
_converse.chatboxviews.get(from_jid).el
|
|
|
|
.querySelector('.close-chatbox-button')
|
|
|
|
.addEventListener("click",
|
|
|
|
() => renderHeadlineList(from_jid)
|
|
|
|
);
|
2017-06-12 20:30:58 +02:00
|
|
|
}
|
2018-10-23 03:41:38 +02:00
|
|
|
}
|
2016-12-20 11:42:20 +01:00
|
|
|
|
2020-01-22 09:22:38 +01:00
|
|
|
/**
|
2019-09-19 16:54:55 +02:00
|
|
|
* View which renders headlines section of the control box.
|
2020-01-22 09:22:38 +01:00
|
|
|
* @class
|
|
|
|
* @namespace _converse.HeadlinePanel
|
|
|
|
* @memberOf _converse
|
|
|
|
*/
|
2019-09-19 16:54:55 +02:00
|
|
|
_converse.HeadlinePanel = View.extend({
|
2020-01-22 09:22:38 +01:00
|
|
|
tagName: 'div',
|
|
|
|
className: 'controlbox-section',
|
|
|
|
id: 'headline',
|
|
|
|
|
|
|
|
events: {
|
|
|
|
'click .open-headline': 'openHeadline'
|
|
|
|
},
|
|
|
|
|
|
|
|
openHeadline (ev) {
|
|
|
|
ev.preventDefault();
|
|
|
|
const jid = ev.target.getAttribute('data-headline-jid');
|
|
|
|
const chat = _converse.chatboxes.get(jid);
|
|
|
|
chat.maybeShow(true);
|
|
|
|
},
|
|
|
|
|
|
|
|
render () {
|
|
|
|
this.el.innerHTML = tpl_headline_panel({
|
2019-09-19 16:54:55 +02:00
|
|
|
'heading_headline': __('Announcements')
|
2020-01-22 09:22:38 +01:00
|
|
|
});
|
|
|
|
return this;
|
|
|
|
}
|
|
|
|
});
|
|
|
|
|
2019-11-01 16:04:55 +01:00
|
|
|
|
|
|
|
/************************ BEGIN Event Handlers ************************/
|
2018-10-23 03:41:38 +02:00
|
|
|
function registerHeadlineHandler () {
|
2019-01-25 11:53:07 +01:00
|
|
|
_converse.connection.addHandler(message => {
|
|
|
|
onHeadlineMessage(message);
|
|
|
|
return true
|
|
|
|
}, null, 'message');
|
2018-10-23 03:41:38 +02:00
|
|
|
}
|
2019-03-29 14:15:03 +01:00
|
|
|
_converse.api.listen.on('connected', registerHeadlineHandler);
|
|
|
|
_converse.api.listen.on('reconnected', registerHeadlineHandler);
|
2019-11-01 16:04:55 +01:00
|
|
|
/************************ END Event Handlers ************************/
|
|
|
|
|
|
|
|
|
|
|
|
/************************ BEGIN API ************************/
|
|
|
|
Object.assign(_converse.api, {
|
|
|
|
/**
|
|
|
|
* The "headlines" namespace, which is used for headline-channels
|
|
|
|
* which are read-only channels containing messages of type
|
|
|
|
* "headline".
|
|
|
|
*
|
|
|
|
* @namespace _converse.api.headlines
|
|
|
|
* @memberOf _converse.api
|
|
|
|
*/
|
|
|
|
headlines: {
|
|
|
|
/**
|
|
|
|
* Retrieves a headline-channel or all headline-channels.
|
|
|
|
*
|
|
|
|
* @method _converse.api.headlines.get
|
|
|
|
* @param {String|String[]} jids - e.g. 'buddy@example.com' or ['buddy1@example.com', 'buddy2@example.com']
|
|
|
|
* @param {Object} [attrs] - Attributes to be set on the _converse.ChatBox model.
|
|
|
|
* @param {Boolean} [create=false] - Whether the chat should be created if it's not found.
|
|
|
|
* @returns { Promise<_converse.HeadlinesBox> }
|
|
|
|
*/
|
|
|
|
async get (jids, attrs={}, create=false) {
|
|
|
|
async function _get (jid) {
|
|
|
|
let model = await _converse.api.chatboxes.get(jid);
|
|
|
|
if (!model && create) {
|
|
|
|
model = await _converse.api.chatboxes.create(jid, attrs, _converse.HeadlinesBox);
|
|
|
|
} else {
|
|
|
|
model = (model && model.get('type') === _converse.HEADLINES_TYPE) ? model : null;
|
|
|
|
if (model && Object.keys(attrs).length) {
|
|
|
|
model.save(attrs);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
return model;
|
|
|
|
}
|
|
|
|
if (jids === undefined) {
|
|
|
|
const chats = await _converse.api.chatboxes.get();
|
|
|
|
return chats.filter(c => (c.get('type') === _converse.HEADLINES_TYPE));
|
|
|
|
} else if (isString(jids)) {
|
|
|
|
return _get(jids);
|
|
|
|
}
|
|
|
|
return Promise.all(jids.map(jid => _get(jid)));
|
2018-10-23 03:41:38 +02:00
|
|
|
}
|
2019-11-01 16:04:55 +01:00
|
|
|
}
|
2018-10-23 03:41:38 +02:00
|
|
|
});
|
2019-11-01 16:04:55 +01:00
|
|
|
/************************ END API ************************/
|
2018-10-23 03:41:38 +02:00
|
|
|
}
|
|
|
|
});
|