Dillon Brown

Dillon Brown Plus

Hello all!

This issue is driving me absolutely bonkers, and any assistance would be greatly appreciated! My site currently has a #vimeo container div and the vimeo iframe embed with an id of #player_1. The #vimeo container fades in after a specific amount of time delay(3200) and is hidden when the page loads. However, the vimeo video then begins playing before the #vimeo containter div fades in.

Is there an easy way to use the froogaloop.api to delay the loading of the video so that it starts when the container div is shown? The code I'm using to call the video to start playing is below, and I'm using it because I have other commands I want to execute when the video is finished loading. I've tried to add delay(3200) before the froogaloop.api line to no avail - delay(3200).froogaloop.api('play); I've also attempted to .detach both the container #vimeo div and the iframe #player_1 on page load but I can't figure out how to re-attach it again using jquery. A bit too advanced for me at the moment. I know it's probably easy but I just can't figure it out!

Here's the page --> betterlivingthroughcinema.com/sites/dwf2/v1/

jQuery(document).ready(function() {

/*
froogaloop reference to our specific iframe.
in froogaloop2 we call api functions on this object, not on the iframe anymore
*/
var f;

Froogaloop( $('#player_1')[0] ).addEvent('ready', function() {
f = $f( $('#player_1')[0] );
froogaloop.api('play');
f.addEvent('finish', function() {
$("#trailer").fadeOut();
$("#screenoverlay").fadeOut();
$("#buyfilm").fadeIn();
});
});

});

Thank you!!!

Dillon Brown

Dillon Brown Plus

Just wondering if anyone at Vimeo would have any input as to how to implement this.

On another note: Is it just me or is the documentation for the Vimeo API really confused/convoluted? Especially for those not familiar with terms such as JSON? I've gone over all the literature present on the official Vimeo API pages and am still pretty confused. What is moogaloop vs. froogaloop and are there different versions? Why do some versions of froogaloop seem to break the API? I've heard reference to moogaloop. As for implementing functions I know the list exists here
vimeo.com/api/docs/player-js

but I find it pretty vague as to how actually to implement these functions. Perhaps I'm looking in the wrong place? And the Vimeo API Playground is less help than I think it should be because I can't decipher the source code of the page well enough to implement any of the commands in my own page without much trial and error.

I hope I'm not asking too much from Vimeo. It just seems like there is such a great API with so many fantastic features but not enough good documentation or support on the message boards to allow many users to use it properly... Hopefully I'm not assuming that the API should only be used for people who have years of advanced web coding abilities...

Thanks so much.

Dillon Brown

Dillon Brown Plus

Perhaps it also would be worth pointing to a webpage/website to introduce these terms used in the API literature so that people would have a starting off point before delving into the API...

Brad Dougherty

Brad Dougherty Staff

Hi Dillon,

We are working on some improvements to our API documentation and will see if we can do anything to make it clearer.

As for the code, it looks ok, but you want to do

f.api('play');

instead of

froogaloop.api('play');

Just remember that you're calling play on the Froogaloop-wrapped player, not the Froogaloop object.

Dillon Brown

Dillon Brown Plus

Thanks Brad! Much appreciated and hope any new documentation will make it easier!

This conversation is missing your voice. Please join Vimeo or log in.