Although Phaser allow you to manage inputs pretty well, we have decided to handle it a different way. Of course you can always stick with Phaser’s way of doing things.


The idea

We don’t see an input as a key, but more as an action.

For example, the action “valid” is bound to the key SPACEBAR. You can then choose a function ( or more ) in your game to be called when the “valid” action is trigger  – by the SPACEBAR key.

The great advantage of this method is that you can change the key triggering the “Valid” action very quickly, and for all your game.

Let’s take a brief example. You want the SPACEBAR to do two things :
– make your player jump in-game
– validate an action in the menu

Now you want to change from the SPACEBAR key to the ENTER key (not necessarily better) : you just have to change it once instead of going through your player and menu scripts to change it manually.

This may reveal itself vital if you want your user to be able to edit its own input.

In the LREditor

Go to “Assets > Inputs” in the top bar. You should see this window:



Here you can edit an action”s key. You can also remove it or add an new action.

The capture checkbox tells if the chosen key should be overrided in your brower’s behaviour.

An example : let’s say you want the DOWN key to make your player crouch.
Unfortunately, pressing the DOWN key in a browser make it scroll down. Your browser may then be scrolling down each time you want to crouch : this is not desired.

By checking the capture checbox, this default behaviour will not occur, and your browser won’t do anything when you press the DOWN key.

In the code

The class that manages the input is Phaser.Plugin.InputManager. It is used as a plugin which is initialised with the game, and your can access it via game.inputManager.

For example, if we want to bind a function to the “valid” action in a behaviour :“valid”,this.onValid,this);

You will find in the doc all the functions of InputManager that you need, such as:
– bindKeyRelease (action, callback, context, priority );
– bindMousePress ( callback, context, button,priority);
– bindMouseRelease ( callback, context, button,priority);
– bindMouseWheel ( callback, context, priority);

The same action can have mutliple callbacks. The priority value prevents callbacks with a certain priority to be triggered if another callback with a higher priority has been successfully called.

The higher priority is 0.

In order to this concept of priority to work, your callback must return true if you consider the input action to be successfully executed :

function myCallback(){
//if i don’t want other callbacks with lower priority to be triggered
return true;