I’ve had several questions recently about how to add closed captioning to the Dynamic Playlist code in my tutorial on Adobe Developer Connection. I answered a comment on the article, but its not easy to find — so I thought I’d post it here to make it a bit easier.

Yes, this is pretty easy to implement, but is a bit nitpicky. Here’s how you do it.

Just add the URLs of the timed text files to the XML data for each video, like so:
<vid desc=”Popeye for President, Title and Credits”
ttURL=”myTTfile.xml” />

Then, in the initMediaPlayer function, you’d just add it as an additional attribute (ttURL) in the ‘for’ loop so it can be loaded for each video as it’s clicked, like this:

Add these three new lines of code at the end of the initVideoPlayer function:
myVid.autoRewind = true;
myVidCaptioning.source = tileList.selectedItem.ttURL;
myVidCaptioning.flvPlayback = myVid;

And finally, replace the listListener event handler with the following:
function listListener(event:Event):void {
myVidCaptioning.source = event.target.selectedItem.ttURL;
myVidCaptioning.showCaptions = false;
myVidCaptioning.showCaptions = true;
myVid.autoPlay = true;
The trick here is to hide then show the captions, so you clear out the data from the previously-selected video. It’s a bother, but this should take care of it.
Then, go into your FLA and drop an FLVCaptioning component onto the Stage, and give it an instance name of myVidCaptioning. Publish, and watch (and read) your videos. 🙂

Hope this helps… if you have any trouble…

download the example code here (video files omitted; you can grab them from the original tutorial files or change the XML to point to your own).

Another option, of course, is to insert embedded cuepoints into your video files for your captions, then use the onCuePoint event handler and display them in a dynamic text box. This is a more custom approach, but the timed text file approach above conforms more to usability standards. Your call. 🙂