Display FLV time.

[jevans]

I am following Lee Brimlows FLV player tutorial with success but would like to add the time played and or remaining time to the player. I really haven't got a clue how to go about it.

Here is my actionscript. I assume making a textfield will be required if anyone can lend a little support with this I'd appreciate it.


stop();
var nc:NetConnection = new NetConnection();
nc.connect(null);

var ns:NetStream = new NetStream(nc);

ns.setBufferTime(30);
ns.onStatus = function(info){
if(info.code == "NetStream.Buffer.Full"){
bufferClip._visible = false;
}
if(info.code == "NetStream.Buffer.Empty"){
bufferClip._visible = true;
}
if(info.code == "NetStream.Play.Stop"){
bufferClip._visible = 0;
}
}

theVideo.attachVideo(ns);

ns.play("my_movie.flv");

rewindButton.onRelease = function() {
ns.seek(0);
}

var videoInterval = setInterval(videoStatus,100);
var amountLoaded:Number;
var duration:Number;

ns["onMetaData"] = function(obj){
duration = obj.duration;
}
function videoStatus() {
amountLoaded = ns.bytesLoaded / ns.bytesTotal;
loader.loadbar._width = amountLoaded * 210;
loader.scrub._x = ns.time / duration * 210;
}

var scrubInterval;

loader.scrub.onPress = function(){
clearInterval(videoInterval);
scrubInterval = setInterval(scrubit,10);
this.startDrag(false,0,this._y,210,this._y);
}

loader.scrub.onRelease = loader.scrub.onReleaseOutside = function(){
clearInterval(scrubInterval);
videoInterval = setInterval(videoStatus,100);
this.stopDrag();
}

function scrubit(){
ns.seek(Math.floor((loader.scrub._x/210)*duration));
}



Thanks for your time, Jason.

[atomic]

Add the following...

...
theVideo.attachVideo(ns);

ns.play("my_movie.flv");

var time_interval:Number = setInterval(checkTime, 500, ns);
function checkTime(myVideo_ns:NetStream) {
var ns_seconds:Number = myVideo_ns.time;
var minutes:Number = Math.floor(ns_seconds/60);
var seconds = Math.floor(ns_seconds%60)
if (seconds<10) {
seconds = ("0"+seconds);
}
time_txt.text = minutes+":"+seconds;
};
...

Of course you'll need to set up a time_txt textfield to display it...

[jevans]

Atomic,

It is people like you that make the world a better place :).

Seriously thanks for that, you have saved me allot of time messing around. Very much appreciated.

Regards, Jason.

[atomic]

Grrrrrrrrrreat! ;)

If you want to display the total time also, just say so, I'll provide code for that as well...

[jevans]

Well what the hay! why not. Actually only if you have the time. Would I be pushing my luck to ask for volume slider code.

Seriously thanks again.

[atomic]

To display duration... Yet another textfield...


ns.onMetaData = function(metadata) {
duration = metadata.duration;
var dur_seconds:Number = duration;
var minutes_dspl = Math.floor(dur_seconds/60);
var seconds_dspl = Math.floor(dur_seconds%60);
if (minutes_dspl<10) {
minutes_dspl = ("0"+minutes_dspl);
}
if (seconds_dspl<10) {
seconds_dspl = ("0"+seconds_dspl);
}
duration_txt.text = minutes_dspl+":"+seconds_dspl;
};


As for sound control, I'd need to see your .fla and your slider's code to help you out on that one...

[jevans]

Hello again Atomic,

The code you gave me works great!!!. Except for one small problem. I am loading swfs with my flv's into a higher level then my main movie.

When I load the first movie the time code works beautifully works beautifully. When I unload the first movie and load up an entirely different movie the time code blinks and jumps from 0 to 1 over and over.

You may have to jump back and forth from movie to movie to see what I am talking about.

http://www.knowledgenetwork.ca/temp/base.html

Any idea what might be causing such a problem?

Thanks again for your time, Jason.

[atomic]

Could it be some clearInterval problem?

Would have to look at your .fla.

Maybe I can decompile it...

[jevans]

Hey atomic,

Here are the FLA's, I could email the flv's if required.

I appreciate any light you might be able to shed here.

Thanks, Jason.

[atomic]

Yeah... Working on it! I've decompiled your .swfs and got the FLV's from the site...

