Move converse-headlines-view plugin into a folder

src/converse.js

@@ -23,7 +23,7 @@ import "./plugins/fullscreen.js";
 import "./plugins/mam-views.js";
 import "./plugins/minimize.js";             // Allows chat boxes to be minimized
 import "./plugins/muc-views/index.js";            // Views related to MUC
-import "./plugins/headlines-view.js";
+import "./plugins/headlines-view/index.js";
 import "./plugins/notifications.js";
 import "./plugins/omemo.js";
 import "./plugins/profile.js";

src/plugins/headlines-view/index.js

+/**
+ * @module converse-headlines-view
+ * @copyright 2020, the Converse.js contributors
+ * @license Mozilla Public License (MPLv2)
+ */
+import '../chatview/index.js';
+import HeadlinesBoxViewMixin from './view.js';
+import { HeadlinesPanelMixin, HeadlinesPanelView } from './panel.js';
+import { _converse, api, 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
+     * 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 by the bundler
+     */
+    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 = HeadlinesPanelView;
+
+        api.listen.on('chatBoxViewsInitialized', onChatBoxViewsInitialized);
+    }
+});

src/plugins/headlines-view/panel.js

+import tpl_headline_panel from 'templates/headline_panel.js';
+import { View } from '@converse/skeletor/src/view.js';
+import { __ } from 'i18n';
+import { _converse, api, converse } from '@converse/headless/core';
+
+const u = converse.env.utils;
+
+/**
+ * View which renders headlines section of the control box.
+ * @class
+ * @namespace _converse.HeadlinesPanel
+ * @memberOf _converse
+ */
+export const HeadlinesPanelView = View.extend({
+    tagName: 'div',
+    className: 'controlbox-section',
+    id: 'headline',
+
+    events: {
+        'click .open-headline': 'openHeadline'
+    },
+
+    initialize () {
+        this.listenTo(this.model, 'add', this.renderIfHeadline);
+        this.listenTo(this.model, 'remove', this.renderIfHeadline);
+        this.listenTo(this.model, 'destroy', this.renderIfHeadline);
+        this.render();
+        this.insertIntoDOM();
+    },
+
+    toHTML () {
+        return tpl_headline_panel({
+            'heading_headline': __('Announcements'),
+            'headlineboxes': this.model.filter(m => m.get('type') === _converse.HEADLINES_TYPE),
+            'open_title': __('Click to open this server message')
+        });
+    },
+
+    renderIfHeadline (model) {
+        return model && model.get('type') === _converse.HEADLINES_TYPE && this.render();
+    },
+
+    openHeadline (ev) {
+        ev.preventDefault();
+        const jid = ev.target.getAttribute('data-headline-jid');
+        const chat = _converse.chatboxes.get(jid);
+        chat.maybeShow(true);
+    },
+
+    insertIntoDOM () {
+        const view = _converse.chatboxviews.get('controlbox');
+        view && view.el.querySelector('.controlbox-pane').insertAdjacentElement('beforeEnd', this.el);
+    }
+});
+
+/**
+ * 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;
+    }
+};

src/plugins/headlines-view.js → src/plugins/headlines-view/view.js

-/**
- * @module converse-headlines-view
- * @copyright 2020, the Converse.js contributors
- * @license Mozilla Public License (MPLv2)
- */
-import "./chatview/index.js";
-import tpl_chatbox from "../templates/chatbox.js";
-import tpl_headline_panel from "../templates/headline_panel.js";
-import { View } from '@converse/skeletor/src/view.js';
-import { __ } from '../i18n';
-import { _converse, api, converse } from "@converse/headless/core";
-import { render } from "lit-html";
-
-const u = converse.env.utils;
-
+import tpl_chatbox from 'templates/chatbox.js';
+import { __ } from 'i18n';
+import { _converse, api } from '@converse/headless/core';
+import { render } from 'lit-html';
 
 const HeadlinesBoxViewMixin = {
     className: 'chatbox headlines hidden',
@@ -27,7 +16,7 @@ const HeadlinesBoxViewMixin = {
         this.initDebounced();
 
         this.model.disable_mam = true; // Don't do MAM queries for this box
-        this.listenTo(this.model, 'change:hidden', m => m.get('hidden') ? this.hide() : this.show());
+        this.listenTo(this.model, 'change:hidden', m => (m.get('hidden') ? this.hide() : this.show()));
         this.listenTo(this.model, 'destroy', this.remove);
         this.listenTo(this.model, 'show', this.show);
 
@@ -53,7 +42,7 @@ const HeadlinesBoxViewMixin = {
     },
 
     render () {
-        this.el.setAttribute('id', this.model.get('box_id'))
+        this.el.setAttribute('id', this.model.get('box_id'));
         const result = tpl_chatbox(
             Object.assign(this.model.toJSON(), {
                 info_close: '',
@@ -61,8 +50,8 @@ const HeadlinesBoxViewMixin = {
                 show_send_button: false,
                 show_toolbar: false,
                 unread_msgs: ''
-                }
-            ));
+            })
+        );
         render(result, this.el);
         this.content = this.el.querySelector('.chat-content');
         this.msgs_container = this.el.querySelector('.chat-content__messages');
@@ -86,7 +75,7 @@ const HeadlinesBoxViewMixin = {
      */
     getHeadingButtons () {
         const buttons = [];
-        if (!api.settings.get("singleton")) {
+        if (!api.settings.get('singleton')) {
             buttons.push({
                 'a_class': 'close-chatbox-button',
                 'handler': ev => this.close(ev),
@@ -94,7 +83,7 @@ const HeadlinesBoxViewMixin = {
                 'i18n_title': __('Close these announcements'),
                 'icon_class': 'fa-times',
                 'name': 'close',
-                'standalone': api.settings.get("view_mode") === 'overlayed',
+                'standalone': api.settings.get('view_mode') === 'overlayed'
             });
         }
         return _converse.api.hook('getHeadingButtons', this, buttons);
@@ -105,123 +94,4 @@ const HeadlinesBoxViewMixin = {
     'afterShown': function afterShown () {}
 };
 
-
-/**
- * View which renders headlines section of the control box.
- * @class
- * @namespace _converse.HeadlinesPanel
- * @memberOf _converse
- */
-export const HeadlinesPanel = View.extend({
-    tagName: 'div',
-    className: 'controlbox-section',
-    id: 'headline',
-
-    events: {
-        'click .open-headline': 'openHeadline'
-    },
-
-    initialize () {
-        this.listenTo(this.model, 'add', this.renderIfHeadline)
-        this.listenTo(this.model, 'remove', this.renderIfHeadline)
-        this.listenTo(this.model, 'destroy', this.renderIfHeadline)
-        this.render();
-        this.insertIntoDOM();
-    },
-
-    toHTML () {
-        return tpl_headline_panel({
-            'heading_headline': __('Announcements'),
-            'headlineboxes': this.model.filter(m => m.get('type') === _converse.HEADLINES_TYPE),
-            'open_title': __('Click to open this server message'),
-        });
-    },
-
-    renderIfHeadline (model) {
-        return (model && model.get('type') === _converse.HEADLINES_TYPE) && this.render();
-    },
-
-    openHeadline (ev) {
-        ev.preventDefault();
-        const jid = ev.target.getAttribute('data-headline-jid');
-        const chat = _converse.chatboxes.get(jid);
-        chat.maybeShow(true);
-    },
-
-    insertIntoDOM () {
-        const view = _converse.chatboxviews.get('controlbox');
-        view && view.el.querySelector('.controlbox-pane').insertAdjacentElement('beforeEnd', this.el);
-    }
-});
-
-
-converse.plugins.add('converse-headlines-view', {
-    /* 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.
-     */
-    dependencies: ["converse-headlines", "converse-chatview"],
-
-    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.
-
-        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.
-         */
-
-        const viewWithHeadlinesPanel = {
-            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;
-            }
-        }
-
-        if (_converse.ControlBoxView) {
-            Object.assign(_converse.ControlBoxView.prototype, viewWithHeadlinesPanel);
-        }
-
-        _converse.HeadlinesBoxView = _converse.ChatBoxView.extend(HeadlinesBoxViewMixin);
-        _converse.HeadlinesPanel = HeadlinesPanel;
-
-
-        /************************ BEGIN Event Handlers ************************/
-        api.listen.on('chatBoxViewsInitialized', () => {
-            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}));
-                }
-            });
-        });
-    }
-});
+export default HeadlinesBoxViewMixin;