How to make a specific video start when you click on a specific button (button1, etc.) when using a video from YouTube video.hype.zip (38.8 KB)
Someone on the forums may have worked with this before, but here's Youtube's documentation for getting this setup: https://developers.google.com/youtube/iframe_api_reference
Once you get the basic bones setup, the 'functions' available to you include functions like loadVideoById("bHQqvYy5KYo", 5, "large")
That function could be run as a Hype function (by clicking the button) but there's not a lot of of Hype-specific work needed -- it's mostly on Youtube's JS api.
Thanks
I decided to go the other way and created for each video its own timeline.On each timeline, I hid the two previous video files. But now another problem is that I only play 3 video files, there is a start button for YouTube, but the first two cannot be launched and are not clickable and there is no start button for YouTube. What could be the problem?video.hype.zip (2.6 MB)
It looks like the video groups themselves are still on top, and interfering with the click. You'll need to make sure any above elements are animating from a visible to hidden display state. Alternatively you can probably get away with checking "Ignore all pointer events" for the videoN groups.
1 Like
I took the liberty of refactoring your example and using the Youtube API to show you how to set it up.
In this Example:
There is only one video Rectangle , which just has the innerHTML of <div id="player1"></div>
The Timelines stay the same but any hide/show for the video rects has been removed.
Your background image show/hide remain.
On scene load. The video is set up in vid()
The player1 div we put in the innerHTML will become the video player.
This configures the type of video we wish to display and how it will be used.
In it I have initially left the videoId blank. So no video first loads.
I have group each button and text together and put the On Click actions on the group.
This stops you having to put the actions on both and is tidy.
When the on click action is run it will start a timeline and also run a new function loadVid().
The Groups all have an id which will be used as a condition in a Switch condition to determine which video will load into the player.
One thing I found is normally you can stop auto playing in the configuration in vid()
But looks like the loadVideo ignores that.
So I have also put a player stop in the loadVid(). which will act like autoplay = 0.
video MHv1.hype.zip (2.6 MB)
3 Likes
Super! Thanks a lot! Everything works great!
Many thanks to everyone for their help!
1 Like