The arrival or entry page for our class Web site demonstrates some conceivably interesting design approaches combining timeline animation, ActionScript, and HTML. Now that you've picked up a basic understanding of Flash, it seems reasonable to discuss these features, as they may provide ideas and starting points for later assignments.
Layout and basic components
As you can see if you View Source, the primary markup for the entry page (index.htm) contains a simple frameset with two rows, each of which has a single frame within it. The first frame, marked (a) in the diagram, holds a page called splash.htm, which for the sake of convenience is stored in a subdirectory called splash. This page has OBJECT and EMBED containers that refer to a Shockwave movie called splash02Loader.swf. This movie takes care of the initial animation that you see when you come to the splash page.
During that animation a sequence of oval windows fly from left to right, revealing an image or tableau beneath. More is going on here than you may at first suspect.
A script within splash02Loader.swf chooses one of twelve movies, each of which contains a particular image, and loads it in the Flash display layer just above itself. Since splash02Loader.swf resides in Layer 0, the image movie is loaded into Layer 1. Next splash02loader.swf loads into the next higher layer (Layer 2) a movie called splash02Main.swf which contains the timeline animation for the moving windows and all the other visual effects. Since the windows are cutouts (that is, they have an alpha value of zero), you can see through them to the randomly selected tableau on the layer below.
There's one more interesting detail in the splash movie, but we'll come to that after we've looked at the rest of the page.
The second row and cell of the index frameset hold a page called starter.cfm, marked in the diagram as (c). That special file extension indicates that the page uses Macromedia ColdFusion for several of its components: the weekly-updated link list that appears on the left, and the gray-boxed news text that appears within the main page space. Though Macromedia now owns ColdFusion, and though it is possible to harness ColdFusion database support directly to Flash movies, what we're doing here is not so ambitious. It could have been done with regular Web pages, minus any Flash.
You'll notice in the diagram a fourth component marked (d). This one may look a bit mysterious, since it seems to be a blank line at the bottom of the second frame. In fact a second Shockwave movie is included at this point, but it has no visible content other than a white line which matches the page background. This stealthy movie is called sounder.swf; it's responsible for the sound clip that plays each time you load the entry page. There's more about this feature below.
The "MORE" button
If you mouse over the concentric circles in the upper right corner of the splash animation (shown in its "over" state and marked (b) in the diagram) you'll see a button that displays the word "MORE". Clicking this button replaces the contents of the top frame, currently the page splash.htm, with another page selected at random as a kind of design-concept teaser. (For a catalog of these teasers see the Concept Workshop page.)
The script attached to the "MORE" button generates a random number and tests it against a series of if conditions; then performs a getURL() command to load a new page in place of splash.htm. Each page contains a Flash or Quicktime movie. The movies in turn each contain some mechanism--either a frame action within a Flash movie or a META refresh in pages hosting QuickTime movies--that calls splash.htm back into the top frame.
The random sound selector
Note that no sound clip plays when the splash movie comes back after one of the workshop teasers has been displayed. This is because the sound controller, sounder.swf, resides in the lower frame, which is not reloaded.
The first frame of sounder.swf contains a script similar to the one attached to the "MORE" button. It uses a random number to select one among several Shockwave movies, each of which contains a sound clip. Like sounder.swf, the visible content of each of these movies is a blank line, so the user never sees this transition take place.
Unlike the script for the "MORE" button, the script for sounder.swf uses the loadMovie command instead of getURL. This is a simpler design (you only need a set of Shockwave movies, not a set of movies plus a set of Web pages to host them), and since we don't want the second frame to reload, it works just fine.
We use the more complicated getURL technique in the upper frame in order to include QuickTime movies that must use HTML rather than ActionScript for the transition back to splash.htm.
Source files
I've uploaded current versions of the source files for splash02Loader, splash02Main, and sounder to MMShare/entryPage on Crow. Open these files to examine the action scripts discussed above.
