add functionality to hide open context menu (microsoft#64099)

sbatten · web-flow · commit d96141bb7af8 · 2019-02-21T17:59:37.000+01:00
* add functionality to hide open context menu fix toggling of ... menu on windows fix toggling of global activity bar menu on windows fix position of global activity bar menu on windows fixes microsoft#62413 fixes microsoft#61766 * addressing feedback * linting error * updating to eat mouse click to dismiss menu * remove native context menu changes as unnecessary * use an invisible div to block mouse * move logic into context menu handler * sanitize SNAP variables * rename update.channel to update.mode fixes microsoft#67407 * dervie status background from editor widget background
diff --git a/src/vs/platform/contextview/browser/contextMenuHandler.css b/src/vs/platform/contextview/browser/contextMenuHandler.css
@@ -6,3 +6,12 @@
 .context-view .monaco-menu {
 	min-width: 130px;
 }
+
+.context-view-block {
+	position: fixed;
+	left:0;
+	top:0;
+	z-index: -1;
+	width: 100%;
+	height: 100%;
+}
diff --git a/src/vs/platform/contextview/browser/contextMenuHandler.ts b/src/vs/platform/contextview/browser/contextMenuHandler.ts
@@ -16,7 +16,7 @@ import { INotificationService } from 'vs/platform/notification/common/notificati
 import { IKeybindingService } from 'vs/platform/keybinding/common/keybinding';
 import { IThemeService } from 'vs/platform/theme/common/themeService';
 import { IContextMenuDelegate } from 'vs/base/browser/contextmenu';
-import { addDisposableListener, EventType } from 'vs/base/browser/dom';
+import { addDisposableListener, EventType, $ } from 'vs/base/browser/dom';
 import { attachMenuStyler } from 'vs/platform/theme/common/styler';
 import { domEvent } from 'vs/base/browser/event';
 
@@ -25,6 +25,7 @@ export class ContextMenuHandler {
 	private elementDisposable: IDisposable;
 	private menuContainerElement: HTMLElement | null;
 	private focusToReturn: HTMLElement;
+	private block: HTMLElement | null;
 
 	constructor(
 		element: HTMLElement,
@@ -73,12 +74,14 @@ export class ContextMenuHandler {
 					container.className += ' ' + className;
 				}
 
+				// Render invisible div to block mouse interaction in the rest of the UI
+				this.block = container.appendChild($('.context-view-block'));
+
 				const menuDisposables: IDisposable[] = [];
 
 				const actionRunner = delegate.actionRunner || new ActionRunner();
 				actionRunner.onDidBeforeRun(this.onActionRun, this, menuDisposables);
 				actionRunner.onDidRun(this.onDidActionRun, this, menuDisposables);
-
 				menu = new Menu(container, actions, {
 					actionItemProvider: delegate.getActionItem,
 					context: delegate.getActionsContext ? delegate.getActionsContext() : null,
@@ -106,6 +109,11 @@ export class ContextMenuHandler {
 					delegate.onHide(!!didCancel);
 				}
 
+				if (this.block) {
+					this.block.remove();
+					this.block = null;
+				}
+
 				if (this.focusToReturn) {
 					this.focusToReturn.focus();
 				}
diff --git a/src/vs/workbench/browser/parts/activitybar/activitybarActions.ts b/src/vs/workbench/browser/parts/activitybar/activitybarActions.ts
@@ -7,7 +7,6 @@ import 'vs/css!./media/activityaction';
 import * as nls from 'vs/nls';
 import * as DOM from 'vs/base/browser/dom';
 import { StandardKeyboardEvent } from 'vs/base/browser/keyboardEvent';
-import { StandardMouseEvent } from 'vs/base/browser/mouseEvent';
 import { EventType as TouchEventType, GestureEvent } from 'vs/base/browser/touch';
 import { Action } from 'vs/base/common/actions';
 import { KeyCode } from 'vs/base/common/keyCodes';
@@ -130,32 +129,29 @@ export class GlobalActivityActionItem extends ActivityActionItem {
 
 		this._register(DOM.addDisposableListener(this.container, DOM.EventType.MOUSE_DOWN, (e: MouseEvent) => {
 			DOM.EventHelper.stop(e, true);
-
-			const event = new StandardMouseEvent(e);
-			this.showContextMenu({ x: event.posx, y: event.posy });
+			this.showContextMenu();
 		}));
 
 		this._register(DOM.addDisposableListener(this.container, DOM.EventType.KEY_UP, (e: KeyboardEvent) => {
 			let event = new StandardKeyboardEvent(e);
 			if (event.equals(KeyCode.Enter) || event.equals(KeyCode.Space)) {
 				DOM.EventHelper.stop(e, true);
-
-				this.showContextMenu(this.container);
+				this.showContextMenu();
 			}
 		}));
 
 		this._register(DOM.addDisposableListener(this.container, TouchEventType.Tap, (e: GestureEvent) => {
 			DOM.EventHelper.stop(e, true);
-
-			const event = new StandardMouseEvent(e);
-			this.showContextMenu({ x: event.posx, y: event.posy });
+			this.showContextMenu();
 		}));
 	}
 
-	private showContextMenu(location: HTMLElement | { x: number, y: number }): void {
+	private showContextMenu(): void {
 		const globalAction = this._action as GlobalActivityAction;
 		const activity = globalAction.activity as IGlobalActivity;
 		const actions = activity.getActions();
+		const containerPosition = DOM.getDomNodePagePosition(this.container);
+		const location = { x: containerPosition.left + containerPosition.width / 2, y: containerPosition.top };
 
 		this.contextMenuService.showContextMenu({
 			getAnchor: () => location,
diff --git a/src/vs/workbench/browser/parts/titlebar/media/titlebarpart.css b/src/vs/workbench/browser/parts/titlebar/media/titlebarpart.css
@@ -78,7 +78,7 @@
 	width: 35px;
 	height: 100%;
 	position: relative;
-	z-index: 99;
+	z-index: 3000;
 	background-image: url('code-icon.svg');
 	background-repeat: no-repeat;
 	background-position: center center;
@@ -96,7 +96,7 @@
 	flex-shrink: 0;
 	text-align: center;
 	position: relative;
-	z-index: 99;
+	z-index: 3000;
 	-webkit-app-region: no-drag;
 	height: 100%;
 	width: 138px;
