When embedding a flash object, is there a way to determine when it’s fully loaded?
That’s my basic question, but for anyone interested in the details behind it:
I am using the (DOMWindow) jQuery plugin. For those not familiar, it’s a basic overlay the appears centered on the page, above all other content which is dimmed.
Inside of the DOMWindow, I am embedded a YouTube video. The markup used to embed the video is AJAX injected.
The DOMWindow has a built in loading graphic, but the problem I am having is that the AJAX GET request is completed almost instantly, and for 3-5 seconds, I’m stuck looking at a white rectangle while waiting for the YouTube video to load.
If I could figure out how to determine when it’s finished loading, I could code a more graceful loading scheme (using a animated spinner) inside of the DOMWindow.
You should take a look at this page Youtube Player Javascript API. Subscribing to the onStateChange Event and looking for it to return 5 appears to be what you want to do.
I’ll leave my original answer, in case it might still be handy. It is below.
You may want to look at this blog entry. He is passing Flash events to javascript to monitor a video. He specifically mentions waiting for the movie to dl and attach to the player. I’m not sure these techniques work with the youtube player.