/ Published in: ActionScript 3
This example is based off of Lee Brimelow's tutorial (http://gotoandlearn.com/play.php?id=129) and updated for OSMF 1.5. You will need Flex 4.1 (http://opensource.adobe.com/wiki/display/flexsdk/Download+Flex+4) and OSMF 1.5 (http://opensource.adobe.com/wiki/display/osmf/Downloads) to make this work.
Expand |
Embed | Plain Text
package { import flash.display.Sprite; import flash.events.MouseEvent; import org.osmf.containers.MediaContainer; import org.osmf.elements.VideoElement; import org.osmf.events.LoaderEvent; import org.osmf.events.TimeEvent; import org.osmf.media.MediaElement; import org.osmf.media.MediaPlayer; import org.osmf.media.MediaPlayerSprite; import org.osmf.media.URLResource; import org.osmf.net.NetLoader; import org.osmf.utils.URL; [SWF(width="1024", height="600", backgroundColor="#000000", frameRate="30")] public class OSMF extends Sprite { private var VIDEO_URL:String = ""; private const FLV:String = "http://osmf.org/videos/cathy2.flv"; private var netLoader:NetLoader; private var mediaContainer:MediaContainer; private var mps:MediaPlayerSprite; private var mediaPlayer:MediaPlayer; private var track:Sprite; private var progress:Sprite; public function OSMF() { init(); } private function init():void { netLoader = new NetLoader(); netLoader.addEventListener(LoaderEvent.LOAD_STATE_CHANGE, onLoaderStateChange, false, 0, true ); var media:VideoElement = new VideoElement( new URLResource( FLV ), netLoader ); //Video Element is added to both the MediaPlayer & MediaContainer, this is how the viz output is created mediaPlayer = new MediaPlayer( media ); mediaContainer = new MediaContainer(); mediaContainer.addMediaElement( media ); mps = new MediaPlayerSprite( mediaPlayer, mediaContainer ); mps.addEventListener( MouseEvent.CLICK, onMouseClickHandler, false, 0, true ); mps.mediaPlayer.addEventListener(TimeEvent.CURRENT_TIME_CHANGE, onCurrentTimeChangeHandler ); addChild( mps ); //Init Progress Bar var trackHeight:Number = 40; var trackWidth:Number = stage.stageWidth; initMediaPlayerTrack( trackWidth, trackHeight ); initMediaPlayerProgress( trackWidth, trackHeight ); } private function initMediaPlayerTrack( w:Number, h:Number ):void { track = new Sprite(); track.addEventListener(MouseEvent.CLICK, onTrackClickHandler, false, 0, true ); track.graphics.beginFill( 0x000000, 0.6 ); track.graphics.drawRect( 0, stage.stageHeight - h, w, h ); track.graphics.endFill(); addChild( track ); } private function initMediaPlayerProgress( w:Number, h:Number ):void { progress = new Sprite(); //Allows users to click on track for seeking progress.mouseEnabled = false; progress.graphics.beginFill( 0xffffff, 0.6 ); progress.graphics.drawRect( 0, stage.stageHeight - h, w, h ); progress.graphics.endFill(); addChild( progress ); } private function onCurrentTimeChangeHandler( e:TimeEvent ):void { //Calculate the percentage of how far along the video is //trace( "onCurrentTimeChangeHandler:" ); var percent:Number = (e.time / mps.mediaPlayer.duration ); progress.scaleX = percent; } private function onLoaderStateChange( e:LoaderEvent ):void { trace( "onLoaderStateChange:", e.newState ); } private function onTrackClickHandler( e:MouseEvent ):void { trace( track.mouseX, track.width ); mps.mediaPlayer.seek( (track.mouseX / track.width) * mps.mediaPlayer.duration ); } private function onMouseClickHandler( e:MouseEvent ):void { trace( "onMouseClickHandler:", e ); //Toggle the Play | Pause mps.mediaPlayer.playing ? mps.mediaPlayer.pause() : mps.mediaPlayer.play(); } } }
Comments
Subscribe to comments
You need to login to post a comment.

Hi I am new to OSMF and i'm trying to get your code to work for a progressive download. It however only works locally, as soon as i add it to my hosting account, the video plays (you hear the sound) but you cannot see the video. I would appreciate it if you could supply the necessary tweeks to make this work on the server. many thanks