• Global community
    • Language:
      • Deutsch
      • English
      • Español
      • Français
      • Português
  • 日本語コミュニティ
    Dedicated community for Japanese speakers
  • 한국 커뮤니티
    Dedicated community for Korean speakers
Exit
1

How to advance to next slide at end of event video?

Engaged ,
Feb 15, 2018 Feb 15, 2018

Copy link to clipboard

Copied

I have a responsive Captivate 2017 project and on one slide I have an event video. I'd like for the project to remain on the slide with the video until the video is done playing, then automatically move to the next slide. I always make custom nav buttons for my projects, so the slide has a 'next' button and a 'previous' button on it, that pause the slide after 3 secs (the extent of the slide timeline).

I also have the video hidden on entering the slide, with a custom play button with an action to show the video. The video is set to autoplay and the timing is set to duration of the video.

My on enter action for the slide is an execute javascript action and in the javascript window I have -

cp.hide("introVideo");

document.getElementsByTagName("introVideo")[0].addEventListener('ended',myFunction,false);

function myFunction(e) {

window.parent.window.cpAPIInterface.next();

}

I'm not sure if my function for moving to the next slide is correct. Though, I also tried just writing

cp.nextSlide():

in my function and that did not work either.

Any advice??

Thanks.

Views

2.7K

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
community guidelines
Community Beginner ,
Jul 23, 2019 Jul 23, 2019

Copy link to clipboard

Copied

I am also trying to advance the slide when the video ends as well. I am using Captivate 2019 on a MacBook Pro. I have tried this and it doesn't work.

window.cpAPIInterface.getElementsByTagName("VideoAction")[0].addEventListener('ended', yourFunction, false);

function yourFunction(e) {

window.cpAPIInterface.next();

}

When debugging locally in Chrome, the error seems to be the property .getElementsByTagName

If anyone has done this before successfully, advice would be greatly appreciated.

Votes

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
community guidelines
Explorer ,
Jul 23, 2019 Jul 23, 2019

Copy link to clipboard

Copied

Hello Maxk

Try document.getElementById("NameOfVideoc");

Get the element with the specified ID: NameOfVideo is the name that you supply in the properties.

You need to add a 'c' in your javascript to the end of the object's ID.

Captivate assigned a name based on the  instance name of the text caption,smart shape,video, etc...

Look in the CPM.js. file in assets/js/CPM.js to find the id.

https://helpx.adobe.com/captivate/using/common-js-interface.html

Luis

Votes

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
community guidelines
Explorer ,
Jul 24, 2019 Jul 24, 2019

Copy link to clipboard

Copied

Hello maxk,

correction:

synchronized video only, for event video check the following article

Timeline - Advanced Workflows - Captivate blog

the video player being used is dashjs-player ( more info at Dash Industry Forum)

"The event video is controlled by its control panel".

Execute the following Javascript code on the slide.

document.getElementsByTagName(“video”)[0].addEventListener(‘ended’,yourFunction,false);

function yourFunction(e) {

cp.show(“nextBtn”);

}

Luis

Votes

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
community guidelines
Community Expert ,
Jul 24, 2019 Jul 24, 2019

Copy link to clipboard

Copied

Thanks for pointing to my blog.... have explained the difference between event video and slide video over and over again, not only in that post.

Votes

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
community guidelines
Engaged ,
Jul 24, 2019 Jul 24, 2019

Copy link to clipboard

Copied

For event video, you don't need to set up any event listeners manually.

Just make sure that the "Pause slide till end of video" check box on the even video object's Timing tab is ticked (should be by default), that the slide duration is shorter than the length of the video, and that there's nothing else on the slide with a pause point that would prevent the course from progressing. If set up that way, the video will play to the end and the next slide will come up automatically without any user interaction.

Votes

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
community guidelines
Community Expert ,
Jul 24, 2019 Jul 24, 2019

Copy link to clipboard

Copied

Thaks Gaanf for that simple explanation.  For event video I always keep the default duration of 3 secs for the slide.

Votes

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
community guidelines
Community Beginner ,
Jul 24, 2019 Jul 24, 2019

Copy link to clipboard

Copied

Thank you Gaanf and Lilybiri! Setting each slide to 3 seconds and the video properties to play the rest of the slide and to pause slide until the video is finished solved the issue. I wanted users to be able to scrub the timeline forward if they needed to and leave the slide after the media has ended. This combination works perfectly without any additional JS.

Votes

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
community guidelines
New Here ,
Jul 19, 2023 Jul 19, 2023

Copy link to clipboard

Copied

LATEST

Hi! I have the same setup, but the problem I have is if the learner pauses the video, after 3 seconds it will move on to the next slide. any way to solve this?

Votes

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
community guidelines
Resources
Help resources