Highlighted

I need to control the time of the video.

Community Beginner ,
Apr 08, 2020

Copy link to clipboard

Copied

I have a video that is played by the Adobe Animate video component. I would like that after the end of this video, the animation moves forward one frame. I need to control the time of the video. Does anyone know if this is possible in HTML5?

Adobe Community Professional
Correct answer by JoãoCésar | Adobe Community Professional

Hi again! Sorry for the long delay!

 

It turns out that the problem is much more simple than it seemed.

 

At frame 50 (49) when you write:

function fl_ClickToGoToAndPlayFromFrame_3()
{
    this.gotoAndPlay(51);
}

 

It should be:

function fl_ClickToGoToAndPlayFromFrame_3()
{
    this.gotoAndPlay(50);
}

 

Because in HTML5 documents the first frame index is 0. The way it was before, the code to detect the end of the video was never being executed.

 

I hope it helps.

 

 

Regards,

JC

TOPICS
Timeline

Views

705

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more

I need to control the time of the video.

Community Beginner ,
Apr 08, 2020

Copy link to clipboard

Copied

I have a video that is played by the Adobe Animate video component. I would like that after the end of this video, the animation moves forward one frame. I need to control the time of the video. Does anyone know if this is possible in HTML5?

Adobe Community Professional
Correct answer by JoãoCésar | Adobe Community Professional

Hi again! Sorry for the long delay!

 

It turns out that the problem is much more simple than it seemed.

 

At frame 50 (49) when you write:

function fl_ClickToGoToAndPlayFromFrame_3()
{
    this.gotoAndPlay(51);
}

 

It should be:

function fl_ClickToGoToAndPlayFromFrame_3()
{
    this.gotoAndPlay(50);
}

 

Because in HTML5 documents the first frame index is 0. The way it was before, the code to detect the end of the video was never being executed.

 

I hope it helps.

 

 

Regards,

JC

TOPICS
Timeline

Views

706

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Apr 08, 2020 0
Adobe Community Professional ,
Apr 09, 2020

Copy link to clipboard

Copied

Hi.

 

The HTML5 video component in Animate CC is basically a jQuery wrapper for the standard html video element. This means you can dectect the end of the video playback using the regular ended event. Your code could be something like this:

var targetTimeline = this;
var targetFrame = 4;
var targetTime = 3; // time in seconds

targetTimeline.stop();

setTimeout(function()
{
	var video = document.getElementById("video0"); // "video0" is the video component instance name
	
	video.addEventListener("ended", function(e)
	{
		console.log("video ended");
		targetTimeline.gotoAndStop(targetFrame); // move the target timeline to the desired frame
		e.currentTarget.currentTime = targetTime; // set the video's time position
	});
	
}, 0);

 

Please notice that the video component cannot be set to loop for the ended event to be dispatched.

 

 

Regards,

JC

__________________________________________
HTML5, JSFL, and AS3 samples: http://bit.ly/2mJgDoG

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Apr 09, 2020 0
Community Beginner ,
Apr 09, 2020

Copy link to clipboard

Copied

Hello John.
Thank you so much for your response.
I made the code this way:

 

var targetTimeline = this;
var targetFrame = 55;
var targetTime = 17; // time in seconds

targetTimeline.stop();

setTimeout(function()
{
	var video = document.getElementById("objetivo_compliance"); // "video0" is the video component instance name
	
	video.addEventListener("ended", function(e)
	{
		console.log("video ended");
		targetTimeline.gotoAndPlay(targetFrame); // move the target timeline to the desired frame
		e.currentTarget.currentTime = targetTime; // set the video's time position
	});
	
}, 0);

But after the end of the video, the timeline didn't go until frame 55.
Did I do something wrong?

 

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Apr 09, 2020 0
Adobe Community Professional ,
Apr 09, 2020

Copy link to clipboard

Copied

You're welcome.

 

Please tell me if these items are OK:

- Is your video set to be looped? If it is, please turn the loop off;

- Is "objetivo_compliance" a name you assigned to the video component by selecting it and using the Properties panel (Ctrl/Cmd + F3)?

- Does your timeline have 56 frames? Remember that in HTML5 documents the first frame has a index of 0. So 55 is the index of the 56th frame.

 

Please let me know.

 

 

Regards,

JC

__________________________________________
HTML5, JSFL, and AS3 samples: http://bit.ly/2mJgDoG

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Apr 09, 2020 0
Community Beginner ,
Apr 09, 2020

Copy link to clipboard

Copied

Hi JC.
The questions you talked about are ok.
Please see the image:

Captura de Tela 2020-04-09 às 11.59.32.png

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Apr 09, 2020 0
Adobe Community Professional ,
Apr 09, 2020

Copy link to clipboard

Copied

Everything seems to be OK.

 

Can you share your FLA?

__________________________________________
HTML5, JSFL, and AS3 samples: http://bit.ly/2mJgDoG

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Apr 09, 2020 0
Community Beginner ,
Apr 09, 2020

Copy link to clipboard

Copied

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Apr 09, 2020 0
Community Beginner ,
Apr 13, 2020

Copy link to clipboard

Copied

Hello guys!
Could someone help me with this problem?

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Apr 13, 2020 0
Adobe Community Professional ,
Apr 14, 2020

Copy link to clipboard

Copied

Hi again! Sorry for the long delay!

 

It turns out that the problem is much more simple than it seemed.

 

At frame 50 (49) when you write:

function fl_ClickToGoToAndPlayFromFrame_3()
{
    this.gotoAndPlay(51);
}

 

It should be:

function fl_ClickToGoToAndPlayFromFrame_3()
{
    this.gotoAndPlay(50);
}

 

Because in HTML5 documents the first frame index is 0. The way it was before, the code to detect the end of the video was never being executed.

 

I hope it helps.

 

 

Regards,

JC

__________________________________________
HTML5, JSFL, and AS3 samples: http://bit.ly/2mJgDoG

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Apr 14, 2020 0
Community Beginner ,
Apr 14, 2020

Copy link to clipboard

Copied

Hello Friend!
Now it worked.
Thank you!
Helped me a lot.
Big hug and success to you.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Apr 14, 2020 1
Adobe Community Professional ,
Apr 14, 2020

Copy link to clipboard

Copied

Excellent!

 

You're welcome!

 

A huge success to you too!

__________________________________________
HTML5, JSFL, and AS3 samples: http://bit.ly/2mJgDoG

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Apr 14, 2020 0