Flash: multiple answers and upper/lower case

So, a Flash quiz with a text entry box?

Well, what if your user doesn't think the same as you? You show them a car and they write "motor car" rather than "car" in the text box. Shouldn't this be a valid answer?

You need a way of getting more than one answer accepted by the action script.

Here's a walk through...

I created a very basic question:


Really simple, eh?

• all I have there is a question, an answer box and a button;


• the answer box is set as an Input Text box with an Instance Name of answer;


• then I have a 15 frame animation (it could be 3 frames long actually - I just like to spread my frames out!);


• the Actions layer has stop(); at the 1st, 10th and 15th frames;


• the background layer has my question at frame 1, the "Well done" bit at frame 10 and a "Try again" dialogue at frame 15.

OK with that? Simple stuff eh?

What we need to do then is attach some ActionScript to the button so that when it's pressed the answer in the box gets checked and we get moved on to the right place in the movie to give the feedback to the user.

The key is that I want to allow an answer of red or scarlet. And I want to allow an upper case answer and a lower case answer (or a mixture in case the user hits the Caps Lock key by accident half way through!).

Here's the ActionScript...

Need to see the script more clearly? Click the image then!

Now, I'm going to walk you through that line by line, so here goes...

1 on(release) {
All this does is say when the button is released do whatever's inside the curly brackets

2. answer.text = answer.text.toLowerCase();
Ah, this is a beauty, but you need to get the capitals in exactly the right places or else it screws the entire thing up. All it does it take anything that goes into the answer text box and convert it to lower case for the purposes of the ActionScript. Clever eh?

3. if(answer.text.indexOf("red") != -1 answer... )
Hmm, tricky. What this is doing is saying if whatever's in the answer box is red or scarlet then do what follows inside curly brackets.

But it does this in a cool way. It looks at the textbox and says if the boolean response (the true/false response) to the question "does it say red?" is not equal to (the != means not equal to...) false (the -1 means "false") then do what comes next. Read that again. And again. Get it yet? That's OK, it's a bit complex. Just know that it works!!

Then it says Or if it's scarlet. It does this with the symbol (you'll find the key at the bottom left of the keyboard just by the zed). This symbol means Or. Promise it does.

4. {
Opens what happens if the if statement is true (i.e. it's red or scarlet)

5. gotoAndPlay(10)
So go to the keyframe which says "Yay, you got it right dude". I could have used gotoAndStop and I could have named the keyframe. Both would have been cool.

6 }
So stop doing this if it's true

7 else
Why, do this if it's not true then...

8 to 11 should make sense - we check to see if we've closed all the brackets!

Adapting the Script:

Easy enough to do. You can keep adding or... by adding answer.text.indexOf("maroon") to the If statement. You can make this line as long as you want - but if there are lots of possibilities then perhaps you need to think about your question?

I'm not sure, but in a long quiz you might want to call the textboxes answer1, answer2 etc...

You can also add a check to make sure the user put something in the textbox. I might blog this one tomorrow if I feel like it.

And you can start to add up right and wrong answers nice and easily if you wanted to. This doesn't take too much doing!