It definately has to do with clearing the interval...

[atomic]

Yep, that was it...

Just clear the interval on your buttons in the base.swf...


on (release)
{
clearInterval(_level22.vidclip1.time_interval);
loadMovieNum("movie1.swf", 22);
}

on (release)
{
clearInterval(_level22.vidclip1.time_interval);
loadMovieNum("movie2.swf", 22);
}


Seems to work fine then! ;)

[jevans]

Thanks once again. I wish I could offer something in return. Obviously not my actionscripting skills, maybe I could wash your car.

Seriously thanks.

Jason.

[atomic]

Grrrrrrreat! ;)

[aidanmack]

Hi guys, Just been looking through your posts on this thread,
The code that you have writen Atomic, would that only work if I was to create my own flv playback using the flv custom UI? Its just i have skinned a flvPlayback componet but now i would like to add the the total time code you have been so kind as to write for us!
Also will this code work if your streaming from a url??
Thanks
Aidan

[asscripter]

For FLVPlayback component, the code syntax is a lil bit different.

FLVPlayback.onMetaData = function(metadata) { //jsut changed ns to FLVPlayback
duration = metadata.info.duration; //just changed 'metada.duration' to 'metadata.info.duration'
var dur_seconds:Number = duration;
var minutes_dspl = Math.floor(dur_seconds/60);
var seconds_dspl = Math.floor(dur_seconds%60);
if (minutes_dspl<10) {
minutes_dspl = ("0"+minutes_dspl);
}
if (seconds_dspl<10) {
seconds_dspl = ("0"+seconds_dspl);
}
duration_txt.text = minutes_dspl+":"+seconds_dspl;
};

[aidanmack]

Thanks very much that!
How does that code interact with the instance of my flv player though?
I caunt see anywhere to put the instance name of my player.

thanks
Aidan

[atomic]

