Input
Text
string
Type
string
text
.text
number
password
email
color
select
radio
checkbox
Default
string
Options
Array<object>
Validation
function
Save
function
Warning
string
actionString
string
'OK'.
Class
string
Timer
object
Attributes
object
input
HTML element created.Text
property specifies the text that will appear to the player in the input dialog. This is the only property that is required.Validation
property expects a function. When the player presses the submit button in your input dialog, the value they provided will be passed to your Validation
function. In there, you can perform any validation you need depending on your game's context and what was the purpose of your input. The function should return a boolean value (true
or false
) to indicate if the value was valid or not. If your validation has to perform some asynchronous operations such as consulting with an external server, then you can also return a Promise
that resolves to the boolean value.Type
property has the text
type so it expects the player to type something into a text field:input
and then, checks if that input is valid by checking if it has a length greater than 0 or, in simpler words, whether it received a non-empty input which could happen if the player didn't type anything and just pressed the submit button.true
when the input is not empty and false
when the input is empty. Our code doesn't deal with any asynchronous function so we can just return a boolean value this time.length 0
) because if it was, we can tell right away it wasn't a valid name and there's no need to check with our server so we make an early return
if that's the case.Promise.resolve (valid)
value which in the end, contains the valid property returned to us by the server.Warning
property expects a string
value that will be shown to the player if the validation function determines the input was invalid.Warning
property will be shown to the player so they know something was wrong with the info they provided and try again:Validation
function is run and it determines the input was valid, the value will be passed along to the Save
function. Inputs were created mostly to get information out of the player so the Save
function is where you would, as it name says, save that information or perform any other action you need to do now that you know what the player provided is valid.Save
function, we can see it's saving the player's input in the player.name property on the storage:void
(nothing like the one above) or true
, the game will continue to the next statement on the script as soon as the save operation finishes. If it returns false
, then the input dialog will disappear but the player will have to click once more for the game to carry on.Revert
function. This function should be implemented by you and should do everything that's needed to revert what you did in your Save
function. Let's take the following input as an example:Save
function, we're saving the player's name to the storage:Revert
function is return that value in the storage to its original or default value:Revert
function however, players won't be able to go back when reaching an input statement, you can of course use this fact to your advantage if that's the behaviour you want, otherwise we always recommend implementing your Revert
function so players can have the best experience possible.Class
property. This property expects a string
with space separated class names that will be added to your input dialog when it gets shown. main.css
file such as these ones:Class
property to our input and list those class names right there:text
input allows the player to enter any kind of text, that includes numbers, symbols and even emojis. If the player doesn't enter any value, the Validation
and Save
functions will receive an empty string (''
) as the player's input.input
received in the Validation
and Save
functions will be a string so it has to be parsed to a number. If the player doesn't enter any value, the Validation
and Save
functions will receive an empty string (''
) as the player's input.password
will allow the player to enter any text just like the text
input but whatever they type will be obscured with a symbol such as the asterisk (*
) or a dot (•
). If the player doesn't enter any value, the Validation
and Save
functions will receive an empty string (''
) as the player's input.select
input allows you to provide different possible values for the player to choose from, they however will only be able to choose one of them. If the player doesn't enter any value, the Validation
and Save
functions will receive an empty string (''
) as the player's input.radio
input, just like the select
input allows you to provide different possible values for the player to choose from and only allows them to choose one. If the player doesn't enter any value, the Validation
and Save
functions will receive an empty string (''
) as the player's input.checkbox
also allows you to provide different possible values for the player to choose from but, contrary to the radio
or select
inputs, players will be able to choose more than one option. Since this input allows multiple choices to be chosen, the input argument received by the Validation
and Save
functions will be an array of strings instead of a string, for example:Validation
and Save
functions will receive an empty array ([]
) as the player's input.Default
property. For text-based inputs such as text and password, whatever you pass as the value of this property will be what's written by default on the input field.Default
property will have to match one of the value properties of the options you provided:'OK'
in it, however this may not match the purpose or context of your input. This text can be changed by providing a translation key as the value for the actionString
property. Attributes
property.maxlength
max
attribute instead.minlength
min
attribute instead.placeholder
pattern
max
min
step