Integrate Flash MX 2004 and Director MX 2004

There are no two ways about it: Flash MX 2004 is a powerful development environment for creating fun and engaging applications. Yet, there comes a time when you may need a little more control of system-related functions such as being able to detect the operating system the user is using, launching external programs, detecting default file handling applications and controlling system windows -- especially when creating distributed applications.

When you are looking to create educational reference material, presentations, CD-ROMs or complicated applications, Flash will (depending on the complexity of the project) usually fulfil the needs of the brief. But there are times when Flash on its own just doesn't cut the mustard, and needs a little more horsepower to accomplish the desired effect.

In this article, we'll look at how, by integrating Flash and Director, we can query the operating system on which the application runs, return information and make decisions based on that data.
The information presented in this article should give you the inspiration to explore the possibilities of Flash and Director integration, and give you a taste of what you can achieve with a little imagination and flair. The article source files can be downloaded by clicking here.

Example Scenario

You are building an application in Flash that needs to open several different file types (spreadsheets, PDFs, presentations, executables etc), but in order to make the application as smooth as possible, you need to check for the existence of applications that handle the types of files you are trying to open, and act accordingly.

Using Flash to check whether there is a registered file-handling application for a given file that you're trying to open is, to my mind, extremely difficult -- if not impossible -- without third party or bespoke integration tools.

…Enter Stage Left: Director MX /MX 2004!

I was recently working on a project for a CD-ROM application, and decided to create the interface in Flash. There were several sections of the application that needed to open PDF files, and I included a link to the Adobe Acrobat Reader that was included on the CD-ROM. Everything was working fine, until the client decided to add features to the project, which included opening multiple document types.

Of course, this presented a new problem: I needed to know and inform the user of whether they had installed the application required to open the document they'd selected, and Flash just wasn't up to the job on its own.

Rather than scrapping what I'd already written, I decided to investigate other methods by which I might retrieve this information, and found Director MX 2004 to be the prime candidate for the job.

How It Fits Together

The solution that I came up with was a meld of Flash and Director, where I used Flash to create the interface and act as the 'stub' to call functions within the Director application, which, in turn, was using an Xtra to perform a series of functions.

While I researched alternative methods for retrieving the information, I came across a Director Xtra called 'Buddy API', which contains over 140 functions for interfacing with the Windows API and Macintosh Toolbox.

This was the perfect Xtra for the job and, although it is a commercial Xtra, the unregistered free version includes two free functions. The Xtra contains many functions, some more useful than others. Click here for more details.

Luckily, I could use the unregistered version, as I only needed two functions from the Xtra:

• FindApp: Finds the application associated with a file type
• OpenFile: Opens a file using its associated program

Essentially, the Flash movie is embedded within a director application, and, rather than producing a Flash projector, we produce a Director Projector that interfaces with the operating system via the Director Xtra to check certain criteria, then carry out specific functions.

The flow of information from the Flash interface through Director projector for this example is outlined in the diagram below; while it's simple, let's take a quick look at the steps involved and how the two applications communicate.

