2023-02-15 14:19:48 +01:00
|
|
|
import tplBackgroundLogo from '../../templates/background_logo.js';
|
|
|
|
import tplChats from './templates/chats.js';
|
2021-09-24 10:32:33 +02:00
|
|
|
import { CustomElement } from 'shared/components/element.js';
|
2020-12-08 12:54:14 +01:00
|
|
|
import { api, _converse } from '@converse/headless/core';
|
2021-09-24 10:32:33 +02:00
|
|
|
import { getAppSettings } from '@converse/headless/shared/settings/utils.js';
|
2021-04-14 22:56:59 +02:00
|
|
|
import { render } from 'lit';
|
2020-12-08 10:16:34 +01:00
|
|
|
|
|
|
|
|
2021-09-24 10:32:33 +02:00
|
|
|
class ConverseChats extends CustomElement {
|
2020-12-08 10:16:34 +01:00
|
|
|
|
|
|
|
initialize () {
|
2020-12-08 12:54:14 +01:00
|
|
|
this.model = _converse.chatboxes;
|
2021-09-24 10:32:33 +02:00
|
|
|
this.listenTo(this.model, 'add', () => this.requestUpdate());
|
|
|
|
this.listenTo(this.model, 'change:closed', () => this.requestUpdate());
|
|
|
|
this.listenTo(this.model, 'change:hidden', () => this.requestUpdate());
|
|
|
|
this.listenTo(this.model, 'change:jid', () => this.requestUpdate());
|
|
|
|
this.listenTo(this.model, 'change:minimized', () => this.requestUpdate());
|
|
|
|
this.listenTo(this.model, 'destroy', () => this.requestUpdate());
|
2020-12-08 12:54:14 +01:00
|
|
|
|
2021-02-10 11:37:48 +01:00
|
|
|
// Use listenTo instead of api.listen.to so that event handlers
|
|
|
|
// automatically get deregistered when the component is dismounted
|
2021-09-24 10:32:33 +02:00
|
|
|
this.listenTo(_converse, 'connected', () => this.requestUpdate());
|
|
|
|
this.listenTo(_converse, 'reconnected', () => this.requestUpdate());
|
|
|
|
this.listenTo(_converse, 'disconnected', () => this.requestUpdate());
|
|
|
|
|
|
|
|
const settings = getAppSettings();
|
|
|
|
this.listenTo(settings, 'change:view_mode', () => this.requestUpdate())
|
|
|
|
this.listenTo(settings, 'change:singleton', () => this.requestUpdate())
|
2021-02-10 11:37:48 +01:00
|
|
|
|
2020-12-08 10:16:34 +01:00
|
|
|
const bg = document.getElementById('conversejs-bg');
|
|
|
|
if (bg && !bg.innerHTML.trim()) {
|
2023-02-15 14:19:48 +01:00
|
|
|
render(tplBackgroundLogo(), bg);
|
2020-12-08 10:16:34 +01:00
|
|
|
}
|
|
|
|
const body = document.querySelector('body');
|
|
|
|
body.classList.add(`converse-${api.settings.get('view_mode')}`);
|
|
|
|
|
2020-12-08 12:54:14 +01:00
|
|
|
/**
|
|
|
|
* Triggered once the _converse.ChatBoxViews view-colleciton has been initialized
|
|
|
|
* @event _converse#chatBoxViewsInitialized
|
|
|
|
* @example _converse.api.listen.on('chatBoxViewsInitialized', () => { ... });
|
|
|
|
*/
|
|
|
|
api.trigger('chatBoxViewsInitialized');
|
|
|
|
}
|
2020-12-08 10:16:34 +01:00
|
|
|
|
2021-09-24 10:32:33 +02:00
|
|
|
render () { // eslint-disable-line class-methods-use-this
|
2023-02-15 14:19:48 +01:00
|
|
|
return tplChats();
|
2020-12-08 10:16:34 +01:00
|
|
|
}
|
2020-12-08 12:54:14 +01:00
|
|
|
}
|
2020-12-08 10:16:34 +01:00
|
|
|
|
2020-12-08 12:54:14 +01:00
|
|
|
api.elements.define('converse-chats', ConverseChats);
|