Make a layer swallow/stop propagation of touch, mouse and keyboard events

cocos2d-x JavaScript
#1

I’m trying to show a simple Quit the game dialog, with a yes and no button when either escape, backspace or the back key is pressed like this:

if ('keyboard' in cc.sys.capabilities ) {
	 cc.eventManager.addListener({
			event: cc.EventListener.KEYBOARD,
			onKeyReleased: function(keycode, event) {
				if (keycode == cc.KEY.back || keycode == cc.KEY.backspace || keycode == cc.KEY.escape) {
					this.addChild(new ExitGameLayer(this._end));
				}
			}.bind(this)
		}, this);
}

however once the ExitGameLayer is visible on screen, any touches, mouse clicks or keyboard goes through to the layer which created/added the ExitGameLayer.

I’ve tried to stop propagation and swallow touches in my ExitGameLayer like this to no avail:

if ('touches' in cc.sys.capabilities ) {
	 cc.eventManager.addListener({
			event: cc.EventListener.TOUCH_ONE_BY_ONE,
			swallowTouches: true,
			onTouchBegan: function (touch, event) {
				return true;
			}
		}, this);
} else if ('mouse' in cc.sys.capabilities ) {
	 cc.eventManager.addListener({
			event: cc.EventListener.MOUSE,
			onMouseDown: function(event) {                        
				event.stopPropagation = true;
			}
		}, this);
}

if ('keyboard' in cc.sys.capabilities ) {
	 cc.eventManager.addListener({
			event: cc.EventListener.KEYBOARD,
			onKeyPressed: function(keycode, event) {                     
				event.stopPropagation = true
			}
		}, this);
}

I’m really baffled as to why this is so hard! Please help before I rip my hands off.

#2

So, seen as no one has answered with a better or more correct way of doing it I did it myself (all be it not the sexiest). I simply added a little method to each class I needed, which would essentially stop the layer from receiving input both via events and UI components as well as pausing the node etc. This would of course be called before I popped the new layer up and called again when the layer is removed.

	_toggleInputBlocking: function() {
		this._blockInput = !this._blockInput;
		
		this._startButton.setEnabled(!this._blockInput); // ui components dont give a #%^$ about pauseTarget
		if (this._blockInput) {
			this.pause();
			cc.eventManager.pauseTarget(this);
		} else {
			this.resume();
			cc.eventManager.resumeTarget(this);
		}
	},
1 Like