Solved

Flash buffer animation for flv video

Posted on 2009-04-14
7
1,964 Views
Last Modified: 2013-11-11
Hi all,

I have a flash project I am working on.

The end result is a SWF file that I embed into a web page. The SWF file loads a FLV file via progressive download and plays it.

The FLV file is just played. There is no player controls wrapped around it. There is only one custom button that sites over the video that when clicked calls an external JavaScript function to unload the SWF file.

My issue is that there is a delay of about 5-10 seconds while the video downloads/buffers before it begin playing.

How do i create a little animation that says something like "Please wait for video" during this loading phase and then disappears once the video begins playing??

I have had a look a few tutorials but they seem a bit advanced for what I'm trying to achieve.

Any advice or a link to a good tutorial would be awesome.

If you need more info please let me know.

GW.
0
Comment
Question by:GhostWerx
  • 3
  • 2
7 Comments
 
LVL 39

Expert Comment

by:blue-genie
ID: 24148741
you're embedded the video in the timeline?
there's very little way of checking what it's status is that way.
what you can try and do is add a cue point in your flv (see embed cue points) in help file
then make your animation play that and when you hit the cue point remove the animation clip.

0
 

Author Comment

by:GhostWerx
ID: 24165395
I'm not too sure if I've embedded the video on the timeline or not.

I'm a bit of a novice when it comes to flash.

I created a new AS3 project. Then went to File > Import > Import Video.

I then select to import the video already deployed on a server and set it as "progressive download".

I choose no skin.

The timeline is only 1 frame long.

On that frame I placed my own button that appears when the user hovers over the SWF file and when clicked it calls a JavaScript function within the web page that unloads the SWF file. I have loaded/unloaded the SWF using SWFObject. (http://code.google.com/p/swfobject/)

So the SWF is embedded in a page. When the page is viewed the SWF file is loaded and then begins downloading the FLV file. Once enough has been buffered it begins playing it.

How would I go about adding a "wait for video" message during this buffering stage??

Thanks.

GW.
0
 
LVL 22

Expert Comment

by:rascalpants
ID: 24367829

it sounds like you have NOT embedded the video in the timeline, since you mentioned that you are using progressive download.

And you would basically create a movieclip with a simple animation, and then place it on a layer above the video.

you then use code like the below to hide the movieclip when you are ready to play the video...


rp / ZA

// assumes your movieClip is named  "preloader"
function hidePreloader():Void
{
   preloaderClip._alpha = 0;
   preloaderClip._visible = false;
   preloaderClip.enabled = false;
}
 
 
var nc:NetConnection = new NetConnection();
nc.connect(null);
 
var ns:NetStream = new NetStream( nc );
 
// assumes your video object is named "theVideo"
theVideo.attachVideo( ns );
ns.play( "cool_vid.flv" );
 
// code to check when ready
ns.onStatus = function( theInfo:Object )
{
   var msg:String = theInfo.code
   if( msg == "NetStream.Buffer.Full" ) hidePreloader();
};

Open in new window

0
Free Tool: Subnet Calculator

The subnet calculator helps you design networks by taking an IP address and network mask and returning information such as network, broadcast address, and host range.

One of a set of tools we're offering as a way of saying thank you for being a part of the community.

 

Author Comment

by:GhostWerx
ID: 24465253
Hi rascalpants,

Thanks for your help so far.

I have decided to move away from using flash components and create my own FLV player using actionscript.

After a bit of reading up this can be done.

Are you able to point me in the right direction. Perhaps some links to a couple of tutorials would be awesome.

If you could point me in the right direction to get started I'll close this question down and award points.

Thanks.

GW.
0
 
LVL 22

Accepted Solution

by:
rascalpants earned 500 total points
ID: 24469478

Well, the first thing to do is to create a new video in the Library...  to do this, you right-click in the library, but not on anything, and you choose "New Video".  Drag the new video onto the stage, and give it an instance name... something like...  videoPlayer_mc

Then you can create a few movieclips that look like your typical video play/pause/stop/ etc. all of the things you need to use, you can custom create and turn into movieclips.

next, you need to use code like the above example I gave, to make the FLV play...  "theVideo" is the reference I used for videoPlayer_mc

one you get the video to play, you can look into other items like NetStream.pause(), NetStream.play(), etc etc.  to use your controls...

rp / ZA
0
 

Author Closing Comment

by:GhostWerx
ID: 31570253
Thanks.
0

Featured Post

Free Tool: Postgres Monitoring System

A PHP and Perl based system to collect and display usage statistics from PostgreSQL databases.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

I know the transition can be hard. We got used to the ease of use ActionScript 2 had, but honestly, it became problematic later on, especially if designers were involved in the project and found it easy to add code as they saw fit. So, this artic…
Here are some practices and techniques that can be adopted into your Flash/Flex application development process. Note: Not all "performance tips" provide an immediately-recognizable benefit.   This article does not include timing validation data,…
The goal of the tutorial is to teach the user how to select the video input device. Make sure you have an input device that in connected and work and recognized by Adobe Flash Media Live Encoder and select it in the “video input” menu.
The goal of the tutorial is to teach the user how to select which audio input to use. Once you have an audio input plugged into the laptop or computer, you will go into the audio input settings and choose which audio input you want to use.

860 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question