FLVPlayback.onMetaData = function(metadata) {...

The bolded is the instance name!

[HeavyPops]

anyone know how to make the scrub bar clickable?

the i have gets canceled out by the total time code:

/* Load Video ************************************************** **********************************************/
var duration:Number = 0;
var ratio:Number = 0;
var idTracking:Number = 0;
var idLoading:Number = 0;

var nc:NetConnection = new NetConnection();
nc.connect(null);
var ns:NetStream = new NetStream(nc);
videoPlayer.attachVideo(ns);
ns.play("myVideo.flv");

ns.onMetaData = function(evt:Object):Void {
duration = evt.duration;
ratio = track._width / duration;
idTracking = setInterval(updateKnob, 50);
idLoading = setInterval(updateLoader, 50);
};

/* Video end listener ************************************************** **************************************/
ns.onStatus = function(evt:Object):Void {
if (this.time > 0 && this.time >= (duration - 0.5)) {
/*trace("Video complete");*/
ns.seek(0);
ns.pause(true);
knob._x = track._x + ns.time * ratio;
/*clearInterval(idTracking);*/
idTracking = setInterval(updateKnob, 50);
/*delete this.onStatus;*/
btnPlay._visible = true;
}
};

/* Play/Pause ************************************************** **********************************************/
btnPause.onRelease = function() {
ns.pause(true);
btnPlay._visible = true;
}
btnPlay.onRelease = function() {
ns.pause(false);
btnPlay._visible = false;
}

btnPlay._visible = false;

/* Rewind Button ************************************************** *******************************************/
btnRewind.onPress = function()
{
ns.seek(0);
}

/* FF and RW buttons ************************************************** ***************************************/
var id:Number;

ff.onPress = function():Void {
id = setInterval(function():Void {
ns.seek(ns.time + 0.5);
}, 100);
}
ff.onRelease = function():Void {
clearInterval(id);
}

rw.onPress = function():Void {
var dest:Number = ns.time;
id = setInterval(function():Void {
ns.seek(dest -= 1);
}, 100);
}
rw.onRelease = function():Void {
clearInterval(id);
}

/* Progress bar ************************************************** ********************************************/
function updateKnob():Void {
knob._x = track._x + ns.time * ratio;
}

knob.onPress = function():Void {
clearInterval(idTracking);
ns.pause(true);
this.onMouseMove = function():Void {
if (track._xmouse > 0 && track._xmouse < loader._width) {
this._x = track._x + track._xmouse;
}
}
}
knob.onRelease = function():Void {
delete this.onMouseMove;
ns.seek((this._x - track._x) / ratio);
ns.pause(false);
idTracking = setInterval(updateKnob, 50);
}
knob.onReleaseOutside = knob.onRelease;

function updateLoader():Void {
loader._xscale = ns.bytesLoaded / ns.bytesTotal * 100;
if (loader._xscale >= 198) {
loader._xscale = 200;
clearInterval(idLoading);
}
}

track.onRelease = function():Void {
if (this._xmouse > 0 && this._xmouse < loader._width) {
clearInterval(idTracking);
idTracking = setInterval(updateKnob, 50);
ns.seek(this._xmouse / ratio);
}
}

stop();

p.s. sorry i'm not sure how to put the code in those scrolling brackets

[kasraa]

Dear Atomic, I read this topic.
Now I would like to add the time played, remaining and total time I have to mention that I skinned a flvPlayback componet. My FLV instance name is display would you plaese (I beg you) give the whole code to ad in first frame to get it.

Many thank in advance
kasra

[atomic]

Attach your own .fla...

But I'll be in & out in the next few days... Pretty buzy!

[kasraa]

Thank you Atomic ..I know it would be very easy for some expert like you.
Here is my FLA.
Thanks in advance

[kasraa]

Dear Atomic
This one is CS3 version with cuepoint ....

[atomic]

Need the .fla in a Flash 8 format, not a CS3 one.

[kasraa]

Dear Atomic,

Here is the flash 8 version.

Thank you.

Waiting for your help.

[atomic]

Do you have a link to this myface.flv, so that I can download it?

[kasraa]

No I don't :(

[atomic]

How heavy is the myface.flv? Is it under 10MBs?

[kasraa]

Yes, it is under 10mb.

[atomic]

Then mail it to me. I'll provide an address through a PM.

[kasraa]

Thank you Atomic,

I've sent it to your email.

many many thanks.... waiting for ur reply.

I really appreciate your tiem and help.

[atomic]

Well, 2:30am here... This will have to wait till tomorrow...

[atomic]

Here... Sorry for the late reply, but it was my wife & son's birthdays today!

Enjoy!

[kasraa]

Hello Mr.Atomic.
I don't know how to thank you... God bless you and your Family.
Happy birthday to your wife and your son.
Thanks a lot from my heart
I have to learn another words to say thank you...
I know these words are not enough to appreciate your help

[atomic]

Grrrrrrrrreat! ;)

Is that really your face & drawing?

[kasraa]

No :)
My sister is drawing... and the face is one of her friend.

[atomic]

Very nice! ;)

[kasraa]

Hello Mr.Atomic,

it is me and my sister again.. we are here to bother you again... so sorry but we tried to add something to the fla but we couldn't... we are not as expert as you .. so sorry for taking your time again.
We've added the button " Lessons" so whenever people wants to get some lesson they click on this button. what we want is to STOP the movie at the same time the button has clicked and when they check the lessons webpages they could come back and CONTINUE the rest of movie.
It would be great if after clicking the Lessons button it changes to Continue button .....

We don't know what to do .... we just add the "stopAllSounds();" action on the lesson button :( .... please please don't be mad ... and Help us .. thank you very very much.

Sorry to send this email to your email address, because of the zip file size.

Thanks in advance

[atomic]

Use the following script on your button...


on (release){
if(this._parent.lessonbut.label == "lessons"){
this._parent.lessonbut.label = "continue";
// stop the player...
this._parent.display.pause();
stopAllSounds();
// Open the window...
getURL("javascript:window.open('http://www.geocities.com/~jlhagan/K9-14/part_two_portrait.htm','','height=600,width=800,to olbar=no,scrollbars=yes'); void(0);");
}else{
this._parent.lessonbut.label = "lessons";
//start the player...
this._parent.display.play();
}
}


Works fine...

[kasraa]

Hello Mr.Atomic,

Thank you very very much ... It works ... but .. can I say something?

When we imported the other movie like "otherface.flv" with the same instance name "display" the lesson button works when you click to stop the movie and it change to continue BUT it does NOt work when you click on continue, I mean the movie is not playing again!
We have tried with other movies but it is the same ... the button Stop and play is working JUST with the first FLV movie which called "myface.FLV"
I've sent the movie "otherface.FLV" to your email address _ excuseme please _
and if you check you would see after importing any other movie like otherface.flv the continue action dose not play the movie again!

