Detect graphics object below mouse pointer at any time?

[spinnerbox]

This example seems promising: http://phaser.io/examples/v2/input/pointer-over

But I need to add additional code for each of my graphics object to detect which object is currently below the mouse pointer. Also It would be tricky if the graphics object is a composite of several other graphics sub-objects.

How can I print in console the name of a graphical object which is below the mouse pointer at any given time?

Some examples?

Note: Can I use Phaser.Pointer.hitTest() function and how?

Thanks

[BunBunBun]

create: function () {
	var obj = this.layerBack.add(game.add.sprite(0, 0, 'spriteName'));
	obj .inputEnabled = true;
	obj.name = 'nameObj';
	game.input.addMoveCallback(this.moveCallback, this);
}

moveCallback: function(pointer){
	if(pointer.targetObject!=null) {
		console.log('target:',pointer.targetObject.sprite);
		console.log('name: ' + pointer.targetObject.sprite.name);
	}
}

 

[spinnerbox]

Yes:

gameObject.input.mousePointer.targetObject.sprite.name

does the job, but is there a better way for composite objects? Is there some function in Phaser that can help me traverse the tree of children and check the bounds for each or should I make my own?

gameObject.input.mousePointer.targetObject.sprite.children

contains graphics children with names.

[Milton]

There may well be an object under your top object that has nothing to do with it.
Which means you have to check the entire DisplayList (stage).
See also this. You could copy EaselJS's implementation, but it seems very expensive (it just draws everything, and tests one by one...)