Make the headlines panel an ElementView
Don't manually insert HeadlinesBoxView we'll have to convert it to an ElementView
This commit is contained in:
parent
dea2eea919
commit
7f869ea72d
|
@ -4,18 +4,10 @@
|
|||
* @license Mozilla Public License (MPLv2)
|
||||
*/
|
||||
import '../chatview/index.js';
|
||||
import HeadlinesBoxViewMixin from './view.js';
|
||||
import { HeadlinesPanelMixin, HeadlinesPanel} from './panel.js';
|
||||
import { _converse, api, converse } from '@converse/headless/core';
|
||||
import './view.js';
|
||||
import { HeadlinesPanelMixin, HeadlinesPanel } from './panel.js';
|
||||
import { _converse, converse } from '@converse/headless/core';
|
||||
|
||||
function onChatBoxViewsInitialized () {
|
||||
const views = _converse.chatboxviews;
|
||||
_converse.chatboxes.on('add', item => {
|
||||
if (!views.get(item.get('id')) && item.get('type') === _converse.HEADLINES_TYPE) {
|
||||
views.add(item.get('id'), new _converse.HeadlinesBoxView({ model: item }));
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
converse.plugins.add('converse-headlines-view', {
|
||||
/* Plugin dependencies are other plugins which might be
|
||||
|
@ -30,23 +22,8 @@ converse.plugins.add('converse-headlines-view', {
|
|||
*/
|
||||
dependencies: ['converse-headlines', 'converse-chatview'],
|
||||
|
||||
overrides: {
|
||||
ControlBoxView: {
|
||||
renderControlBoxPane () {
|
||||
this.__super__.renderControlBoxPane.apply(this, arguments);
|
||||
this.renderHeadlinesPanel();
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
initialize () {
|
||||
/* The initialize function gets called as soon as the plugin is
|
||||
* loaded by converse.js's plugin machinery.
|
||||
*/
|
||||
_converse.ControlBoxView && Object.assign(_converse.ControlBoxView.prototype, HeadlinesPanelMixin);
|
||||
_converse.HeadlinesBoxView = _converse.ChatBoxView.extend(HeadlinesBoxViewMixin);
|
||||
_converse.HeadlinesPanel = HeadlinesPanel;
|
||||
|
||||
api.listen.on('chatBoxViewsInitialized', onChatBoxViewsInitialized);
|
||||
}
|
||||
});
|
||||
|
|
|
@ -1,9 +1,7 @@
|
|||
import tpl_headline_panel from './templates/panel.js';
|
||||
import { ElementView } from '@converse/skeletor/src/element.js';
|
||||
import { __ } from 'i18n';
|
||||
import { _converse, api, converse } from '@converse/headless/core';
|
||||
|
||||
const u = converse.env.utils;
|
||||
import { _converse, api } from '@converse/headless/core';
|
||||
|
||||
/**
|
||||
* View which renders headlines section of the control box.
|
||||
|
@ -12,14 +10,12 @@ const u = converse.env.utils;
|
|||
* @memberOf _converse
|
||||
*/
|
||||
export class HeadlinesPanel extends ElementView {
|
||||
tagName = 'div'
|
||||
className = 'controlbox-section'
|
||||
id = 'headline'
|
||||
events = {
|
||||
'click .open-headline': 'openHeadline'
|
||||
}
|
||||
|
||||
initialize () {
|
||||
this.model = _converse.chatboxes;
|
||||
this.listenTo(this.model, 'add', this.renderIfHeadline);
|
||||
this.listenTo(this.model, 'remove', this.renderIfHeadline);
|
||||
this.listenTo(this.model, 'destroy', this.renderIfHeadline);
|
||||
|
@ -47,25 +43,3 @@ export class HeadlinesPanel extends ElementView {
|
|||
}
|
||||
|
||||
api.elements.define('converse-headlines-panel', HeadlinesPanel);
|
||||
|
||||
/**
|
||||
* Mixin for the {@link _converse.ControlBoxView } which add support for
|
||||
* rendering a list of headline chats.
|
||||
* @mixin
|
||||
*/
|
||||
export const HeadlinesPanelMixin = {
|
||||
renderHeadlinesPanel () {
|
||||
if (this.headlinepanel && u.isInDOM(this.headlinepanel.el)) {
|
||||
return this.headlinepanel;
|
||||
}
|
||||
this.headlinepanel = new _converse.HeadlinesPanel({ 'model': _converse.chatboxes });
|
||||
/**
|
||||
* Triggered once the section of the { @link _converse.ControlBoxView }
|
||||
* which shows announcements has been rendered.
|
||||
* @event _converse#headlinesPanelRendered
|
||||
* @example _converse.api.listen.on('headlinesPanelRendered', () => { ... });
|
||||
*/
|
||||
api.trigger('headlinesPanelRendered');
|
||||
return this.headlinepanel;
|
||||
}
|
||||
};
|
||||
|
|
|
@ -3,8 +3,10 @@ import tpl_headline_list from "templates/headline_list.js";
|
|||
|
||||
|
||||
export default (o) => html`
|
||||
<div class="d-flex controlbox-padded ${ o.headlineboxes.length ? '' : 'hidden' }">
|
||||
<span class="w-100 controlbox-heading controlbox-heading--headline">${o.heading_headline}</span>
|
||||
<div class="controlbox-section" id="headline">
|
||||
<div class="d-flex controlbox-padded ${ o.headlineboxes.length ? '' : 'hidden' }">
|
||||
<span class="w-100 controlbox-heading controlbox-heading--headline">${o.heading_headline}</span>
|
||||
</div>
|
||||
</div>
|
||||
${ tpl_headline_list(o) }
|
||||
`;
|
||||
|
|
Reference in New Issue