Free Flash H.264 High Definition Video Player Example

Hei Stephen,

great work! And it's was very kind of you to provide the adjustable source, thanks a lot! I just had problems to run my videos on CS3 mac OSX until I put the path variables on the end on the INITIAL RUN-Part. Hope, it will save someones time...

/////////////////////////////////////////////////////
// INITIAL RUN
/////////////////////////////////////////////////////
stop();

//VIDEO TO BE PLAYED PATH
//Type the directory of the video to be played
var videoDirectory:String = "your directory/your_subdirectory/";
//Type the filename of the video file that you want to be played
var videoFileName:String = "your_file.mp4";


playVideo(videoFileName);

thank's, your player was very useful to me, very easy to understand and modify. :-)

Sorry if my english is basic.

do you have plans to add position seeker in this player?

No, this video player is rather out dated now. However whatever features you could want could be programmed into this. Its a completely open source example and is more meant to just get someone started.

hey, im kinda new to cs3, more of an html guy, but really like the looks of this player! ive got some videos i wanna throw up on the site but kinda unsure how to get them to play here, what part of the code to change and what type of movie file i should play them as

hope you still check here once in a while! if you could email me that would be great! thanks a bunch

when my tech guy loaded a 1920x1080 29.97 clip into the flash player for my webpage intro, i notice little video hits throughout some spots where the are flashes in the animation. can anyone tell me what we need to do to fix this.

problem clip:
http://amfilmshd.com/m/f/logo3.html

when he loaded it here, no problems persisted.

http://amfilmshd.com/m/f/logo1.html

If any of you are having problems with your HD video not starting up right away, it could be because of the placement of the streaming header. Some programs on export move the header to the end of the file, however it should be at the beginning so flash knows this is supposed to start immediately.

Well someone has created a AIR application that fixes this problem.

Get it here:
http://renaun.com/air/QTIndexSwapper.air

Thank you very much. This helped me very much.

Hey Lars,

Don't worry about putting a link to my site on your video player, its very nice - but not necessary.

Have you ever used SWFObject? It is a library that places flash pieces on html pages. I love it because it is great for sending in variables to flash through HTML. I made a quick example that sends the same video through the JS code on the HTML page.

Download it here: http://drop.io/fg9dhch

Hope this helps not just Lars, but everyone in understanding how to implement dynamic video loading through JS.

I see now that you have the video file hardcoded in the player (line 23). Could you help me get the player to play the videos through html?
Hello again, Stephen

I would be insanely happy and satisfied if you could help me with this. If you wish, you can put your name and a link to your site somewhere on the player. I will, in any case make a link to your website visible if you can help me with this player.

Once again, continue with the good work.

Hi, Stephen.

I have a folder of videos that I want to use in your Flash player, but I am not sure where I put the URL's for the videos in HDvideoplayer.html.

Can you be so kind to help me with this? Please. :) Could you made a small example and tell me where in the code you put the URL's?

Continue with the good work :)

Hello Lena,
When you re-save a .mov using QT player it will automatically move the quickstart to the back of the file if it wasnt there already. Good luck!

Video compression is an art unto itself. I would suggest reading a few books on the best compression methods for H.264 on the web. There is no single setting for compressing videos. Sorry, this is one of those things that takes time to learn and finally get right. Good luck!

I am having the same issue as Justin. I am using Premire Pro to encode the .mov. What should the settings be to start the .mov right away like in your example? When I encode a .mov it loads almost the whole mov before it starts playing. I even took the same .mov in your example and resaved it as a .mov and it will not start right away.

Thanks!
Lena

Would you share your .FLA file for this player?

Thanks!

hi Stephen

just wondering what the 'rectangle' in the middle is doing, i guess it is suppose to be a 'playing-bar' but it has no handle to 'scrub' with?


great tut....

and i hope u do more tuts... that i can read ;)

Hey Denis,

Sorry I was working on a mac when I made this and they don't save the FLA as .FLA by default. Rename the file that is biggest and has no file extension in there to .fla at the end and that should work.
I will make a not to correct this when I have some time. Thanks!

Hi,
Thanks for sharing you application. I have only one small noob question: where is the source file? I have only .swf file, and I can only run it, but not open. I guess it's very stupid question, but i'm not very familiar with details, however, i'm programming in flash for quite a long time.
Thanks,
Denis

Ello Stephen,

