When provided, local mouse position will be calculated treating this as a reference. Most of the time it'll
be the canvas element created by PIXI to render the game into.
If the game does not begin in the top-left corner of the HTML page it has to be set for local mouse
position to be calculated correctly.
When viewport of the game changes there are two common solutions:
scaleProperties is used in the second situation. When your game is scaled and possibly offset
(when you prefer keeping the display ratio) inside its container local mouse positions will not
take those changes into consideration while scaled mouse positions will, provided
MouseInputRelativeScaleProps is set correctly.
Resets the internal state of this class to what it is during creation - nothing pressed, released or held down, positions reset.
This won't affect scaleProperties and inputContainer.
Handles a mouse event updating the internal status. This will be called automatically if you register the listeners
via registerListeners. If you have listeners being registered somewhere else entirely and would like to keep it
that way, you can manually call this method passing the MouseEvent/PointerEvent.
Registers the mousemove, mosedown and mouseup listeners on the passed element so that the class
can handle the input.
This also registers an event that blocks right mouse button context menu from appearing.
To avoid issues with focus it's best to pass document here
Updates the internal state, should be called at the end of each frame.
Generated using TypeDoc
Handles the mouse events and provdes an API for interacting with it easily. The simplest way to use it is:
MouseInput.registerListeners()passing thedocument.inputContainerto the canvas element created by PIXI.updateat the end of every update frame of your game.Different mouse positions
screenis the position of the mouse in the whole screen.pageis the position of the mouse inside the loaded webpage.localis the position of the mouse relative to theinputContainerif defined, or to the element passed toregisterListeners.scaledis the position of the mouse inside the game, which islocalmodified byscaleProperties. It is mostly useful in games that scale up when their workspace is enlarged, as opposed to games that just reorganize their content and allow seeing more space inside.In order to get the proper values for
localit is recommended to setinputContainerto the canvas element used to render the game.Scaled mouse position
In order to get the proper values for
scaledyou need to keep thescalePropertiesin sync with the modifications you do to the rendering of the game. For example, a typical game imitating 8-bit aesthetics would likely have its own internal resolution and then would scale that up, maybe pixel-perfect or maybe not. For example: a game in resolution320x240scaled up proportionally to resolution1920x1080:4.5times, to1440x1080.Xby240px((1920 - 1440) / 2)scalePropertieswould be `{scaleX: 4.5, scaleY: 4.5, offsetX: 240, offsetY: 0}With these values scaledX/Y will return the proper position of the mouse in the stage.
How does it work:
See KeyboardInput for details.
Understanding mouse button states
Down, pressed and released for the mouse buttons work exactly the same as the keys in KeyboardInput, please refer to its documentation.