Working Smart with DreamweaverFlash Integration

[ LiB ]

Working Smart with Dreamweaver/Flash Integration

If you have current versions of both Flash and Dreamweaver on your computer, you can take advantage of some wonderful integration features to make your Flash editing easier.

Flash Launch-and-Edit

The procedure for creating a Flash movie and incorporating it into a Dreamweaver HTML page involves creating the main Flash file (FLA), exporting a SWF, and launching Dreamweaver to build an HTML document that houses the SWF. If you're working away in Dreamweaver and discover that the Flash movie needs editing, you have to launch Flash, open the FLA, make your edits, and export a new SWF before coming back to Dreamweaver and continuing work on your HTML pages.

In case you want to practice using Flash integration features on the exercise files from this chapter, the chapter_16/FlashFiles folder contains several of the original FLAs for the ArtGecko site.

With launch-and-edit, the procedure is somewhat simpler:

  1. Create the FLA in Flash MX 2004, and export a SWF.

  2. In Dreamweaver, insert the SWF into an HTML document.

  3. In the Src field in the Flash Property Inspector (see Figure 16.11), browse or use Point-to-File to show Dreamweaver the FLA used to create this SWF. Dreamweaver creates a Design Note storing the information and displays a site-relative path to the source file in the Property Inspector. (This is the same mechanism used for Fireworks integration.)

    Figure 16.11. An embedded SWF and its Property Inspector, with Flash integration features highlighted.

  4. The next time you need to edit the FLA, select the SWF in your Dreamweaver document and click the Property Inspector's Edit button (see Figure 16.11). Dreamweaver will launch Flash and open the source file you specified earlier.

  5. In Flash, make your changes to the FLA. When you're done, instead of re-exporting, click the Done button (see Figure 16.12) to return to Dreamweaver. Flash exports a new SWF, and Dreamweaver now displays your document with the new movie in place.

Figure 16.12. The Flash authoring file (FLA) for an embedded SWF, showing in the special launch-and-edit version of the Flash application window.

In case you're curious about how all this interapplication communication works, you can open and examine the Design Note that makes it happen. Because Design Notes are invisible in the Site window, leave Dreamweaver and use Explorer (Windows) or the Finder (Macintosh) to examine your root folder. Design Notes are stored in that folder, within a _ notes folder. Open that folder, and you'll find a text file with the name of your SWF file, followed by the .mno extension myFile.swf.mno , for instance. Open that file in a text editor (or in Dreamweaver Code view), and you'll see the <infoitem> tag identifying the source FLA file, one for each original link in the SWF and one for each changed link. Dreamweaver accesses this Design Note to populate the Flash Property Inspector and to generate the Flash items in the site map; Flash accesses it to determine whether any links need to be updated within the original FLA when you open that file for editing.

For Dreamweaver/Flash integration to work properly, Design Notes must be enabled for your site. In the Site Definition dialog box, go to the Design Notes category and make sure the Maintain Design Notes option is selected. For more on Design Notes, see the section "Using Design Notes for Improved Workflow" in Chapter 19, "Workplace Collaboration."

Cloaking Your FLAs

Here's the problem: Every Flash project involves an FLA (authoring) file and a SWF (export) file. And Flash likes to have both of these in the same folder. This means that when you're building a website involving Flash, all of your FLAs end up inside the local root folder, and Dreamweaver wants to upload the entire contents of the local root folder to the web server. But your FLA files don't need to be on the server, taking up space and upload time.

Here's the solution: Enable cloaking for your site, and tell Dreamweaver not to upload any FLA files. Do it by opening the Site Definition dialog box (choose Site > Manage Sites, select your site, and click Edit) and going to the Cloaking category. Select the Enable Cloaking option, and also select the option to cloak files ending with .png and .fla. After you've done this, all of your FLA files show up in the Site panel with a red slash through them, and Dreamweaver will ignore them whenever you select Newer Local or choose Site > Synchronize.

Updating Links in SWF Files

If your SWF file contains links (ActionScript getURL() actions), you can change these links without launching Flash at all, using the Dreamweaver site map and the Change Links command. Do it this way:

  1. Configure your site map preferences to show dependent files. Choose Site > Edit Sites and, in the dialog box that appears, select your site and click Edit. In the Site Definition dialog box, choose the Site Map Layout category. If you haven't done so already, use the Home Page field to define a home page for your site. (You need to do this before you can use the Site Map feature.) Select the Show Dependent Files option (see Figure 16.13).

    Figure 16.13. Setting site preferences so the site map displays dependent files.

  2. In the Site window, click the Site Map button to show the site map. Your embedded SWF file will show as a dependent file of its parent HTML document. All links within the SWF file will also be shown as dependents (see Figure 16.14).

    Figure 16.14. Site map showing an HTML document, the SWF embedded within it, and the link within the SWF, along with the Change Links command.

  3. Right-click (Windows) or Ctrl-click (Macintosh) on the linked file you want to change to access the contextual menu (as shown in Figure 16.14), and choose Change Link. In the dialog box that appears, choose a new file that the SWF should link to.

When you do this, several things happen. Dreamweaver updates the getURL() action within the SWF. It also generates a Design Note noting that this has been done. The next time you launch the FLA in Flash, that Design Note will tell Flash that a link has been changed, and it will offer to change the link in the source file as well (see Figure 16.15). (If you don't let Flash update the link in the source file to match the link Dreamweaver altered in the SWF, the next time you export a SWF, the link will revert to whatever it was before you used Dreamweaver to change it because the SWF that Dreamweaver created will be overwritten.)

Figure 16.15. Launching an FLA file after Dreamweaver has updated a link in the SWF causes Flash to prompt you with this alert.

A more elegant solution to the link-update problem is to code your Flash movie so that its links are stored externally, either in a text file or XML file or as a URL parameter. That way, anyone with access to a text editor can update them, and the SWF doesn't have to be regenerated every time URL information changes. That's more of a Flash scripting topic than a Dreamweaver technique, however.

[ LiB ]

Macromedia Dreamweaver MX 2004 Demystified
Macromedia Dreamweaver MX 2004 Demystified
ISBN: 0735713847
EAN: 2147483647
Year: 2002
Pages: 188
Authors: Laura Gutman © 2008-2017.
If you may any questions please contact us: