Posted By

chrisaiv on 11/01/10


Tagged

osmf


Versions (?)

Who likes this?

3 people have marked this snippet as a favorite

donaldleegraham
tombarc
dubogii


OSMF: Basic Streaming Video Example


 / 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.

  1. package
  2. {
  3. import flash.display.Sprite;
  4. import flash.events.MouseEvent;
  5.  
  6. import org.osmf.containers.MediaContainer;
  7. import org.osmf.elements.VideoElement;
  8. import org.osmf.events.LoaderEvent;
  9. import org.osmf.events.TimeEvent;
  10. import org.osmf.media.MediaElement;
  11. import org.osmf.media.MediaPlayer;
  12. import org.osmf.media.MediaPlayerSprite;
  13. import org.osmf.media.URLResource;
  14. import org.osmf.net.NetLoader;
  15. import org.osmf.utils.URL;
  16.  
  17. [SWF(width="1024", height="600", backgroundColor="#000000", frameRate="30")]
  18. public class OSMF extends Sprite
  19. {
  20. private var VIDEO_URL:String = "";
  21. private const FLV:String = "http://osmf.org/videos/cathy2.flv";
  22. private var netLoader:NetLoader;
  23. private var mediaContainer:MediaContainer;
  24. private var mps:MediaPlayerSprite;
  25. private var mediaPlayer:MediaPlayer;
  26.  
  27. private var track:Sprite;
  28. private var progress:Sprite;
  29.  
  30. public function OSMF()
  31. {
  32. init();
  33. }
  34.  
  35. private function init():void
  36. {
  37. netLoader = new NetLoader();
  38. netLoader.addEventListener(LoaderEvent.LOAD_STATE_CHANGE, onLoaderStateChange, false, 0, true );
  39.  
  40. var media:VideoElement = new VideoElement( new URLResource( FLV ), netLoader );
  41.  
  42. //Video Element is added to both the MediaPlayer & MediaContainer, this is how the viz output is created
  43. mediaPlayer = new MediaPlayer( media );
  44. mediaContainer = new MediaContainer();
  45. mediaContainer.addMediaElement( media );
  46.  
  47. mps = new MediaPlayerSprite( mediaPlayer, mediaContainer );
  48. mps.addEventListener( MouseEvent.CLICK, onMouseClickHandler, false, 0, true );
  49. mps.mediaPlayer.addEventListener(TimeEvent.CURRENT_TIME_CHANGE, onCurrentTimeChangeHandler );
  50. addChild( mps );
  51.  
  52. //Init Progress Bar
  53. var trackHeight:Number = 40;
  54. var trackWidth:Number = stage.stageWidth;
  55. initMediaPlayerTrack( trackWidth, trackHeight );
  56. initMediaPlayerProgress( trackWidth, trackHeight );
  57. }
  58.  
  59. private function initMediaPlayerTrack( w:Number, h:Number ):void
  60. {
  61. track = new Sprite();
  62. track.addEventListener(MouseEvent.CLICK, onTrackClickHandler, false, 0, true );
  63. track.graphics.beginFill( 0x000000, 0.6 );
  64. track.graphics.drawRect( 0, stage.stageHeight - h, w, h );
  65. track.graphics.endFill();
  66. addChild( track );
  67. }
  68.  
  69. private function initMediaPlayerProgress( w:Number, h:Number ):void
  70. {
  71. progress = new Sprite();
  72. //Allows users to click on track for seeking
  73. progress.mouseEnabled = false;
  74. progress.graphics.beginFill( 0xffffff, 0.6 );
  75. progress.graphics.drawRect( 0, stage.stageHeight - h, w, h );
  76. progress.graphics.endFill();
  77. addChild( progress );
  78. }
  79.  
  80. private function onCurrentTimeChangeHandler( e:TimeEvent ):void
  81. {
  82. //Calculate the percentage of how far along the video is
  83. //trace( "onCurrentTimeChangeHandler:" );
  84. var percent:Number = (e.time / mps.mediaPlayer.duration );
  85. progress.scaleX = percent;
  86. }
  87.  
  88. private function onLoaderStateChange( e:LoaderEvent ):void
  89. {
  90. trace( "onLoaderStateChange:", e.newState );
  91. }
  92.  
  93. private function onTrackClickHandler( e:MouseEvent ):void
  94. {
  95. trace( track.mouseX, track.width );
  96. mps.mediaPlayer.seek( (track.mouseX / track.width) * mps.mediaPlayer.duration );
  97. }
  98.  
  99. private function onMouseClickHandler( e:MouseEvent ):void
  100. {
  101. trace( "onMouseClickHandler:", e );
  102. //Toggle the Play | Pause
  103. mps.mediaPlayer.playing ? mps.mediaPlayer.pause() : mps.mediaPlayer.play();
  104. }
  105. }
  106. }

Report this snippet  

Comments

RSS Icon Subscribe to comments
Posted By: totomurdoch on February 9, 2011

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

You need to login to post a comment.