Notebook context menu (#2888)

Notebook popup menu fix
Co-authored-by: charlesh88 <charlesh88@gmail.com>
Co-authored-by: Andrew Henry <akhenry@gmail.com>
This commit is contained in:
Nikhil
2020-04-10 15:17:01 -07:00
committed by GitHub
parent 99c095a69f
commit da7b93f9b3
8 changed files with 287 additions and 272 deletions

View File

@ -1,45 +0,0 @@
import $ from 'zepto';
export const togglePopupMenu = (event, openmct) => {
event.preventDefault();
const body = $(document.body);
const container = $(event.target.parentElement.parentElement);
const classList = document.querySelector('body').classList;
const isPhone = Array.from(classList).includes('phone');
const isTablet = Array.from(classList).includes('tablet');
const initiatingEvent = isPhone || isTablet
? 'touchstart'
: 'mousedown';
const menu = container.find('.menu-element');
let dismissExistingMenu;
function dismiss() {
container.find('.hide-menu').append(menu);
body.off(initiatingEvent, menuClickHandler);
dismissExistingMenu = undefined;
}
function menuClickHandler(e) {
window.setTimeout(() => {
dismiss();
}, 100);
}
// Dismiss any menu which was already showing
if (dismissExistingMenu) {
dismissExistingMenu();
}
// ...and record the presence of this menu.
dismissExistingMenu = dismiss;
const popupService = openmct.$injector.get('popupService');
popupService.display(menu, [event.pageX,event.pageY], {
marginX: 0,
marginY: -50
});
body.on(initiatingEvent, menuClickHandler);
}

View File

@ -0,0 +1,36 @@
export default class RemoveDialog {
constructor(openmct, options) {
this.name = options.name;
this.openmct = openmct;
this.callback = options.callback;
this.cssClass = options.cssClass || 'icon-trash';
this.description = options.description || 'Remove action dialog';
this.iconClass = "error";
this.key = 'remove';
this.message = options.message || `This action will permanently ${this.name.toLowerCase()}. Do you wish to continue?`;
}
show() {
const dialog = this.openmct.overlays.dialog({
iconClass: this.iconClass,
message: this.message,
buttons: [
{
label: "Ok",
callback: () => {
this.callback(true);
dialog.dismiss();
}
},
{
label: "Cancel",
callback: () => {
this.callback(false);
dialog.dismiss();
}
}
]
});
}
}