Hi Everyone..

This is the fourth (and most probably the last) installment of this series on playing FLV (and H.264 MP4) video in Flash from scratch.

Full source code for the library is here.

The related posts are:

• Part 1
• Part 2
• Part 3

For many of you, this might be the only post you are interested in. It will show you how to use the library.

Let’s start with the basics, or if you prefer, the essentials . Download the source which is here. Unzip it into your classpath, then create a new ActionScript class (I suggest FlashDevelop or for those who can deal with Eclipse (i can’t) Flex Builder). Comments are in the code.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60

package  
{
	import flash.display.Sprite;
	import flash.media.Video;
	import newcommerce.media.FLVPlayer;
	import newcommerce.media.MediaData;
 
	/**
	 * ...
	 * @author Martin Legris
	 */
	public class FLVPlayerTest extends Sprite
	{
		// Video instance to display the video
		protected var _video:Video;
 
		// player Instance to control the playback
		protected var _player:FLVPlayer;
 
		public function FLVPlayerTest() 
		{
			init();
			createChilds();
			initEvents();
			startVid();
		}
 
		protected function init():void
		{
			// create the player
			_player = new FLVPlayer();
		}
 
		protected function createChilds():void
		{
			// create the video
			_video = new Video(320, 200);
 
			// add to displayList
			addChild(_video);
 
			// connect the player with the video
			_player.video = _video;
		}
 
		protected function initEvents():void
		{
 
		}
 
		protected function startVid():void
		{
			// create a mediaData instance, with the URL of the media we want to play
			var media:MediaData = new MediaData("http://www.newcommerce.ca/as3/movie.mp4");
 
			// play the media..
			_player.playMedia(media);
		}
	}
}

List of Events
Now this is good, the video is playing, let’s look into the events generated by the FLVPlayer class. Their name is meant to be descriptive enough, and here is the full list:

• MediaSizeEvent.SIZE — dispatched when the dimensions in pixels of the video is received
• MediaEvent.STARTED_PLAYING — dispatched when the video starts playing
• MediaEvent.FINISHED_PLAYING — dispatched when the video finished playing
• MediaTimeEvent.DURATION — dispatched when the duration (seconds) of the video is received
• MediaTimeEvent.TIME -- dispatched a few times a second to update the current position of the video
• MediaEvent.ERROR — dispatched when an error is found while playing

Handling each event
First we need to update the initEvents function to add event listeners for each event…

1
2
3
4
5
6
7
8
9

protected function initEvents():void
{
	_player.addEventListener(MediaSizeEvent.SIZE, doMediaSize);	
	_player.addEventListener(MediaEvent.STARTED_PLAYING, doMediaStarted);	
	_player.addEventListener(MediaEvent.FINISHED_PLAYING, doMediaFinished);
	_player.addEventListener(MediaEvent.ERROR, doMediaError);
	_player.addEventListener(MediaTimeEvent.DURATION, doMediaDuration);
	_player.addEventListener(MediaTimeEvent.TIME, doMediaTime);
}

MediaSizeEvent.SIZE
This event carries with it the dimensions in pixels of the FLV or MP4 file. It can be used to resize the Video object accordingly, either stretching to specific dimensions while maintaining aspect ratio, or fitting it exactly.

1
2
3
4
5
6

protected function doMediaSize(evt:MediaSizeEvent):void
{
	// here we fit the Video object to the exact dimensions of the FLV video
	_video.width = evt.width;
	_video.height = evt.height;
}

MediaEvent.STARTED_PLAYING & MediaEvent.FINISHED_PLAYING
These two events simply indicate when the media starts and finishes playing. I don’t know what you want to do then, so I simply trace it to the output.

1
2
3
4
5
6
7
8
9

protected function doMediaStarted(evt:MediaEvent):void
{
	trace("media started playing");
}
 
protected function doMediaFinished(evt:MediaEvent):void
{
	trace("media finished playing");
}

MediaEvent.ERROR
Honestly, I don’t think I use this event yet, but maybe in the future. So again just trace it..

1
2
3
4

protected function doMediaError(evt:MediaEvent):void
{
	trace("media error while playing");
}

MediaTimeEvent.DURATION
This event contains the length in seconds of the media playing, in this case the FLV or MP4. This can be used to adjust your scrobbler bar.. for example, or to display in a textfield somewhere.

1
2
3
4

protected function doMediaDuration(evt:MediaTimeEvent):void
{
	trace("media is " + evt.time + " seconds long");
}

MediaTimeEvent.TIME
This event keeps you posted as to the progress of the position inside of the media. This can also be used to update your Scrobbler bar, or textfield.. It is dispatched 4 times per second, no matter how slowly or fast the media is playing.

1
2
3
4

protected function doMediaTime(evt:MediaTimeEvent):void
{
	trace("media is at " + evt.time + " seconds");
}

Other useful functions
You can also explore certain functions, which are rather straightforward; such as:

• pause
• play
• mute
• setVolume
• mute
• seek
• stop
• close
• reset

Cheers!

Martin