Context

React-phaser allows hooking Phaser events to callbacks (see for example <input>). Each callback may receive event-specific data, but in all cases they will receive a context object.

The context object has the following shape:

{
	 /* Phaser.Game object: */
	game: {...},

    /* A map between names and react-phaser nodes: */
    nodes: {[name]: [node],...} ,

    /* Input objectsL */
    input: {
    	cursors: {...},
        keys: {...},
        pointers: [pointer1, pointer2...]
    }
}

Nodes

When an object has a name property:

   <sprite name="dude" ..../>

It's added to the context.nodes map. Each mapped node has these properties:

{
	tag: 'sprite',
    id: [An unique numeric identifier],
    obj: [Phaser.Sprite object],
    props: [current property map from the React element]
}

Input

context.input is configured with the <input> node.

Cursors

If <input> has property cursors={true}, context.input.cursors is a map for the cursor keys.

This object is created using method Phaser.Keyboard.createCursorKeys().

Keys

If either property keys is set, or the <input> node has any <key> children, context.input.keys is a mapping between key names and Phaser.Key objects.

Example:

<input keys={{a: React.KeyCode.A}}>
	<key keyCode={Phaser.KeyCode.B} keyName="b"/>
</input>

Will result in:

context = {
	...
    input: {
    	...
    	keys: {
    		a: [Phaser.Key object for key A},
	    	b: [Phaser.Key object for key B}
    	}
	}
}