toggle popup menu
This commit is contained in:
parent
59a92bdf97
commit
18407e17a8
2 changed files with 38 additions and 26 deletions
|
@ -60,14 +60,21 @@ export class Popup {
|
|||
}, 10);
|
||||
}
|
||||
|
||||
get isOpen() {
|
||||
return !!this._view;
|
||||
}
|
||||
|
||||
close() {
|
||||
this._view.unmount();
|
||||
this._trackingTemplateView.removeSubView(this);
|
||||
if (this._scroller) {
|
||||
document.body.removeEventListener("scroll", this, true);
|
||||
if (this._view) {
|
||||
this._view.unmount();
|
||||
this._trackingTemplateView.removeSubView(this);
|
||||
if (this._scroller) {
|
||||
document.body.removeEventListener("scroll", this, true);
|
||||
}
|
||||
document.body.removeEventListener("click", this, false);
|
||||
this._popup.remove();
|
||||
this._view = null;
|
||||
}
|
||||
document.body.removeEventListener("click", this, false);
|
||||
this._popup.remove();
|
||||
}
|
||||
|
||||
get _popup() {
|
||||
|
|
|
@ -22,6 +22,7 @@ export class MessageComposer extends TemplateView {
|
|||
constructor(viewModel) {
|
||||
super(viewModel);
|
||||
this._input = null;
|
||||
this._attachmentPopup = null;
|
||||
}
|
||||
|
||||
render(t, vm) {
|
||||
|
@ -35,7 +36,7 @@ export class MessageComposer extends TemplateView {
|
|||
t.button({
|
||||
className: "sendFile",
|
||||
title: vm.i18n`Pick attachment`,
|
||||
onClick: evt => this._showAttachmentMenu(evt),
|
||||
onClick: evt => this._toggleAttachmentMenu(evt),
|
||||
}, vm.i18n`Send file`),
|
||||
t.button({
|
||||
className: "send",
|
||||
|
@ -59,24 +60,28 @@ export class MessageComposer extends TemplateView {
|
|||
}
|
||||
}
|
||||
|
||||
_showAttachmentMenu(evt) {
|
||||
const vm = this.value;
|
||||
const popup = new Popup(new Menu([
|
||||
Menu.option(vm.i18n`Send picture`, () => vm.sendPicture()).setIcon("picture"),
|
||||
Menu.option(vm.i18n`Send file`, () => vm.sendFile()).setIcon("file"),
|
||||
]));
|
||||
popup.trackInTemplateView(this);
|
||||
popup.showRelativeTo(evt.target, {
|
||||
horizontal: {
|
||||
relativeTo: "end",
|
||||
align: "start",
|
||||
after: 0
|
||||
},
|
||||
vertical: {
|
||||
relativeTo: "end",
|
||||
align: "start",
|
||||
before: 8,
|
||||
}
|
||||
});
|
||||
_toggleAttachmentMenu(evt) {
|
||||
if (this._attachmentPopup && this._attachmentPopup.isOpen) {
|
||||
this._attachmentPopup.close();
|
||||
} else {
|
||||
const vm = this.value;
|
||||
this._attachmentPopup = new Popup(new Menu([
|
||||
Menu.option(vm.i18n`Send picture`, () => vm.sendPicture()).setIcon("picture"),
|
||||
Menu.option(vm.i18n`Send file`, () => vm.sendFile()).setIcon("file"),
|
||||
]));
|
||||
this._attachmentPopup.trackInTemplateView(this);
|
||||
this._attachmentPopup.showRelativeTo(evt.target, {
|
||||
horizontal: {
|
||||
relativeTo: "end",
|
||||
align: "start",
|
||||
after: 0
|
||||
},
|
||||
vertical: {
|
||||
relativeTo: "end",
|
||||
align: "start",
|
||||
before: 8,
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
Reference in a new issue