Work on Log In Boxes - Action Script

I spent a few hours tonight putting to use some of my new-found Action Script knowledge. I was able to create a new Class object (the InBox) and then set up an Array to be able to display/use as many of these InBox objects as I need in the future.

Here is a set of five of them displayed in a row:

The idea is for one box to be the focus at a time (you can see the third box highlited at the moment) and when the user types a letter/number it fills in the box and moves its focus on to the next box. (The actual typing and inputs have NOT been worked on yet)

Two things HAVE been accomplished tonight.

First, the InBox Class was created:

In this section of code, (left), you can see some of the basic properties of this class.

line 11: TextIn.png is the frame graphic that you see on the actual chalkboard screen above.

line 17: is the text field called "output" that displays the letter in the box. line 28 sets the initial letter to "A" for now.

line 21: the "Focus" variable tells if this particular InBox has the focus or not. line 27 sets it to "false"

line 18: is a random number that is either 1,2,3, or 4. It is used starting at line 34 to determine the orientation of the frame. (I randomly flip each frame so that every InBox displayed doesn't look identical.)

(this is only part of the code for InBox)


Second, I also created a set of ARRAYS:

This is so I can easily place multiple InBox objects without having to type in code separately for each one. This example currently places five InBox blocks. The _boxPositions array has the x and y coordinates of the five blocks (you can see they are all at y = 100, which puts them in a horizontal line). In the middle you see a "for" loop that goes from i = 1 to the length of the _boxPositions array... then each InBox is added to the scene, and then pushed onto the _inBoxes stack so that I have access to those boxes later. (For example:If I enter the command " inBoxes[2].focusOn() " it will now set the focus on box index #2 (which is really the THIRD box, since the first box is called box #0)... which just happens to be the reason why box #2 is glowing in the picture at the top of this blog entry!

The idea is that now I can just set up the array to display any combination of InBox boxes, depending on the nature of the input that I am looking for. Log in names will have seven characters, for example. Log in keys from completion of lecture notes will have four characters.

Time: 3 hours