Step 1 In the embedded Flash interface, the user clicks a button (in the example shown below, it's named openPDFDoco) which calls a defined function within the Director application in the following format:

openPDFDoco.onRelease = function() {
 getURL('lingo:FunctionHandler.FunctionName(Parameters)');
};

Step 2 The parameters of the file (name, extension, type) are passed to the Director movie and a custom function is called, which checks via the Buddy API Xtra whether a file handler is present for the file we wish to open.

Step 3 The Buddy API Xtra checks to see if a file handler is present using the FindApp("file type") function and returns a true or false value to the Director Projector.

Step 4 Based upon whether a file handler is present, the file is opened using the OpenFile(filename, windowSize) function of Buddy API (step 5).

Step 5 The file handler is verified and the file is opened in the relevant application.

Step 6 If the File Handler is not found for the file we are trying to open, we can either trigger an alert within the Director projector to inform the user, or we can call a function in Flash.

Step 7 We call the function to be executed at a specific frame in Flash; this could be as simple as moving the playhead to a specific frame to inform the user of the missing application for the file they're trying to open.

By planning the behavior and integration of both the Flash SWF and the Director Projector, we can have the best of both worlds -- an easy-to-maintain application with a powerful interface that's capable of many different tasks.

In the example shown below, I've implemented this methodology to create a distributable Director projector. This serves as an installer for an application -- both as a Macromedia Extension Manager file (*.mxp) and as PDF documentation (*.pdf) -- but the basic idea outlined here can be used for any number of different projects when you need expand the capabilities of Flash.

We've now discussed how the application works from a process flow point of view, so let's build the application and see how it all gels together.

Creating a Scalable Directory Structure

As with any development project that uses multiple sources of information, we need to establish a working directory structure that we can understand easily and use with the minimum of confusion; in this case, we're using Flash FLA / SWF / .as files, as well as Director Movies / Projectors and PDFs.

Create a suitable working directory structure as shown below:

It's simple, really, but, without the basic groundwork here, we could easily get in a mess later when we edit multiple files.

From the root folder for the application ('Director Application'), we have two folders ('Flash Files' and 'ISO'). The Flash Interface and relevant ActionScript files will reside in the 'Flash Files' folder. The 'ISO' folder contains the Director Movie and Projector files that we'll create later, as well as the 'Files' folder, which will contain the asset files (PDFs) for the application.

Creating the Flash Interface

You can make your Flash interface as complicated or as simple as you like; in this example, we'll create a simple interface with a single button (just to keep things simple) that will launch the PDF opening process.

Setting the Scene

• With Flash open, create a new Flash document 450 pixels wide by 300 pixels high. Accept the default frame rate and click 'OK'.
• Rename the default layer Actions and add below this two further layers, called Buttons and Interface.
• Select the first frame of the Interface layer and create an interface with a relevant header and other information to match your requirements.
• Select the first frame of the Buttons layer and create a new button called launchButton. Add the relevant graphic and text garnishes to make the button functional. Once you're happy with the button, drag an instance from the Library Panel into the first frame of the Buttons layer, naming the instance launchButton.

We're all done for the first phase of setting up the Flash movie. At the moment, there's no ActionScript to control the behavior of the button; we'll add this later, once we've set up the Director project, imported the SWF, and set up the roundtrip environment.

• Save your Flash document as Flash Interface.fla to the 'Flash Interface' folder you created earlier, and export your SWF (File > Export > Export Movie) as Flash Inteface.swf.

Importing the Flash Interface into Director

Now that we've created the basic interface, we need to import it into Director and set up a few parameters.

Setting the Scene

1. Within Director, create a new Movie (File > New Movie). From the 'Movie' tab of the Property Inspector, set the Stage Size to 450 x 300.
2. Select File > Import and locate the Flash Interface.swf that you have just exported from Flash. Click 'Add' to add it to the import list and click 'Import'.
4. If the Cast window isn't already visible, select Window > Cast to show the window and arrange it to your liking.

You should now see the imported Flash movie within the internal cast window.

5. Select the Flash movie, and select the 'Member' tab of the Property Inspector. Change the 'Name' of the movie to test. Within the same tab, click the 'Edit' button and locate the source FLA for the SWF file (Flash Interface.fla).
6. Drag an instance of the imported SWF to the stage and, with the Flash movie selected on the stage, edit the 'L' (Left) and 'T' (Top) parameters within the 'Sprite' tab of the Property Inspector to L:0, T:0.

This now allows us easily to edit the Flash SWF file via the roundtrip methodology from within Director.

7. Save your Director Movie within the Director Application/ISO directory that you created earlier.

If you now double click the Flash Movie on the stage, it will automatically launch Flash for editing. When the file is open within Flash, clicking the 'Done' button at the top left of the timeline automatically updates the embedded SWF within Director.

This makes life a lot easier; making updates becomes seamless, and reduces the chance of Flash SWF edits being lost or overwritten.

Installing the Buddy API Director Xtra

In order to make full use of what we're working to accomplish here, you'll need to install the Buddy API 3.6 Director Xtra. This Xtra is downloadable here.

Once it's downloaded, extract the contents of the .zip or .hqx file and copy the budapi.x32 file to your Director Xtras folder, which, in Windows and Macintosh, will look something like this:

Windows - c:\windows\program files\macromedia\director mx 2004\configuration\xtras

Mac OS X - /Users/~USERNAME/Library/Application Support/Macromedia/Director MX 2004/Configuration/Xtras

Adding the Lingo

If you were to try and publish your Director Projector now, things would look a little odd -- the projector would successfully be created but, when you tried to load it, it would open for about a second, then close.

Why?...Well, there's no Lingo or JavaScript code that has been added within Director. Although it may preview internally within Director without any problems, as soon as it's exported into a projector, the playback head hits the last frame of the Flash movie and quits.

We need to start adding within Director the code to control this -- a simple score script.

Note: If the Score window is not open make sure it is be selecting Window > Score.

1. Select the first frame of the behavior channel, right click and select 'Frame Script'.



2. When the script window opens, name the cast member pauseMovie and add the following code:

on exitFrame
 go to the frame
end

This script simply pauses the movie and gets rid of the annoying exiting behavior within the projector.

If you now preview your projector (File > Publish) you'll see that the projector window stays open, and we can move on to add more of the control code.