Flex 2 and the Flash Media Server are a match made in heaven. By combining the two technologies, streaming Flash videos at my office has become a nice part of my daily routine and a good excuse to add another monitor to my desktop. Whether your musical genre taste is classical or rock 'n roll, it's relatively easy to quickly create a desktop library of Flash videos. In this article, I'll describe one approach that will have you streaming in no time.

You will need the Flex 2 Builder (with Flex 2 SDK), the Flash Media Server (the Macromedia Communication Server works as well), and at least one or two Flash videos (flv). I will omit the installation details in this discussion and get to the good stuff right away. For a quick demo, try this example: www.insideflex.com/fmsvideo/bin/fmsvideo.html. The full source code is available at www.insideflex.com/fmsvideo/bin/srcview/index.html.

Stepwise, first create a new Flex 2 project in the Flex 2 Builder IDE (for this project there's one named fmsvideo_flex). The code and the explanation for the main MXML file are discussed below (see Listing 1).

The application is initialized with the initApp()1 function where the VideoDisplay control is displayed and the HttpService is called. This accomplishes two main things. First, Flex creates a VideoDisplay control (http://livedocs.macromedia.com/flex/201/langref/mx/controls/VideoDisplay.html) with no visible user interface; by setting the source attribute to an flv and the autoPlay attribute to false, the control gets displayed in the UI. Second, the data (see Listing 2) for the ComboBox video list is requested.

The creationComplete attribute includes a call to the PageLoaded()2 function that kicks off, at one-second intervals, a function that determines if the HttpService is complete; the readytoContinue()3 function loads the videos' names and labels into an array, dp, that is the dataProvider of the ComboBox control, cbxVideos.

Selecting a video triggers the comboBox's change event and the function, playVideo(cbxVideo.selectedItem.name)4, and the video begins streaming its content.

The standard Play, Mute, Pause and Stop buttons are included, providing complete playback control. Utilizing an EventListener, vidDisplay.addEventListener(Event.COMPLETE, onComplete)5 , the buttons are enabled or disabled in a logical fashion depending on the video's playback state.

This article would not be complete without discussing the placement of the Flash video flvs. You should create a new Flash Media Server application - by adding new folders (for this demo, videos\streams\_definst_) in the applications folder (for a default installation, you would end up with this folder: "C:\Program Files\Macromedia\Flash Media Server 2\applications\videos\streams\_definst_"). Copy the flvs and paste them here. If you need some flvs for your VideoPlayer, you can grab the URLs from YouTube.com and use a tool you'll find at TechCrunch - www.techcrunch.com/get-youtube-movie/. This effectively allows you to download the flvs of your choice.

I hope you found this article useful. If you have any follow-up questions, feel free to ping me at the e-mail address listed with this article. Rock on!

• CMS + eCommerce = Marriage Made in Heaven