Please forgive us for taking your time

[atomic]

Remove (or comment out as I did below...) the stopAllSounds(); action, it's conflicting with the player...


on (release){
if(this._parent.lessonbut.label == "lessons"){
this._parent.lessonbut.label = "continue";
// stop the player...
this._parent.display.pause();
//stopAllSounds();
// Open the window...
getURL("javascript:window.open('http://www.geocities.com/~jlhagan/K9-14/part_two_portrait.htm','','height=600,width=800,to olbar=no,scrollbars=yes'); void(0);");
}else{
this._parent.lessonbut.label = "lessons";
//start the player...
this._parent.display.play();
}
}


And something else I just noticed, that you might want to change...

If the user uses the play or stop button (the ones in the control...), then that should change the label of the lessonbtn accordingly, otherwise he will need to press the button twice for it to change....

[kasraa]

Hello Mr.Atomic.

We don't know how to thank you.. you are the one who people should learn about... Thank you mllion times.
We appreciate your help.

[atomic]

Grrrrrrrrrrrrrrrrrrrreat! ;)

I've always admired people who can draw! I just can't!

[kasraa]

You know what ... you CAN draw.... just the way of drawing is different ... you draw with scripts :) .. you draw the smile on people's face when you helping them out.

Thank you

[atomic]

Thanks! Appreciate that! ;)

[kasraa]

Thanks! Appreciate that! ;)

Hi again Mr Atomic,
Hope you and your family doing well.
Yes, it is me again.. here to bother you...but your heart is big ....we know that..thank you.

Actually I was looking for some script to show how many times our flv has viewd and is that possible to understand how long has viewd... foe example our movie is about 2 minutes and somehow we can get the trace and see after month our flv has viewed by 200 people or 200 Times or 400 minutes.

I thought maybe there would be some trace statement for flash movie.. I've know idea.

Maybe it si better to open another topic for this but I did not get how to do that..sorry about that.
Please help us as usual...

Thanks in advance

[atomic]

No, since I guess what you want is really statistics, Flash can't do that on it's own.
You would need some server side scripting such as PHP, that can store variable values gathered from within the Flash movie in a server text file, that you can then view opening that text file.
Thus each time a video is started playing, you can store a variable (how many times the video was started)... You can store another one (through a cue point in the video) when the video was viewed at least until the middle of it, and one last variable if the video was screened to the end of it...

Guess that's how it could be done... But since I'm not really familiar with PHP, I can't really help you more than that...

[kasraa]

Hi atomic,

Thanks a lot,

your words are helpful as usual.

thank you very much.

[atomic]

Grrrreat! And good luck!

[kasraa]

Hello dear Mr.Atomic,

It is me again.

Mr.Atomic could you please let me know how can I show the Loading bar (like youtube) before starting the FLV movie, because of internet speed whensome people click on the video the page goes blank (sometimes for a while) and we need to let people know what is happening and wait for loading.

I really appreciate
Thanks in advance

[atomic]

You know with all the .flas that are sent to me, I do have to get rid of them after some time...

It would be better if you mailed me your present .fla, so that I can set it up for you...

[atomic]

Not quite sure what you actually want...
Since this video starts streaming in as soon as you hit the page (autoPlay = true), this works fine on fast connections... But on slow connections, it surely doesn't play without breaks on the initial download...
So do you want me to add a preloader, and that the video not play until at least 80% of the video has preloaded, or should I just add a loading bar, and not keep the player from playing...

Where do you want this preloading bar? Under the screen?

[kasraa]

Hello Mr.Atomic.

Sorry for atking your time.

As you mentioned the first way is what exactly I need; to add a preloader, and that the video not play until at least 50% or 80% of the video has preloaded. And the preloading bar could be in the middle/centre of movie.

Many many thanks

[atomic]

Not related to your preloader question, but how come in your last provided .fla & .flv, the lessons & continue button doesn't work anymore?
Have you changed anything regarding that?
The lessons button brings up the page, but the continue button doesn't work anymore, and doesn't re-start the .flv?

[kasraa]

