inteligr8/alfresco-ng2-components
1
0
Fork 0
mirror of https://github.com/Alfresco/alfresco-ng2-components.git synced 2025-05-19 17:14:57 +00:00
Code Issues Packages Projects Releases Wiki Activity

[ADF-1708] prevent native context menu for Menu component (#2534)

Browse Source 
* prevent native context menu for Menu component

* fix unit tests
This commit is contained in:
Denys Vuika 2017-10-24 09:31:39 +01:00 committed by Eugenio Romano
parent 9d33656cfe
commit f33284a2e3
2 changed files with 31 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
ng2-components/ng2-alfresco-core/src/components/context-menu/context-menu-holder.component.spec.ts
View File

@ -28,6 +28,7 @@ describe('ContextMenuHolderComponent', () => {
let contextMenuService: ContextMenuService; let contextMenuService: ContextMenuService;
let overlayContainer = { let overlayContainer = {
getContainerElement: () => ({ getContainerElement: () => ({
addEventListener: () => {},
querySelector: (val) => ({ querySelector: (val) => ({
name: val, name: val,
clientWidth: 0, clientWidth: 0,

36
ng2-components/ng2-alfresco-core/src/components/context-menu/context-menu-holder.component.ts
View File

@ -17,7 +17,7 @@
import { OverlayContainer } from '@angular/cdk/overlay'; import { OverlayContainer } from '@angular/cdk/overlay';
import { ViewportRuler } from '@angular/cdk/scrolling'; import { ViewportRuler } from '@angular/cdk/scrolling';
import { Component, HostListener, Input, OnDestroy, OnInit, ViewChild } from '@angular/core'; import { Component, HostListener, Input, OnDestroy, OnInit, Renderer2, ViewChild } from '@angular/core';
import { MatMenuTrigger } from '@angular/material'; import { MatMenuTrigger } from '@angular/material';
import { Subscription } from 'rxjs/Rx'; import { Subscription } from 'rxjs/Rx';
import { ContextMenuService } from './context-menu.service'; import { ContextMenuService } from './context-menu.service';
@ -48,9 +48,13 @@ export class ContextMenuHolderComponent implements OnInit, OnDestroy {
private openSubscription: Subscription; private openSubscription: Subscription;
private closeSubscription: Subscription; private closeSubscription: Subscription;
private contextSubscription: Subscription; private contextSubscription: Subscription;
private contextMenuListenerFn: () => void;
@Input() showIcons: boolean = false; @Input()
@ViewChild(MatMenuTrigger) menuTrigger: MatMenuTrigger; showIcons: boolean = false;
@ViewChild(MatMenuTrigger)
menuTrigger: MatMenuTrigger;
@HostListener('contextmenu', ['$event']) @HostListener('contextmenu', ['$event'])
onShowContextMenu(event?: MouseEvent) { onShowContextMenu(event?: MouseEvent) {
@ -69,19 +73,39 @@ export class ContextMenuHolderComponent implements OnInit, OnDestroy {
constructor( constructor(
private viewport: ViewportRuler, private viewport: ViewportRuler,
private overlayContainer: OverlayContainer, private overlayContainer: OverlayContainer,
private contextMenuService: ContextMenuService private contextMenuService: ContextMenuService,
private renderer: Renderer2
) {} ) {}
ngOnInit() { ngOnInit() {
this.contextSubscription = this.contextMenuService.show.subscribe(e => this.showMenu(e.event, e.obj)); this.contextSubscription = this.contextMenuService.show.subscribe(e => this.showMenu(e.event, e.obj));
this.openSubscription = this.menuTrigger.onMenuOpen.subscribe(() => this.menuElement = this.getContextMenuElement());
this.closeSubscription = this.menuTrigger.onMenuClose.subscribe(() => this.menuElement = null); this.openSubscription = this.menuTrigger.onMenuOpen.subscribe(() => {
const container = this.overlayContainer.getContainerElement();
if (container) {
this.contextMenuListenerFn = this.renderer.listen(container, 'contextmenu', (e: Event) => {
e.preventDefault();
});
}
this.menuElement = this.getContextMenuElement();
});
this.closeSubscription = this.menuTrigger.onMenuClose.subscribe(() => {
this.menuElement = null;
if (this.contextMenuListenerFn) {
this.contextMenuListenerFn();
}
});
} }
ngOnDestroy() { ngOnDestroy() {
if (this.contextMenuListenerFn) {
this.contextMenuListenerFn();
}
this.contextSubscription.unsubscribe(); this.contextSubscription.unsubscribe();
this.openSubscription.unsubscribe(); this.openSubscription.unsubscribe();
this.closeSubscription.unsubscribe(); this.closeSubscription.unsubscribe();
this.menuElement = null;
} }
onMenuItemClick(event: Event, menuItem: any): void { onMenuItemClick(event: Event, menuItem: any): void {