81 lines
2.2 KiB
JavaScript
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;
|