Subtitles of the Movie

Now that you've been orientated to the elements of the Actions Panel let's now go back to that Navigation example and start working with our first script. Go to the Work Files folder and open the nav underscore function underscore stop.fla file, that's the file that I have open here. Make sure that the Timeline is visible, if not choose Window, Timeline from the Main Menu then scrub or mov the Playback Head back and forth across the Timeline. Notice that all of the content including the frame labels, buttons and stage labels have been provided for you. However all the scripts are missing so that's what we're going to work on in the next two movies. To prove this, go ahead and do a Control, Test Movie on your file and you'll notice that the various frames flash by without stopping, going from Home, Page 1, Page 2, Page 3, Page 4 and back to Home again. So once you've ensured that you don't have any scripts go ahead and close the Flash Player and open up the Actions Window by choosing Window, Actions, or pressing the F9 key on your keyboard. That brings up the Actions Panel. Move the Playback Head to Frame 1 here and then add the following to the Script Pane. Make sure you're not in Script Assist Mode. Type Stop, open-close parentheses semicolon and there you have your very first script. But try to resist the temptation to move on to the next script until you've tested this one here. Try to predict what should happen before testing. In this case the Playback Head should stop, should stop looping and then stay right there in Frame 1, which is the Home label. So let's go ahead and leave the Actions Panel open. Choose Control, Test Movie. Let's go ahead and check this. Sure enough, Playback Head is staying right there in Frame 1 and the Home label is staying on the Stage. You'll want to follow this procedure whenever possible. Write a line of code and then test it in this way. You can't always test after each line of code, but at the earliest possible moment go back and test your scripts by doing Control, Test Movie. Another shortcut is to take a working script and copy it. Now we know that this script here works so let's copy this script by highlighting it and then right-clicking and choosing Copy from the Menu. Go to Frame 15 here in the Actions layer and now right-click and choose Paste. Now in this case there's no way to test this Stop action. I'm pretty confident that it will work because it worked over here in Frame 1, but I have no way of getting over to Frame 15, so at this point we're going to need to start programming these buttons to jump over to Frame 15 and it should stay there and that will allow us to test this line of script. Now the first step in doing this is to add Instance Names to all of your button symbols here on the Stage. This is something that you should get in the habit of doing as soon as you place these on the Stage, but I've left them off here in the example to provide some experience and to drive home the point of the importance of adding these Instance Names. Most of the times for these early scripts this is a real common error of my students. They forget to name these instances, or they name them incorrectly, so to name these, let's open up the Properties Inspector by choosing Window, Properties from the Main Menu. Notice that this says Instance Name right there. That's a sure sign that this has not been named yet. Actually a request that Flash is making to name this. So let's go ahead and call this home underscore btn. Notice that there's no spaces and everything is lower case. While we're at it, let's go ahead and name the other button instances. Let's give them very similar names here: page1 underscore btn. BTN stands for Button. It's a clue to what kind of instance that is; page2 underscore btn and so on. Go ahead and name those page3 and page4 underscore btn. And now we're now ready to start adding the scripts to our buttons to make this navigation work and also to test out the stop actions. Let's go back to Frame 1 here, click on that keyframe and after the stop action hit the Enter key several times to move down to line 3. Type in the following line: /forward /function to handle the mouse click. That's a comment reminding us what the purpose of the script that follows and what it will do. Click down below the comment and type in the following code just as I have it written here. Let's go ahead and open this up a bit more so you can see it all - function handleClick, open parentheses p underscore event colon MouseEvent space end parentheses colon void and then that's a curly brace underneath there, an opening curly brace. The open and close curly brace keys on your keypad are going to be above your Enter or Return key. At this point notice the different colors in my Script Pane. I have this light gray for my comment. There are some blue words and there are also some black words. After you're done entering in your code your word colors should match mine here. In other words function should be blue, mouse event should be blue and void should be blue. Don't forget the uppercase letters there in Mouse Event. Let's now proceed to the next movie where I finish providing you the script to make your Navigation buttons work.