This post will show you how to use Open Source Media Framework to display an image for 2 seconds before displaying a video.

To display an image for 2 seconds before your video starts you'll need to use a TemporalProxyElement to apply a duration to your ImageElement.

 
var temporalProxyElement:TemporalProxyElement
     = new TemporalProxyElement(2,
				               new ImageElement(new ImageLoader(),
					       new URLResource(THUMB_URL))
					      );
 

Full Code

 
package {
	import flash.display.Sprite;
 
	import org.osmf.composition.SerialElement;
	import org.osmf.containers.MediaContainer;
	import org.osmf.image.ImageElement;
	import org.osmf.image.ImageLoader;
	import org.osmf.layout.LayoutUtils;
	import org.osmf.media.DefaultMediaFactory;
	import org.osmf.media.MediaElement;
	import org.osmf.media.MediaFactory;
	import org.osmf.media.MediaPlayer;
	import org.osmf.media.URLResource;
	import org.osmf.proxies.TemporalProxyElement;
	import org.osmf.utils.URL;
 
	[SWF(width="400", height="300", frameRate="25")]
	public class ShrelpBurst extends Sprite
	{
		private var mediaFactory:MediaFactory;
		private var mediaElement:MediaElement;
		private var mediaPlayer:MediaPlayer;
		private var mediaContainer:MediaContainer;
 
		private static var VIDEO_URL:URL = new URL("http://www.marinelayerproductions.com/_uploads/news/portugal_killer_heat.flv");
		private static var THUMB_URL:URL = new URL("http://www.marinelayerproductions.com/_uploads/news/large/midnight_blue_04_00000.jpg");
 
		private var _pause:Sprite;
		private var _play:Sprite;
 
		public function ShrelpBurst()
		{
			mediaFactory = new DefaultMediaFactory();
			var serialElement:SerialElement = new SerialElement();
			var temporalProxyElement:TemporalProxyElement = new TemporalProxyElement(2,
																	new ImageElement(new ImageLoader(),
																	new URLResource(THUMB_URL))
																	);
			serialElement.addChild( temporalProxyElement );
			mediaElement 		 = mediaFactory.createMediaElement( new URLResource(VIDEO_URL));
			serialElement.addChild( mediaElement );
 
			mediaPlayer 		 = new MediaPlayer();
			mediaPlayer.autoPlay = true;
			mediaPlayer.media 	 = serialElement;
			mediaContainer 		 = new MediaContainer();
			mediaContainer.addMediaElement( serialElement );
 
			addChild( mediaContainer );
 
			LayoutUtils.setAbsoluteLayout(mediaElement.metadata, 400, 300, 0, 0);
		}
 
	}
}
 

This entry was posted on Thursday, February 11th, 2010 at 9:10 pm and is filed under News. You can follow any responses to this entry through the RSS 2.0 feed. Responses are currently closed, but you can trackback from your own site.