HI dear Atomic,
Oh, yes...I've sent you the old file which I thought it would be lighter and easier to send.
In my last version all buttons work properly...I hope I would able to show you when it is done.
Thank you very much for your attention.
Regards,

[atomic]

You want something like this?

http://francoisgill.110mb.com/kasra/player.html

I'll finish it up by tomorrow and mail it to you...

[kasraa]

Dear Mr.Atomic,

YES.. its exactly what i want.. thank you so much.
Waiting for your mail.
many many thanks

[kasraa]

Hello Mr Atomic,

I guess you are so busy, hope that every thing is going well with you and your family.

Thanks again

[atomic]

Mail sent. ;)

[kasraa]

Thank you very much.
1000 (Thanks) + 100000 bunch of flowers

[atomic]

Grrrrrrrrrreat! ;)

[kasraa]

Grrrrrrrrrreat! ;)

Hello Atomic,

I have got another problem! sorry ... but when I try the last flash movie online the loading bar that you added last time is working properly but the animations and the sound of movie comes earlier than movie.
How may I stop the animation which I have in my cuepoint line until the process of downloading the movie is done.
I have attached the fla file which contains the animation line.

Sorry to bother you again.

waiting for your reply as you wee more than enough kink to us ..Thank you

[MSFX]

I actually sat and read all 7 pages lol, was like a sitcom lol

Nice work though Mr Atomic ;) lol :rolleyes: :)

[atomic]

Didn't know I had a talent to write sitcoms...

[kasraa]

Dear Mr.Atomic,

Sorry to take your time.
I know you are so busy... is that possible to fix my last problem with the loading bar ... I know you already spent a lot of time to teach me but I am not gonna bother you anymore... thank you in advance.

wish you all the best

[chezzka]

Hi,

I have seen here several codes that display the duration of flv videos streamed in the net. I have a stand-alone project made in Flash that is filled with videos. My professor requires the videos to have time duration display and how far the video has elapsed already. So far, all the codes I've seen are made from streamed videos attached in players. I already have a video player with controllers, and the only thing that needs to be added now is the time duration and time elapsed (i.e. 2:23/3:34). Can anybody guide me through this? My video is not streamed in the internet; it is part of a stand-alone swf and is already imported and embedded on the file.

Thanks and hoping you'd shed light on this matter :)

[atomic]

Can you upload your .fla using a file sharing site as www.rapidshare.com , and provide the link to download it from?

I'd have a look in the morning...

[chezzka]

Hi,

I've uploaded the sample .fla file and here is the URL link:
http://www.sendspace.com/file/63gnkd

I believe this is less complicated than streamed videos from the net, and how i made the file isn't too complicated as well.. the file elements such as the videos, buttons, and texts are all placed in different layers with just minimal actionscripting. And btw, the video is stopped first upon loading, it only play when the user presses the play button :)

Thank you so much again! Hoping for your help :)

[atomic]

What version of Flash are you on?

Flash 8 or CS3, or are you on MX2004 only?

[chezzka]

Hi,

The flash file is required to be in MX 2004 version. This is because all the flash files are compiled and linked in Macromedia Authorware 6.5 :)

[atomic]

Do you want to PM an address where I can send the .fla, or should I upload it to a file sharing site?

[chezzka]

Hi,

Uploading the file in sendspace or rapidshare would do :)

Thanks again! :D

[atomic]

Here it is...

http://rapidshare.com/files/136666600/biocor.fla.html

[chezzka]

Hi Mr. Atomic,

Thanks so much for the help!

I've already edited the code to fit the duration of videos playing for more than 1 minute. However, I get a bug when it hits the 1 min mark. It plays ok til 0:59 secs, but doesn't reset when it hits the 1 minute mark. to 1:00. It stays at 59 secs til the video is done.

Is there a way to display, for example 1:00 (and so on) / 1:14? I believe this involves tweaking some of the variable declarations, since the seconds depend on the current frame.. how do I manipulate or reset the number of seconds elapsed in the frame to 0 when it reaches 60 seconds (to be able to display 1:00)? I don't have problem displaying the "1:" because my videos doesn't exceed 1:45mins.. so it's fine to brute force the "1". Its really just the seconds (1:00)...

Thanks!

below is the code i edited:

