Vimeo Video Events (iFrame Inception)

Having difficulty getting an HTML Widget embedded Vimeo video events to be registered/fired on play/pause/video-end.

I have an init function on timeline which traverses the iframe-inside-iframe to get too where the Vimeo video is, and is able to create the player object on it. However, none of the methods or events are working, so something is failing silently and it’s not generating any errors… Hype document attached.

video_event.hype.zip (57.8 KB)

The problem is that you can’t use post message on local host (sandboxing). Meaning this should works on a server but not when you hit regular preview. I had the same discussion (on a user request recently, Vzaar) … embeds work but iFrames have this problem in Hype previews.


Error is: Unable to post message to http://localhost. Recipient has origin x-hype-iframe://aed4e7cd-542c-4df3-a775-d55160f01bdf-10755-00008ebcb079c876.

So here is a solution not using a self generated iFrame you need to “hook up” and rather generated the “bond” from within the script itself. This works with Hype Previews.

Preview
VimeoPlayerEmbed.html

Download
VimeoPlayerEmbed.hype.zip

2 Likes

Yes this works!!! thank you SO MUCH for setting up the sample working app, very simple and very elegant!

Just curious about two things:
1- Why does the other method (using hype HTML Widget) NOT work, i did actually load the original app to an s3 bucket to see if it would work, and it still didn’t
2- Why are there no error messages? the video player methods didn’t work, they return a pending promise that keeps hanging. I’d imagine if things aren’t working then there would be some message, it just fails silently.