xmpp.chapril.org-conversejs/src/plugins/controlbox/toggle.js
2020-12-08 09:50:17 +01:00

81 lines
2.2 KiB
JavaScript

import log from "@converse/headless/log";
import tpl_controlbox_toggle from "./templates/toggle.html";
import { View } from "@converse/skeletor/src/view";
import { __ } from '../../i18n';
import { _converse, api, converse } from "@converse/headless/core";
import { addControlBox } from './utils.js';
const u = converse.env.utils;
const ControlBoxToggle = View.extend({
tagName: 'a',
className: 'toggle-controlbox hidden',
id: 'toggle-controlbox',
events: {
'click': 'onClick'
},
attributes: {
'href': "#"
},
initialize () {
_converse.chatboxviews.insertRowColumn(this.render().el);
api.waitUntil('initialized')
.then(this.render.bind(this))
.catch(e => log.fatal(e));
},
render () {
// We let the render method of ControlBoxView decide whether
// the ControlBox or the Toggle must be shown. This prevents
// artifacts (i.e. on page load the toggle is shown only to then
// seconds later be hidden in favor of the controlbox).
this.el.innerHTML = tpl_controlbox_toggle({
'label_toggle': api.connection.connected() ? __('Chat Contacts') : __('Toggle chat')
})
return this;
},
hide (callback) {
if (u.isVisible(this.el)) {
u.hideElement(this.el);
callback();
}
},
show (callback) {
if (!u.isVisible(this.el)) {
u.fadeIn(this.el, callback);
}
},
showControlBox () {
let controlbox = _converse.chatboxes.get('controlbox');
if (!controlbox) {
controlbox = addControlBox();
}
if (api.connection.connected()) {
controlbox.save({'closed': false});
} else {
controlbox.trigger('show');
}
},
onClick (e) {
e.preventDefault();
if (u.isVisible(_converse.root.querySelector("#controlbox"))) {
const controlbox = _converse.chatboxes.get('controlbox');
if (api.connection.connected) {
controlbox.save({closed: true});
} else {
controlbox.trigger('hide');
}
} else {
this.showControlBox();
}
}
});
export default ControlBoxToggle;