Move the modal for adding MUCs to its own file

src/converse-muc-views.js

@@ -9,8 +9,8 @@ import "converse-modal";
 import MUCListModal from 'modals/muc-list.js';
 import ModeratorToolsModal from "./modals/moderator-tools.js";
 import RoomDetailsModal from 'modals/muc-details.js';
+import AddMUCModal from 'modals/add-muc.js';
 import log from "@converse/headless/log";
-import tpl_add_chatroom_modal from "templates/add_chatroom_modal.js";
 import tpl_chatroom from "templates/chatroom.js";
 import tpl_chatroom_bottom_panel from "templates/chatroom_bottom_panel.html";
 import tpl_chatroom_destroyed from "templates/chatroom_destroyed.html";
@@ -149,98 +149,6 @@ converse.plugins.add('converse-muc-views', {
             Object.assign(_converse.ControlBoxView.prototype, viewWithRoomsPanel);
         }
 
-        _converse.AddChatRoomModal = BootstrapModal.extend({
-            id: 'add-chatroom-modal',
-
-            events: {
-                'submit form.add-chatroom': 'openChatRoom',
-                'keyup .roomjid-input': 'checkRoomidPolicy',
-                'change .roomjid-input': 'checkRoomidPolicy'
-            },
-
-            initialize () {
-                BootstrapModal.prototype.initialize.apply(this, arguments);
-                this.listenTo(this.model, 'change:muc_domain', this.render);
-                this.muc_roomid_policy_error_msg = null;
-            },
-
-            toHTML () {
-                let placeholder = '';
-                if (!api.settings.get('locked_muc_domain')) {
-                    const muc_domain = this.model.get('muc_domain') || api.settings.get('muc_domain');
-                    placeholder = muc_domain ? `name@${muc_domain}` : __('name@conference.example.org');
-                }
-                return tpl_add_chatroom_modal(Object.assign(this.model.toJSON(), {
-                    '_converse': _converse,
-                    'label_room_address': api.settings.get('muc_domain') ? __('Groupchat name') :  __('Groupchat address'),
-                    'chatroom_placeholder': placeholder,
-                    'muc_roomid_policy_error_msg': this.muc_roomid_policy_error_msg,
-                    'muc_roomid_policy_hint': api.settings.get('muc_roomid_policy_hint')
-                }));
-            },
-
-            afterRender () {
-                this.el.addEventListener('shown.bs.modal', () => {
-                    this.el.querySelector('input[name="chatroom"]').focus();
-                }, false);
-            },
-
-            parseRoomDataFromEvent (form) {
-                const data = new FormData(form);
-                const jid = data.get('chatroom');
-                let nick;
-                if (api.settings.get('locked_muc_nickname')) {
-                    nick = _converse.getDefaultMUCNickname();
-                    if (!nick) {
-                        throw new Error("Using locked_muc_nickname but no nickname found!");
-                    }
-                } else {
-                    nick = data.get('nickname').trim();
-                }
-                return {
-                    'jid': jid,
-                    'nick': nick
-                }
-            },
-
-            openChatRoom (ev) {
-                ev.preventDefault();
-                const data = this.parseRoomDataFromEvent(ev.target);
-                if (data.nick === "") {
-                    // Make sure defaults apply if no nick is provided.
-                    data.nick = undefined;
-                }
-                let jid;
-                if (api.settings.get('locked_muc_domain') || (api.settings.get('muc_domain') && !u.isValidJID(data.jid))) {
-                    jid = `${Strophe.escapeNode(data.jid)}@${api.settings.get('muc_domain')}`;
-                } else {
-                    jid = data.jid
-                    this.model.setDomain(jid);
-                }
-                api.rooms.open(jid, Object.assign(data, {jid}), true);
-                this.modal.hide();
-                ev.target.reset();
-            },
-
-            checkRoomidPolicy () {
-                if (api.settings.get('muc_roomid_policy') && api.settings.get('muc_domain')) {
-                    let jid = this.el.querySelector('.roomjid-input').value;
-                    if (converse.locked_muc_domain || !u.isValidJID(jid)) {
-                        jid = `${Strophe.escapeNode(jid)}@${api.settings.get('muc_domain')}`;
-                    }
-                    const roomid = Strophe.getNodeFromJid(jid);
-                    const roomdomain = Strophe.getDomainFromJid(jid);
-                    if (api.settings.get('muc_domain') !== roomdomain ||
-                        api.settings.get('muc_roomid_policy').test(roomid)) {
-                        this.muc_roomid_policy_error_msg = null;
-                    } else {
-                        this.muc_roomid_policy_error_msg = __('Groupchat id is invalid.');
-                    }
-                    this.render();
-                }
-            }
-        });
-
 
         /**
          * NativeView which renders a groupchat, based upon
@@ -1550,7 +1458,7 @@ converse.plugins.add('converse-muc-views', {
 
             showAddRoomModal (ev) {
                 if (this.add_room_modal === undefined) {
-                    this.add_room_modal = new _converse.AddChatRoomModal({'model': this.model});
+                    this.add_room_modal = new AddMUCModal({'model': this.model});
                 }
                 this.add_room_modal.show(ev);
             },

src/modals/add-muc.js

+import tpl_add_chatroom_modal from "templates/add_chatroom_modal.js";
+import { BootstrapModal } from "../converse-modal.js";
+import { Strophe } from 'strophe.js/src/strophe';
+import { __ } from '@converse/headless/i18n';
+import { _converse, api, converse } from "@converse/headless/converse-core";
+
+const u = converse.env.utils;
+
+
+export default BootstrapModal.extend({
+    id: 'add-chatroom-modal',
+
+    events: {
+        'submit form.add-chatroom': 'openChatRoom',
+        'keyup .roomjid-input': 'checkRoomidPolicy',
+        'change .roomjid-input': 'checkRoomidPolicy'
+    },
+
+    initialize () {
+        BootstrapModal.prototype.initialize.apply(this, arguments);
+        this.listenTo(this.model, 'change:muc_domain', this.render);
+        this.muc_roomid_policy_error_msg = null;
+    },
+
+    toHTML () {
+        let placeholder = '';
+        if (!api.settings.get('locked_muc_domain')) {
+            const muc_domain = this.model.get('muc_domain') || api.settings.get('muc_domain');
+            placeholder = muc_domain ? `name@${muc_domain}` : __('name@conference.example.org');
+        }
+        return tpl_add_chatroom_modal(Object.assign(this.model.toJSON(), {
+            '_converse': _converse,
+            'label_room_address': api.settings.get('muc_domain') ? __('Groupchat name') :  __('Groupchat address'),
+            'chatroom_placeholder': placeholder,
+            'muc_roomid_policy_error_msg': this.muc_roomid_policy_error_msg,
+            'muc_roomid_policy_hint': api.settings.get('muc_roomid_policy_hint')
+        }));
+    },
+
+    afterRender () {
+        this.el.addEventListener('shown.bs.modal', () => {
+            this.el.querySelector('input[name="chatroom"]').focus();
+        }, false);
+    },
+
+    parseRoomDataFromEvent (form) {
+        const data = new FormData(form);
+        const jid = data.get('chatroom');
+        let nick;
+        if (api.settings.get('locked_muc_nickname')) {
+            nick = _converse.getDefaultMUCNickname();
+            if (!nick) {
+                throw new Error("Using locked_muc_nickname but no nickname found!");
+            }
+        } else {
+            nick = data.get('nickname').trim();
+        }
+        return {
+            'jid': jid,
+            'nick': nick
+        }
+    },
+
+    openChatRoom (ev) {
+        ev.preventDefault();
+        const data = this.parseRoomDataFromEvent(ev.target);
+        if (data.nick === "") {
+            // Make sure defaults apply if no nick is provided.
+            data.nick = undefined;
+        }
+        let jid;
+        if (api.settings.get('locked_muc_domain') || (api.settings.get('muc_domain') && !u.isValidJID(data.jid))) {
+            jid = `${Strophe.escapeNode(data.jid)}@${api.settings.get('muc_domain')}`;
+        } else {
+            jid = data.jid
+            this.model.setDomain(jid);
+        }
+        api.rooms.open(jid, Object.assign(data, {jid}), true);
+        this.modal.hide();
+        ev.target.reset();
+    },
+
+    checkRoomidPolicy () {
+        if (api.settings.get('muc_roomid_policy') && api.settings.get('muc_domain')) {
+            let jid = this.el.querySelector('.roomjid-input').value;
+            if (converse.locked_muc_domain || !u.isValidJID(jid)) {
+                jid = `${Strophe.escapeNode(jid)}@${api.settings.get('muc_domain')}`;
+            }
+            const roomid = Strophe.getNodeFromJid(jid);
+            const roomdomain = Strophe.getDomainFromJid(jid);
+            if (api.settings.get('muc_domain') !== roomdomain ||
+                api.settings.get('muc_roomid_policy').test(roomid)) {
+                this.muc_roomid_policy_error_msg = null;
+            } else {
+                this.muc_roomid_policy_error_msg = __('Groupchat id is invalid.');
+            }
+            this.render();
+        }
+    }
+});