this.onEnterFrame = function()
{
var duration:Number = this._totalframes/16;
var cur_time:Number = Math.ceil(this._currentframe)/16;
var seconds:Number = Math.round(cur_time);
var minutes:Number = Math.floor(duration/60);
var secs = Math.ceil(duration%60);
var trackMin = 0;
trace(duration);

if (duration<60)
{ if (seconds<10)
{
timing = "0:0"+seconds+" / 0:"+Math.ceil(duration);
}
else
{
timing = "0:"+seconds+" / 0:"+Math.ceil(duration);
}
}

else
{
if (secs<10)
{
if (seconds<10)
{
timing = "0:0"+seconds+" / "+minutes+":0"+secs;
}
else if (seconds>9&&seconds<60)
{
timing = "0:"+seconds+" / "+minutes+":0"+secs;
//if (seconds==59)
//{ trackMin=1; }
}
else //1 min mark
{
//reset to 0
//if (trackMin==1)
//{
seconds = 0;
//}
for (j=seconds; j<=secs; j++)
{ if (j<10)
{ timing ="1:0"+seconds+j+" / "+minutes+":0"+secs;
}
else
{ timing ="1:"+seconds+j+" / "+minutes+":0"+secs;
}
}
}
}
else // if %60 > 10
{
if (seconds<10)
{
timing = "0:0"+seconds+" / "+minutes+":"+secs;
}
else if (seconds>9&&seconds<60)
{
timing = "0:"+seconds+" / "+minutes+":"+secs;
}
else // 1 min mark
{
//reset to 0
//if (trackMin==1)
//{
//var cur_timeReset:Number = Math.ceil(this._currentframe)/16;
//var sec2:Number = Math.round(cur_timeReset) - Math.round(cur_timeReset);
seconds = 0;
//}

for (j=seconds; j<=secs; j++)
{ if (j<10)
{ timing ="1:0"+seconds+j+" / "+minutes+":"+secs;
}
else
{ timing ="1:"+seconds+j+" / "+minutes+":"+secs;
}
}
}
}
}

};

Thanks again and hoping we can fix this :)

[atomic]

Grrrrrrreat! ;)

I'll have a look!

[atomic]

This works fine for me...And it should work for any length...



this.onEnterFrame = function(){
var duration:Number = this._totalframes/16; // 16 is the frame rate...

// Calculate total duration time display...
var durminutes:Number = Math.floor(duration/60);
var durseconds:Number = Math.floor(duration%60);
if (durminutes<10) {
durminutes_dspl = "0"+durminutes;
}else{
durminutes_dspl = durminutes;
}
if (durseconds<10) {
durseconds_dspl = "0"+durseconds;
}else{
durseconds_dspl = durseconds;
}
var duration_dspl:String = durminutes_dspl+":"+durseconds_dspl;
//

// Calculate current time display...
var cur_time:Number = Math.ceil(this._currentframe)/16;
var curminutes:Number = Math.floor(cur_time/60);
var curseconds:Number = Math.floor(cur_time%60);
if (curminutes<10) {
curminutes_dspl = "0"+curminutes;
}else{
curminutes_dspl = curminutes;
}
if (curseconds<10) {
curseconds_dspl = "0"+curseconds;
}else{
curseconds_dspl = curseconds;
}
var curduration_dspl:String = curminutes_dspl+":"+curseconds_dspl;
//

// Display both times...
timing = curduration_dspl+" / "+duration_dspl;
};

[chezzka]

this is great! it worked! thank you so much :D:D (and for optimizing the code too hehe) i owe you a lot!

[atomic]

Grrrreat! ;)

[chezzka]

Hi Mr. Atomic,

I just have a question regarding the time duration code.. is there any alternative code or way that I can get the current time of the current frame without using "this._currentframe"?

I'm using Authorware to compile and link the flash files, but sadly Authorware does not support Actionscript 2.0, only 1.0. I've removed the Math functions in the code and used parseInt instead to convert the floating values to whole numbers. I also removed "this._totalframes" and instead input the exact number of frames and divided it to the frame rate (ie. 900/16). When I imported the file to Authorware, the total duration is displayed (because I removed the this._totalframes), but it can't run the current time... I believe it can't read "this._currentframe"... is there any alternative way to this?

Thanks again!

[atomic]

Maybe try _root._currentframe...