|
@@ -2,42 +2,37 @@ import BootstrapModal from "plugins/modal/base.js";
|
|
|
import tpl_occupant_modal from "./templates/occupant.js";
|
|
|
import { _converse, api } from "@converse/headless/core";
|
|
|
|
|
|
+import './modals.scss';
|
|
|
+
|
|
|
|
|
|
const OccupantModal = BootstrapModal.extend({
|
|
|
+ id: "muc-occupant",
|
|
|
|
|
|
initialize () {
|
|
|
BootstrapModal.prototype.initialize.apply(this, arguments);
|
|
|
- this.listenTo(this.model, 'change', this.render);
|
|
|
+ if (this.model) {
|
|
|
+ this.listenTo(this.model, 'change', this.render);
|
|
|
+ }
|
|
|
/**
|
|
|
* Triggered once the OccupantModal has been initialized
|
|
|
- * @event _converse#userDetailsModalInitialized
|
|
|
- * @type { _converse.ChatBox }
|
|
|
- * @example _converse.api.listen.on('userDetailsModalInitialized', chatbox => { ... });
|
|
|
+ * @event _converse#occupantModalInitialized
|
|
|
+ * @type { Object }
|
|
|
+ * @example _converse.api.listen.on('occupantModalInitialized', data);
|
|
|
*/
|
|
|
- api.trigger('occupantModalInitialized', this.model);
|
|
|
+ api.trigger('occupantModalInitialized', { 'model': this.model, 'message': this.message });
|
|
|
},
|
|
|
|
|
|
toHTML () {
|
|
|
- return tpl_occupant_modal(Object.assign(
|
|
|
- this.model.toJSON(),
|
|
|
- {
|
|
|
- 'avatar_data': this.getAvatarData(),
|
|
|
- 'display_name': this.model.getDisplayName()
|
|
|
- }
|
|
|
- ));
|
|
|
- },
|
|
|
-
|
|
|
- getAvatarData () {
|
|
|
- const vcard = _converse.vcards.findWhere({'jid': this.model.get('jid')});
|
|
|
- const image_type = vcard?.get('image_type') || _converse.DEFAULT_IMAGE_TYPE;
|
|
|
- const image_data = vcard?.get('image') || _converse.DEFAULT_IMAGE;
|
|
|
- const image = "data:" + image_type + ";base64," + image_data;
|
|
|
- return {
|
|
|
- 'classes': 'chat-msg__avatar',
|
|
|
- 'height': 120,
|
|
|
- 'width': 120,
|
|
|
- image,
|
|
|
- };
|
|
|
+ const model = this.model ?? this.message;
|
|
|
+ const jid = model?.get('jid');
|
|
|
+ const vcard = _converse.vcards.findWhere({ jid });
|
|
|
+ const display_name = model?.getDisplayName();
|
|
|
+ const nick = model.get('nick');
|
|
|
+ const occupant_id = model.get('occupant_id');
|
|
|
+ const role = this.model?.get('role');
|
|
|
+ const affiliation = this.model?.get('affiliation');
|
|
|
+ const hats = this.model?.get('hats')?.length ? this.model.get('hats') : null;
|
|
|
+ return tpl_occupant_modal({ jid, vcard, display_name, nick, occupant_id, role, affiliation, hats });
|
|
|
}
|
|
|
});
|
|
|
|