Trigger on Vimeo/online video completion.

Jul 18, 2022

Hi, 

I am facing an issue on triggers while i am trying have a next button hidden of player and the custom button should appear/change its state post online video completion. But i think i may be making a mistake somewhere please let me know if there is a solution for this.

I am looking forward for the learners to complete the video hosted on vimeo and i am placing it as an embedded video applying below triggers :-

1. Hide Next button when timeline starts.(Works)

2. Hide Prev Button when timeline starts.(Works)

3. Change the state of Next Icon to normal when online video completes.(Not Working)

Please help!

Thanks :)

24 Replies
Russell Killips

Hello Fred,

Vimeo has a javascript api.

Using this api, code can be written that can update storyline variables. When the storyline variable is updated to 'Ended', you can have a trigger change your custom next button from hidden to normal.

Here is a link to a published storyline project:

http://www.knowledgeconstruction.com/vimeo/story.html

I have also attached the storyline project and a webobject.

The webobject has an index.html within it. It has the code to show a vimeo video and the code that updates the storyline variables. You can easily edit this code by opening the file in notepad.

 

Fred Good

Russell, this looks amazing! I understand about 80% of it... So, I can edit the html file, no problem, I see where the embed code goes in there, but where does the web object live? When I publish, does it get "packaged" with my course even though I linked to it on a local drive? I'm just not clear on how the code is linked to in the published course file.... I feel as though I'm almost there! :D

 

Joe Frascella

Russell,

When I run your SL file neither the video status or the video time fields update.  They remain blank.   I have made sure that the web object is pointed to the folder with the index.html file and I am publishing to the web.  The video will load and I can play it, just nothing populates either of the two fields. 

Any thoughts on this? 

Joe Frascella

Ah, the missing piece of the puzzle.  Thanks for the reply.  

I'm attempting, in my old age, to learn some relevant JavaScript that can be used in SL, so please excuse me for asking something that is probably very basic.   I have figured out how to get the "Videotime2" variable to populate as a percentage ( SLplayer.SetVar("Videotime2", data.percent); ) but I have been unable to figure out how to multiply that output by 100 so that it reads 0 - 100 and not .0 - 1.   

We don't want the person taking the course to be able to scrub through the video until it has played once. I was thinking that I would have to create a 2nd slide with a web object pointing to a second version of the video where the scrub bar is available and having the course move to that second slide after the first plays through.   I did not see any indication, in the Vimeo SDK documentation, that you could turn the scrub bar on/off with JavaScript. 

We want to pull from Vimeo as video content is starting to occupy too much of our available space on our LMS.

Again, thank you for your assistance and insight. 

Büsra Basar

Hello Russell,

your SL has saved us. Thank you so much!!

Would it be possible to adjust that SL Project and change the end time of the video to 80%. What I mean is the video status should change to 'ended' when user has viewed 80% of the video and not the entire video.
Unfortunately, we couldn't figure that out.

Thank you in advance!