• Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • PrintPrint
Share this Page URL

Hour 19. Designing Your Web Site to Be M... > Task: Determine Whether a Movie Is F...

Task: Determine Whether a Movie Is Fully Loaded

In this task you'll check the _framesloaded property against the _totalframes property to determine when a loaded movie is totally loaded. Here are the steps to follow:

First, create the submovie that will be loaded. Set the document properties (Ctrl+J) to 300×300. Then create a linear animation that starts in frame 2. That is, click frame 2, select Insert Keyframe (or press F6), and then build the animation that plays through many more frames (maybe out to frame 60). If you have a series of bitmaps (like still frames of a video), this would be ideal because you want something that takes a little while to download.

In the first frame of this submovie, put a stop Action (Esc, S, T) followed by an evaluate Action (Esc, E, V). Type in the Expression field waiting=true, as shown in Figure 19.4. (You'll use this in the main movie to make the host movie wait for the submovie to load.)

Figure 19.4. The variable “waiting” is set to “true” because the host movie is going to wait until this movie is entirely downloaded.

In frame 1 on the Stage, put the Static Text “Loading…” and then create a Dynamic Text block with “0” in it , but be sure to associate a variable called “percent” with the Dynamic Text (see Figure 19.5). Also set the margins on the text wide enough to accommodate “100”. This field will show the user the status of the download.

Figure 19.5. Even though the movie's stuck on frame 1, the user will see a message that includes a Dynamic Text block containing a variable (which you'll be changing) called “percent.”

In the last frame of this movie, place a GoTo Action and set the frame parameter to 2. This will cause the animation to loop, but not all the way back to frame 1 (where the loading screen appears).

In a new folder, save this movie as submovie.fla and then do a Test Movie (Ctrl+Enter) to create an .swf called submovie.swf. (When you Test Movie, the movie just sits on frame 1—you'll control this issue from the movie into which it loads.)

Now in a new movie, draw a box that's exactly 300×300 (remove the fill), select Convert to Symbol (or press F8), call it “Holder,” and make sure it's a Movie Clip. Be sure to name the instance now on the Stage “theClip” (from the Properties panel). Now, edit the master version of this clip (just double-click it). Select View, Grid, Snap to Grid. Now select the entire square and then grab the top-left corner and snap it to the center of the clip (the little plus sign in the center of the screen).

Back in the main scene of this movie, create a button and make a total of three instances of it. In the first instance, insert a loadMovie Action with URL specified as submovie.swf, Location set to “Target,” and theClip specified in the field next to “Target.”

The other two buttons should each use a simple evaluate function using theClip.play() for one and theClip.stop() for the other.

Now it's time to create the script attached to the instance of the Holder symbol (instance name, “theClip”). Select theClip and open the Actions panel. First, insert an “onClipEvent” found under the plus button, Actions, Movie. Change the onClipEvent parameter from “load” to “EnterFrame” (the first line of the script). Then insert an evaluate Action (Esc, E, V) and type the following in the Expression parameter: percent=_framesloaded/_totalframes . This tells the Dynamic Text onscreen to display the results of dividing the number of frames completely loaded by the number of total frames (in this case, the number of frames in your submovie). This isn't complete, but let's think about it. The variable you're calling “percent” will be .5 when half the total frames load. When they're all loaded, it will equal 1. If you simply multiply this number by 100, you'll get the kind of percentages you expect. Therefore, using percent=_framesloaded/_totalframes*100 is better. Finally, just so you don't have to come back and fix this later, you can eliminate decimal values if you change the expression to an integer (a number with no decimals). The final version should look like this: percent=Math.floor(_framesloaded/_totalframes*100). Notice that the “floor” is calculated (that is, rounding down) by taking everything inside the parentheses to the right.

You're not out of the woods yet. This only tells you what percent has loaded. You want to do two things when the movie is totally loaded: tell the loaded movie to start playing and to stop checking whether it's totally loaded. You know you should still be checking when “waiting” is true, and you know the movie will be finished loading when “percent” is 100. Therefore, insert an “if” Action (either type “esc, i, f” or find if under the plus button Actions, Conditions/Loops). Into the Condition field type waiting==true && percent==100. This code looks for the condition where “waiting” is true and “percent” happens to equal 100. Notice the double equal sign. This is different from the normal equal sign, which performs an assignment (that is, percent=100 will make “percent” equal 100). The double equal sign is a comparison—more like “Does percent happen to equal 100?” Finally, add a simple play Action (that is, if the condition is true, it's time to play the movie). Also, you should turn “waiting” to false so that checking can stop. To do this, add a simple evaluate Action with waiting=false. Figure 19.6 shows the finished version of this code.

Figure 19.6. The finished code attached to the clip into which the movie loads.

Test it out. The movie should work great. If you really want to test it, put it up on a Web server and try it from a slow connection. Note that if you test it twice, it might appear to download instantly the second time. That's because the loaded movie has already downloaded to your browser's cache. Basically, you either have to clear the cache or delete the .swfs from the folder full of downloaded files (for example, Internet Explorer uses C:\WINDOWS\Temporary Internet Files).



Not a subscriber?

Start A Free Trial

  • Creative Edge
  • Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • PrintPrint