Problem with sprite.events.onInputDown

[Binary Moon]

I have a grid of sprites that I am using for a menu in my current project. I've set up click, over, and out events and the over and out events work fine but the click ones aren't registering. Does anyone have any idea what I might be doing wrong?

 

I've added a simplified version of my code below.

function icon_click() { console.log('click'); }function icon_over() { console.log('over'); }function icon_out() { console.log('out'); }function create() {	var list_icons = game.add.group();	var x_position = 0;	var y_position = 0;	for( var x = 0; x < 12; x ++ ) {		for( var y = 0; y < 8; y ++ ) {			x_position = ( x * 74 ) - ( 74 / 2 );			y_position = ( y * 63 ) + 3;			var sprite = game.add.sprite( x_position, y_position, 'icon' );			sprite.inputEnabled = true;			sprite.events.onInputDown.add( icon_click, { 'url': 'http://website' } );			sprite.events.onInputOver.add( icon_over, {} );			sprite.events.onInputOut.add( icon_out, {} );			list_icons.add( sprite );		}	}}

Thanks in advance!

[rich]

The second parameter to a Phaser.Signal (which is what events.onInputDown etc are) is the JavaScript context in which the signal is dispatched.

[lewster32]

I believe changing the line to this will make it work as you want it to:

sprite.events.onInputDown.add( function() { icon_click('http://website'); }, this );

Then icon_click will work like so:

function icon_click(url) { console.log(url); }

A common requirement is passing parameters along with event callbacks, but doing it this way means you get to run arbitrary code, including calling functions with any parameters you want.

[Binary Moon]

Thanks for the pointers - so if I understand correctly the best thing to do would be to pass the sprite as the context so I can use the sprite properties?

sprite.url = 'http://binarymoon.co.uk/';sprite.events.onInputDown.add( function() {	icon_click( this.url );}, sprite );

This works fine for over and out events but click still doesn't register. It doesn't matter if I use this or sprite - even just console.logging a string doesn't show anything.

 

I should add that each image will have a unique url so I need a way to make them different per sprite.

[lewster32]

Since you've already got 'sprite' in context, the following should work just fine:

sprite.url = 'http://binarymoon.co.uk/';sprite.events.onInputDown.add( function() {    icon_click( sprite.url );}, this );

[Binary Moon]

If I use this as the context then the game is the object but I want it to be the sprite. Am I adding the event listener in the wrong place perhaps?

[Binary Moon]

I'm wondering if this is a bug with phaser. If I call only onInputDown then it works fine - but I want to use onInputDown, onInputOver, and onInputOut - and when I use all three, Over and Out work but Down seems to be ignored.

 

Edit:

Further experimentation and I may have found the culprit. I am using this.bringToTop(); onInputOver so that the current icon pops to the top (there's also a scale transition to show it's the active icon). If I remove bringToTop then it works.

 

I wonder if bringing it to the top is removing/ cancelling the down event?

[lewster32]

It's hard to say without knowing more about how the hit-test stuff works; I certainly wouldn't assume this would be problematic as even though the sprite is changing index, it isn't leaving the pointer - and your method of bringing the button to the top when you do a scale tween to show it's active is a common thing to do, so I would imagine if it'd been bugged this would've been seen and caught already.

[Binary Moon]

I've carried on working on this. I moved it all over to use the states and this is still happening.

 

To summarize the above, when I use sprite.bringToTop() the sprites onInputDown event gets cancelled/ ignored. If i remove that single command then the event still works.

 

Very confused now

[eguneys]

bringToTop removes the sprite and adds back to the group. This causes sprite to reset its InputHandler data.

When you call it inside onInputOver callback, InputHandler gets confused, thinking mouse is not over the sprite anymore.

I think its a bug. Here is a JSBIN: http://jsbin.com/rokelulo/7/edit?html,js,console,output

[lewster32]

If that's the case, I'd definitely call that a bug, as it makes this common functionality unusable.

[Binary Moon]

Oh - that's great. Thanks a lot for the demo. That helps a lot. Rich asked me to created an issue for this on Github which you can see here: https://github.com/photonstorm/phaser/issues/928

[rich]

Just to add for anyone following here - this is now fixed in the dev branch