Loading Random Movies

by kirupa   | filed under Flash and ActionScript

Do your animations seem to get boring when viewed repeatedly? Do you want to give the impression to your visitors that you update your site regularly but you don't feel like doing all the work that goes along with updating regularly? You may need to add some randomness to your design. A cool effect that you can see when you visit various portions of this site and this tutorial is randomly loading movies.

Randomly loading movies basically load a typical movie file, but instead of playing the same content, they load a random movie file from somewhere on your server and play them. The chances are, each time someone views your animation, a random movie would load. That gives your visitor the notion that your site changes - indirectly.

The following animation is an example. Keep reloading this page to see various other movie effects. The best thing is that each movie effect is actually an external SWF file located on the server. This tutorial will explain how to load a random external SWF file into your animation:

[ reload this page to see a different movie ]

Here's HowThe following steps for Flash MX/2004 will help you to create your own animation and load random movies into it:

1. First, create a new movie, and set its width and height to be 300 by 200 pixels. Also, set your frame rate to 25.

2. Once you have setup your movie, draw a small circle using the Oval Tool. Once you have drawn a small circle, select the circle and press F8. Don't worry about the circle's colors, etc. It won't matter as you will find out later.

3. The Convert to Symbol dialog box will appear. Select Movie Clip and press OK.

4. Now, select your newly converted circle/movie-clip and look in the Properties panel on your bottom left. In the text field marked <Instance Name> enter the word movieTarget.

5. From the same Properties panel, in the boxes marked X: and Y: enter a 0. This will place your movie clip in the top-left corner at the origin.Your info panel should look like the following image:

[ how your Properties panel should look like ]

6. Select the first frame in your timeline and press F9 to display the Actions-Frame window. Copy and paste the following code:

filename =
  ["circular.swf",
  "vibration.swf",
  "random_movement.swf"];

  path =
  "//www.kirupa.com/developer/actionscript/animation/";


  i =
  filename.length;


  k =
  Math.floor(Math.random()*i);


  loadMovie(path+filename[k],
  movieTarget);

[ add the following code to the Actions-Frame window ]

7. Preview the animation in your browser by going to File | Publish Preview | HTML.

Now, let's find out more about the ActionScript that causes your animation to load a random movie from an external location. Onwards to the next page!

Now that you have built-up some confidence knowing that it is possible to create randomly loading movies from the previous page, it is time for you to understand why the random movie code works.

Let's dissect each line:

filename = ["circular.swf", "vibration.swf", "random_movement.swf"];

path = "//www.kirupa.com/developer/actionscript/animation/";

i = filename.length;

k = Math.floor(Math.random()*i);

loadMovie(path+filename[k], movieTarget);

ApplicationIf you want to port this code to your own animations, simply replace the name of the filenames in the filename variable to that of movies that you would like to load. Also, make sure to update the path variable with the path to the folder on your site that contains your SWFs. For example, if all of the animations you would like to load are in the folder //www.kirupa.com/swf/ simply set the aforementioned URL into your path.

Finally, make sure that the target in your loadMovie function refers to the instance name of the movie clip that the external SWFs will load into. The rest of the code takes care of all the details automatically. The number of movies you specify, etc. is all taken care of. So, relax, lean back, drink a few glasses of a cold non-alcoholic beverage, and put on your favorite beach screensaver. This code not only loads random movies but also is a great stress reliever!

SummaryIn the first line you specify the names of the movie clips you would like to use in your animation. You place it in an array format because it makes it easier for you to pick one file from the list of movies. You have a counter variable i that keeps track of how many items you have added to your array. That frees your hands from having to manually enter the number of movie clips later in the Math.random() function.

The loadMovie code combines the text from path and the text from filename[k]. For example, if k happened to be 1, Flash would interpret the loadMovie line to look like the following line:

loadMovie(//www.kirupa.com/developer/actionscript/animation/vibration.swf, movieTarget);

Pretty nifty ehh? That does it for this tutorial. I have provided the source code in MX form, for the code for MX2004 is exactly the same:

Just a final word before we wrap up. What you've seen here is freshly baked content without added preservatives, artificial intelligence, ads, and algorithm-driven doodads. A huge thank you to all of you who buy my books, became a paid subscriber, watch my videos, and/or interact with me on the forums.

Your support keeps this site going! 😇

Just a final word before we wrap up. What you've seen here is freshly baked content without added preservatives, artificial intelligence, ads, and algorithm-driven doodads. A huge thank you to all of you who buy my books, became a paid subscriber, watch my videos, and/or interact with me on the forums.

Your support keeps this site going! 😇