Forum Discussion
Creating a "phone" interaction - Numerical Keyboard to fill in text input
I've tried looking at various learning and discussions and I'm not sure if I am just wording it incorrectly. This is what I am trying to accomplish though:
I am creating a training that teammates will need to use a cell phone to do the job. The application on the cell phone requires inputs that pop up the cell phone numerical keyboard only or alpha-numeric.
This training will occur on a computer so I need to create an interactive "phone" within storyline where they press the keys on the phone and it will input the letters or numbers that they click into a text input field. I want to allow free range where they can type whatever they want into the text input field, but they must type the correct information for it to progress.
I have figured out how to make it so goes to the layers I need it to go to based on the input that is put in from the computer keyboard, but I am trying to simulate the experience as close to what they will see when they start the job. So I am not sure how I could go about creating interactive keys on the phone image created in the program that will fill the input field and retain what has already been "keyed" in.
This is the interactive phone I have created in the program, those are the keys that I want them to be able to press and it fills the text input field above it retaining each "Keystroke" and typing it out above them as they press the keys on the phone.
Sounds good, and looks good. I'll bet if you attach your .story file, someone will be able to work with what you have and give you some ideas.
Here's what I came up with.
That is so cool an exactly what I want to happen! Wow! Thank you so much! To make this work across multiple entries would I just need to copy everything and then change the JavaScript line 2 from inputField to the variable for that screen?
Hi Cassandra,
On the Base Layer, there is a Trigger that sets the inputField to the variable that you want to update.
Set inputField to value DriverID when timeline starts on this slide.
Take a look at this attached example. For slide 2, there are two input fields: FirstNameField, and LastNameField.
On Click of the First Name Field there is a trigger that sets the inputField to the variable FirstName.
On Click of the Last Name Field there is a trigger that sets the inputField to the variable LastName.
Hello Cassandra,
You could use a javascript trigger to convert the text to a number.
Then you can use the greater than/less than functions on the Converted Number.
Take a look at the attached story file.
