Question

I’m using the VideoDisplay to play flv’s, mov’s, and mp4’s and everything is working great. They are all being loaded via progressive download and are not being streamed. What I’d like to do is to grab a single specified frame (like whatever is being shown at the 10 second mark), convert it to a bitmap and use that bitmap as the preview image for the video. I’d like to do this at runtime so I don’t have to create a preview image for every video that would be shown.

Any idea’s on how to do this? I’d rather not fake it by playing it – seeking for that specific frame and then pausing it but I may have no other choice?

Answer 1

Ryan and James are correct — the right way’s probably to extract frames at upload/transcode-time. But if that’s not an option, you could opt for using some sort of a default/placeholder image of your own (something generic or somehow suitable for all videos whose thumbs haven’t yet been captured), and just use VideoDisplay’s DisplayObject-ness to grab and then upload a frame to your server, e.g.:

<mx:Script>     <![CDATA[          var captured:Boolean;          private function creationCompleteHandler(event:Event):void         {             videoDisplay.source = 'http://yourserver/yourvideo.flv';         }          private function videoDisplay_playheadUpdate(event:VideoEvent):void         {             if (!captured && videoDisplay.playheadTime >= 10)                 capture();         }          private function capture():void         {             var bmpData:BitmapData = new BitmapData(videoDisplay.width, videoDisplay.height);             bmpData.draw(videoDisplay);              captured = true;              // Now just upload the byte array to your server for the next user             var loader:URLLoader = new URLLoader();             loader.dataFormat = URLLoaderDataFormat.BINARY;              // ... etc.         }      ]]> </mx:Script>  <mx:VideoDisplay id='videoDisplay' playheadUpdate='videoDisplay_playheadUpdate(event)' /> 

Again, it’s perhaps not the most elegant solution, but it certainly works. This way, the first user sees the generic image, but every user thereafter gets the generated thumbnail. (Which, of course, you’ll have uploaded and properly associated by then.) Make sense?