javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2025-08-22 21:48:42 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix(menu): backdrop click without 300ms delay

Browse Source 
fixes #6405
This commit is contained in:
Manu Mtz.-Almeida
2016-09-30 14:36:30 +02:00
parent 87330b35a7
commit 9bbe485ed0
1 changed files with 16 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files

36
src/components/menu/menu.ts
View File

@ -9,6 +9,7 @@ import { MenuController } from './menu-controller';
import { MenuType } from './menu-types'; import { MenuType } from './menu-types';
import { Platform } from '../../platform/platform'; import { Platform } from '../../platform/platform';
import { GestureController } from '../../gestures/gesture-controller'; import { GestureController } from '../../gestures/gesture-controller';
import { UIEventManager } from '../../util/ui-event-manager';
/** /**
@ -178,7 +179,7 @@ import { GestureController } from '../../gestures/gesture-controller';
selector: 'ion-menu', selector: 'ion-menu',
template: template:
'<div class="menu-inner"><ng-content></ng-content></div>' + '<div class="menu-inner"><ng-content></ng-content></div>' +
'<ion-backdrop (click)="bdClick($event)" disableScroll="false"></ion-backdrop>', '<ion-backdrop disableScroll="false"></ion-backdrop>',
host: { host: {
'role': 'navigation' 'role': 'navigation'
}, },
@ -195,7 +196,7 @@ export class Menu {
private _isAnimating: boolean = false; private _isAnimating: boolean = false;
private _isPers: boolean = false; private _isPers: boolean = false;
private _init: boolean = false; private _init: boolean = false;
private _events: UIEventManager = new UIEventManager();
/** /**
* @private * @private
@ -207,11 +208,6 @@ export class Menu {
*/ */
@ViewChild(Backdrop) backdrop: Backdrop; @ViewChild(Backdrop) backdrop: Backdrop;
/**
* @private
*/
onContentClick: EventListener;
/** /**
* @input {any} A reference to the content element the menu should use. * @input {any} A reference to the content element the menu should use.
*/ */
@ -349,15 +345,6 @@ export class Menu {
} }
self._setListeners(); self._setListeners();
// create a reusable click handler on this instance, but don't assign yet
self.onContentClick = function(ev: UIEvent) {
if (self._isEnabled) {
ev.preventDefault();
ev.stopPropagation();
self.close();
}
};
self._cntEle.classList.add('menu-content'); self._cntEle.classList.add('menu-content');
self._cntEle.classList.add('menu-content-' + self.type); self._cntEle.classList.add('menu-content-' + self.type);
@ -368,11 +355,11 @@ export class Menu {
/** /**
* @private * @private
*/ */
bdClick(ev: Event) { onBackdropClick(ev: UIEvent): boolean {
console.debug('backdrop clicked');
ev.preventDefault(); ev.preventDefault();
ev.stopPropagation(); ev.stopPropagation();
this._menuCtrl.close(); this._menuCtrl.close();
return false;
} }
/** /**
@ -502,10 +489,18 @@ export class Menu {
(<any>this._cntEle.classList)[isOpen ? 'add' : 'remove']('menu-content-open'); (<any>this._cntEle.classList)[isOpen ? 'add' : 'remove']('menu-content-open');
this._cntEle.removeEventListener('click', this.onContentClick); this._events.unlistenAll();
if (isOpen) { if (isOpen) {
this._cntEle.addEventListener('click', this.onContentClick); let callback = this.onBackdropClick.bind(this);
this._events.pointerEvents({
element: this._cntEle,
pointerDown: callback
});
this._events.pointerEvents({
element: this.backdrop.getNativeElement(),
pointerDown: callback
});
this.ionOpen.emit(true); this.ionOpen.emit(true);
} else { } else {
@ -612,6 +607,7 @@ export class Menu {
*/ */
ngOnDestroy() { ngOnDestroy() {
this._menuCtrl.unregister(this); this._menuCtrl.unregister(this);
this._events.unlistenAll();
this._cntGesture && this._cntGesture.destroy(); this._cntGesture && this._cntGesture.destroy();
this._type && this._type.destroy(); this._type && this._type.destroy();
this._resizeUnreg && this._resizeUnreg(); this._resizeUnreg && this._resizeUnreg();