The Flash Ani(mation)S applet

Page 1 - The simplest animator

This page starts of a series of examples to demonstrate the use of the FlAniS applet for making animations. Subsequent pages deal with portals, overlays, and more complex combinations.

Each example illustrates one or more of the features of this applet, and are designed to provide an example of the HTML and "config" files needed to obtain results.

The overall goal of this project was to give you, the web page author, a toolkit for using combinations of several different techniques that have been developed in support of projects using satellite images (though as the first example illustrates, the applet has found many other applications).

In each of these examples (except as noted), the HTML is nearly identical, and looks like this:

<OBJECT classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,0,0" WIDTH="300" HEIGHT="250" id="flanis"> <PARAM NAME="movie" VALUE="../flanis.swf"> <PARAM NAME="quality" VALUE="high"> <PARAM NAME="menu" value="false"> <PARAM NAME="FlashVars" value="configFilename=flanist1.cfg"> <EMBED src="../flanis.swf" NAME="flanis" swLiveConnect="false" quality="high" menu="false" WIDTH="300" HEIGHT="250" TYPE="application/x-shockwave-flash" PLUGINSPAGE="http://www.macromedia.com/go/getflashplayer" scale="noscale" FlashVars="configFilename=flanist1.cfg"> </EMBED> </OBJECT> There are only two things that are usually changed:
  1. the HEIGHT and WIDTH specifications -- these provide the dimensions of the display (controls plus images)
  2. the config filename, shown as "flanist1.cfg" in this example.

Note also in these examples, that the location on our system of the flanis.swf file is in a unversal directory -- it will be different on your system -- so, note in the HTML above, you will need to change both instances of the "../flanis.swf" references!

Now, for the examples!

1a. The manual form: user-controlled series of images. This configuration gives users a simple slider to manually control the display of image frames. [The images here were contributed by Jim Elder of Ottawa, Canada -- Thanks, Jim!] The configuration file for this example is a text file that looks like this:

controls = setframe controls_tooltip=Use slider to move through the images setframe_label=Image Frame Number * basename = thumb_*.jpg num_frames = 10 base_starting_number=1 no_enh=true

The user controls the frame display by moving the slider.

1b. The "almost" simplest automatic form: animate a series of images. Just allow the users to stop and start the animation. (The "very simplist" form would have no controls...but I thought that was too boring!) The configuration file looks like this:

controls=startstop, toggle filenames=TVIS1.GIF, TVIS2.GIF, TVIS3.GIF no_enh=true

1c. The "other" simplest form: fade between a series of images. Just allow the users to alter the fading among the 3 images. The configuration file parameters are the same as 1b, except the for the controls and the selection of images:

controls=fader filenames=TVIS1.GIF, TIR1.GIF, WAT1.GIF fader_label=This is my fader label string no_enh=true
Note that we have also included a fader_label value. Without this, the simple label "Set fade level" is used.

A variation of this example, which uses images larger than the display window is shown here.

1d. The "other" way to fade between a series of images. Just allow the users to alter the fading among the 3 images. The configuration file parameters are the same as 1b, except the for the controls and the selection of images:

controls=startstop, speed, step fade=true fade_steps=20 filenames=TVIS1.GIF, TIR1.GIF, WAT1.GIF no_enh=true

Go to Next Page

FlAniS Home Page

If you would like more information, or have questions or suggestions, please contact Tom Whittaker