From 7cd8a5a2b230ac78c12cc40bddab10dcf9fce59f Mon Sep 17 00:00:00 2001
From: Michael Telatynski <7t3chguy@gmail.com>
Date: Wed, 20 Jun 2018 18:01:37 +0100
Subject: [PATCH] allow chaining right click contextmenus
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
---
src/components/structures/ContextualMenu.js | 26 +++++++++++++++++++--
1 file changed, 24 insertions(+), 2 deletions(-)
diff --git a/src/components/structures/ContextualMenu.js b/src/components/structures/ContextualMenu.js
index 91ec312f43..e5b3bd0b71 100644
--- a/src/components/structures/ContextualMenu.js
+++ b/src/components/structures/ContextualMenu.js
@@ -64,7 +64,9 @@ export default class ContextualMenu extends React.Component {
// The component to render as the context menu
elementClass: PropTypes.element.isRequired,
// on resize callback
- windowResize: PropTypes.func
+ windowResize: PropTypes.func,
+ // method to close menu
+ closeMenu: PropTypes.func,
};
constructor() {
@@ -73,6 +75,7 @@ export default class ContextualMenu extends React.Component {
contextMenuRect: null,
};
+ this.onContextMenu = this.onContextMenu.bind(this);
this.collectContextMenuRect = this.collectContextMenuRect.bind(this);
}
@@ -85,6 +88,25 @@ export default class ContextualMenu extends React.Component {
});
}
+ onContextMenu(e) {
+ if (this.props.closeMenu) {
+ this.props.closeMenu();
+ }
+ e.preventDefault();
+ const x = e.clientX;
+ const y = e.clientY;
+
+ setImmediate(() => {
+ const clickEvent = document.createEvent('MouseEvents');
+ clickEvent.initMouseEvent(
+ 'contextmenu', true, true, window, 0,
+ 0, 0, x, y, false, false,
+ false, false, 0, null,
+ );
+ document.elementFromPoint(x, y).dispatchEvent(clickEvent);
+ });
+ }
+
render() {
const position = {};
let chevronFace = null;
@@ -195,7 +217,7 @@ export default class ContextualMenu extends React.Component {
{ chevron }
<ElementClass {...props} onFinished={props.closeMenu} onResize={props.windowResize} />
</div>
- { props.hasBackground && <div className="mx_ContextualMenu_background" onClick={props.closeMenu} /> }
+ { props.hasBackground && <div className="mx_ContextualMenu_background" onClick={props.closeMenu} onContextMenu={this.onContextMenu} /> }
<style>{ chevronCSS }</style>
</div>;
}