Security News
tea.xyz Spam Plagues npm and RubyGems Package Registries
Tea.xyz, a crypto project aimed at rewarding open source contributions, is once again facing backlash due to an influx of spam packages flooding public package registries.
phaser-input
Advanced tools
Readme
Some description here about how awesome this Phaser Input library is, because it works on Canvas AND WebGL. Oh did I mention mobile to? no? Well it supports mobile..
Key features:
First you want to get a fresh copy of the plugin. You can get it from this repo or from npm, ain't that handy.
npm install phaser-input --save-dev
Next up you'd want to add it to your list of js sources you load into your game
<script src="node_modules/phaser-input/build/phaser-input.js"></script>
After adding the script to the page you can activate it by enabling the plugin:
game.add.plugin(Fabrique.Plugins.InputField);
The simplest way of adding a input field is:
var input = game.add.inputField(10, 90);
Ofcourse there are options available that can be used to style the input. They can be passes as an object as the third parameter.
var password = game.add.inputField(10, 90, {
font: '18px Arial',
fill: '#212121',
fontWeight: 'bold',
width: 150,
padding: 8,
borderWidth: 1,
borderColor: '#000',
borderRadius: 6,
placeHolder: 'Password',
type: Fabrique.InputType.password
});
Zooming is easy to enable on an input field, it can be passed to the InputField as a setting. But there are some caveats:
First of all, it's only meant for mobile. Second; it modifies the scale and pivot of the world, and that might interfere with your resize.
Also, when the keyboard is shown, sometimes a resize event will be triggered.
Ideally you use a custom resize event, check for the static property Fabrique.Plugins.InputField.KeyboardOpen
and don't resize when it's set to true.
Current version includes two event dispatchers that notify when a device keyboard is opened or closed.
You can add listeners which trigger events based on this feedback.
Fabrique.Plugins.InputField.onKeyboardClose.addOnce(function() {
this.resizeBackgroundImage();
});
By default, input event will not bubble up to other elements
This is controlled by an InputField property called blockInput
.
When set to false, the input event will trigger on the input element and move up to other elements listening for the event.
e.g. An in-game sprite might be listening for keyboard events (W, A, S, D). If set to false, typing in input field will not trigger keyboard events for the sprite. So the sprite will not move when typing into input field.
InputField has a property (focusOutOnEnter
) that controls whether the input field will lose focus on pressing Enter.
If set to true, pressing enter will end focus on the field (default is true).
Tested on:
This is most likely due to you adding the input field to a custom Phaser object. According to the Phaser docs the update function needs to be called manually in these cases.
So add the following to your object and the cursor should work :)
update: function () {
this._inputField.update();
},
phaser-input is inspired by CanvasInput
We at OrangeGames just love playing and creating awesome games. We aren't affiliated with Phaser.io. We just needed some awesome input boxes in our awesome HTML5 games. Feel free to use it for enhancing your own awesome games!
Phaser Input is distributed under the MIT license. All 3rd party libraries and components are distributed under their respective license terms.
FAQs
Adds input boxes to Phaser like CanvasInput, but also works for WebGL and Mobile, made for Phaser only.
The npm package phaser-input receives a total of 14 weekly downloads. As such, phaser-input popularity was classified as not popular.
We found that phaser-input demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
Tea.xyz, a crypto project aimed at rewarding open source contributions, is once again facing backlash due to an influx of spam packages flooding public package registries.
Security News
As cyber threats become more autonomous, AI-powered defenses are crucial for businesses to stay ahead of attackers who can exploit software vulnerabilities at scale.
Security News
UnitedHealth Group disclosed that the ransomware attack on Change Healthcare compromised protected health information for millions in the U.S., with estimated costs to the company expected to reach $1 billion.