Embedded Video

Embedding video in a Flash document involves importing it into the file and actually placing it either on your main timeline or in a movie clip timeline. This imported video file must be prepared in advance: its length and content edited and saved in its final form. In addition, the frame rate of the video you import and the Flash document frame rate must be the same.

The most common video file types you will encounter when working on Flash video projects are .avi, .mov, and .flv. AVI is a Windows format, but is supported on Macs if QuickTime is installed. MOV is a QuickTime format, and FLV is the Flash video format, which has quickly become popular because of its stunning file compression size combined with higher quality video. You will find that in most cases, other file formats are converted to the FLV format for use on the Web.

The list of supported video file formats grows depending on what other software is installed on your system. If you have QuickTime 7 (or later) installed (Windows or Mac), the following video file formats can be imported into Flash: .avi, .dv, .mpg, .mpeg, and .mov. If DirectX 9 (or later) is installed on a Windows system, you can also import video files with the .wmv and .asf Windows media file formats.

When you import a video file and embed it into your Flash project, it becomes a part of the published document. You can actually see the individual frames of the video on the Flash timeline. This gives you a lot of control over the individual frames of the video; however, it can greatly increase the file size of your project. Therefore, if the playback time is more than 10 seconds, you should consider using progressively downloaded video or streaming video with the Flash Communication Server, as discussed later in this chapter.

To import video into Flash, go to File, Import, Import Video. This brings up the Video Import Wizard (see Figure 15.1). When you are in the Video Import Wizard, you have the option to browse for the video file you want to import. Select the file and click on the Next button.

Figure 15.1. The Video Import Wizard.

Tip

At this point, if you don't have either DirectShow 9 (Windows) or QuickTime 7 or higher (Mac or Windows) installed on your system, you will get an error message. If this happens, take some time to download and install either program.

Next, you are asked how you would like to deploy the video. If you're embedding a small video clip, select the Embed Video in SWF and Play in Timeline option and then click on the Next button. We discuss other options later in this chapter.

At the next screen (shown in Figure 15.2), you can select what type of symbol you want to embed your video from the following options:

• Embedded video The video is integrated into the timeline selected when you import your video. This could be useful when you want to work with the frames of a video on the main timeline, especially if the resulting .swf contains just the video.

• Movie clip This option gives you the most control over playback of the video because movie clips can be accessed and controlled with ActionScript.

• Graphic This option encloses the video in a symbol that belongs to the main timeline. This gives you fewer options for controlling the video because a graphic symbol is not accessible to ActionScript.

Figure 15.2. The Embedding Options panel.

You can select the option to place an instance of the symbol containing the embedded video on the stage. You can also expand the timeline, if needed, to fit all the frames in the video automatically. You usually should have this option checked for embedded projects, so that your timeline is long enough to hold all of the frames needed for the embedded video. You can select the Edit option to trim the clip's start or end point before you embed the file into Flash. If you choose to edit, a new panel comes up that enables you to trim the video by resetting the start and/or end frames. This does not change the file size, but changes how many frames are visible on the timeline.

The final step is to select the video encoding profile for your video. The video encoding profile determines what level of compression is applied to your video, which is based on the version of the player for which you want to publish. The level of compression is determined by which codec you select. A codec is an algorithm that controls how video files are compressed during encoding and then decompressed during playback. If you're publishing for the Flash 8 Player, your end users will benefit from the use of the On2 VP6 video codec because it optimally combines video quality and small file size. If you're publishing for the Flash 7 Player, you should choose the Sorenson Spark video codec. This is also a great compression strategy, just not as small as the On2 codec.

After you select the video encoding profile, click the Finish button, wait for the Flash Video Encoding Process to complete, and you're finished. Flash has now encoded your video into the .flv format and embedded the video into the FLA file.

If you embed the video as a movie clip, you have access to some interesting properties. You can change the alpha and color properties for the movie clip instance, and by definition, the video inside the movie clip. You can also use the Blend modes that are available for movie clip symbols. However, applying these effects to video is processor intensive, and can cause problems for end users with slower systems.

You can also use ActionScript to control the playback of video embedded as a movie clip. For example, to stop the video from playing more than once in a continual loop, you can open the video instance, add an actions layer, and put a stop(); action in a blank keyframe on the last frame of the video's timeline. If you wanted the video to restart after the user clicks on the video itself, you could use the following code in the main timeline:

myVideo_mc.onRelease = function(){     this.gotoAndPlay(1); }

If you wanted the video to restart when the user clicks a rewind button, you could use the following code on the main timeline. This code is programmatically attached to your rewind button instance.

rewind_mc.onRelease = function(){     myVideo_mc.gotoAndPlay(1); }

You need to pay close attention to scope in a situation like this. Although using the keyword this is correct, you can also address the video movie clip directly because it is assumed you are talking to the timeline on which the rewind_mc button lives.

As with other movie clips, a video embedded in a movie clip can respond to most traditional button or movie clip event handlers and can use all the same timeline control methods to stop, rewind, pause, and play the video embedded on the timeline. The next section explores other simple ways to accomplish these tasks with video.