Ok...so I have implemented your Flash skin and it seems to work great for me. However now I am having trouble finding the right .MOV compression settings.

Here is what baffles me after much, much investigating. I had a 100 mb QT file "streaming" through your skin with the H.264 and AAC audio. The settings I was experimenting with basically was the bit-rate, frame rate, and also the fast start, compressed header, and hinted features inside the QT Pro App. I was following multiple tutorials so I can’t remember my settings!
After failing miserably to find that sweet spot (literally 22 .MOV files and counting) I discovered the fast start feature is flawed in the QT player and most Adobe packages (After Effects, Premier and even QT PRO) places the fast starts "ATOM moov" code at the end of the file...grrr. So you have to load the whole file before the movie even starts playing... I have researched ways to move the code and found a few sources one seems to be for the MP4 codec and the other involves the knowledge of C/C++ well they both do I think....
http://renaun.com/blog/2007/08/22/234/ <---mp4
http://svn.mplayerhq.hu/ffmpeg/trunk/tools/qt-f...
...which I know nothing about (since I am merely a 3D guy ) nor do I have a program to open the file to reveal the code...usually I open PHP, XML, HTML, CSS via Word Pad or Text Edit. I don’t have adobe AIR either
I would play my old 100 mb file but the animation itself has been cut in half so now I have a 50 mb file that doesn’t "stream!?" and its not a bandwidth issue even though the file size may seem large I have a FLV that is 48 mb and it "streams" on a 56k modem. Now I know that the Flash encoder has different "streaming" capabilities and functions a whole lot better while inside Flash. But like I said I had a QT movie "streaming" almost perfectly @ a 100 mb so I figured 50 mb would look a play perfectly right?
I don’t/cant use a streaming server so I am faking the streaming by using QT's progressive feature (hence the "" around all my streaming words :). By implementing the fast start plus a 30 sec buffer time, I would think it would be adequate to play straight through!

I’m pulling my hair out man!...it would be different if it never worked but it did…and now the file is smaller and It wont! Any help or point in the right direction would be much appreciated.


Thanks for your time,
-Justin

Hey Vikram,

Most generic flash players can play HD (H.264) video now. It is more upto if the user has the newest version of Flash (Moviestart edition or higher).
I would suggest using this one: http://www.jeroenwijering.com/?item=JW_FLV_Player it is highly flexible and probably the most open source player on the market. It is kind of hard to skin, but other than this one I would probably just take the one I made here and start customizing it to your needs.

Dear Stephen,

How are you, i am not a technical person , m an start up entrepreneur coming up with a video on demand portal, as we are bootstrapping we were looking out got a high defination flash player which i got from your link. but would like to know will this be helpful to fix up in my video on demand portla or if you can suggest me any alternative.

Hey Stephen,

Great tut well organized! however my video is much larger then yours and requires a buffer time to load more of the movie, but i cant seem to find where to add additional secs/time before my movie plays.

Thanks in advance!
J

Hey Melanie,

I tried to respond to you, but it said your email account did not exist.
Anyways Flash will only play .MOV H.264 files and FLV files no matter what the code is. This example does both. I hope that helps!

Hello Stephen:

Great video player!! How can I use this player with ffmpeg on my video website?

Thanks
-M

The player looks pretty cool. Where the location of the movie is set you are using a full http:// url. Have you had any experience with using a rtsp:// url here. Do you know if flash will deal with this?

Hi! Congratulations for your code. It's fantastic! I have one question: how i can change de video what you play in this code? thanks.

Hey Paul,
Glad you like the code. As all the code here this code is for you to make your own and change it with your knowledge. Of course you will have to change the size (which would include the aspect ratio) of the player to match your content. Because this was a quick post I did not get the chance to change the aspect. Good luck Paul with your changes. If you are beginner in flash and cant make your own changes then I would suggest checking out a previous posting I have made about http://www.jeroenwijering.com/?item=JW_FLV_Player this is a VERY easy to use FLV player, which now supports H.264. If that is still too much, then I would suggest hiring a flash developer. Good luck Paul!

Great code.. Thanks! I have a question though. I downloaded the .mov that you reference in the player (Transformers) but the format is different than the movie clip it loads into in your .fla file. How is it possible to ensure there is no distortion of the source file? i.e. recognize the difference aspect ratio per file loaded?

Please contact me if you have time.