Input Devices
Here are the input devices available in q5play:
kb/keyboardfor the keyboardmousefor the mousecontros/controllersfor game controllerstouchesfor touch screen inputs
These input devices all use the same simple functions for getting the state of an input:
presses, pressing, and released.
Input devices also store the state of all their inputs as properties. For example,
kb.space stores how many frames the user has been pressing the space key. It gets reset
when the user releases the input.
q5play makes it easy to trigger the same action via different input devices using boolean logic.
In the mini-example, the sprite turns lime green if you press the space key or click the mouse.
Keyboard
kb tracks nearly every key on the keyboard, including 'enter', 'backspace', and
'control'.
Note that letter input is not case sensitive. To check if a user is pressing shift use:
kb.pressing('shift').
Since the WASD keys are commonly used to control the player character's movement, you can use the direction names 'up', 'down', 'left', and 'right' to detect WASD and arrow key presses.
Arrow keys can also be detected separately using 'arrowUp', 'arrowDown', 'arrowLeft', and 'arrowRight'.
In local two player games it's common for the second player to use the IJKL keys for movement. These keys can be referenced using 'up2', 'down2', 'left2', and 'right2'.
Mouse
The default mouse input is the 'left' button, a one finger click on trackpads. You can also use 'right' (two finger click) and 'center'.
mouse.x and mouse.y store the position of the mouse in the world, based on
the camera's position.
mouse.canvasPos stores the absolute position of the mouse on the canvas.
mouse.visible is a boolean that determines whether the mouse is visible or not.
mouse.cursor can be set to a cursor style.
The default is 'default', other options include 'grab', 'move', 'pointer', and 'wait'.
Game Controllers
The contros array (aka controllers) contains an object for each game
controller detected by your web browser. Each controller object stores the input states of these
buttons:
a, b, x, y, l (left bumper),
r (right bumper), lt (left trigger), rt (right trigger),
up, down, left, right (D-pad), lsb
(left stick button), rsb (right stick button), start, and
select
leftStick and rightStick represent the positions of the analog sticks as
objects with x and y properties. These values range from -1 to 1, with 0 indicating the center
position.
Some controllers have analog triggers, and their positions are stored as numbers ranging from 0 to 1
in leftTrigger and rightTrigger.
Just like with a standard JavaScript array, you can access connected controllers by index. For
example, contros[0] and contros[1] are the first and second controllers.
Remember to check if a controller exists in the array before checking its input.
For convenience, contro can be used to attempt to check the input states of
contros[0] and won't throw errors if a controller isn't connected yet.
Try it! Connect a game controller and press any button on it for it to be detected by q5play.
Pointers
The pointers array contains input from pointers: mouse, pen, stylus, or touches.
Each pointer has its own functions for detecting pressing and dragging input states.
pointer.x and pointer.y store the position of the pointer in the physics
world, based on the camera's position.
pointer.id is a unique number that identifies the pointer.
The frame after a pointer event ends, its pointer object is removed from the pointers
array.
In this demo, tap the screen to create boxes and drag to throw them around!