Loading YouTube videos using the most recent YouTube embed code

[jscheuer1]

Great, I think. I'm not sure what progress we made on the issue in Firefox on the original page in this thread though.

Anyways, I see that on your other pages, unless it's there in an iframe somewhere and I missed it, you're not using the the YT javascript api. For the old style tag (object/embed) or any tag That uses the url format:

http://www.youtube.com/v/YT_VIDEO_ID

as the src of an embed or as the data attribute of an object or as the value of a param named movie that's a child of an object tag, all you need are the version=3, enablejsapi=1 and a playerapiid=someuniqueid as query values in the url, ex:

http://www.youtube.com/v/YT_VIDEO_ID?version=3&enablejsapi=1&playerapiid=someuniqueid

Once it has that, you can use the:

onYouTubePlayerReady

function to get a javascript reference to the video at the api level where you can play/pause it, react to when it's played or paused, keep abreast of its time index, set its time index, and a number of other goodies.

It's all a little arcane, but not all that hard to work with. I've use one something like (where the playerapiid is the same as the video's tag's id):

window.onYouTubePlayerReady = function(playerid){
	document.getElementById(playerid).addEventListener('onStateChange', 'stateChanges["' + playerId + '"]');
}

Where stateChanges is an object I made earlier and then later wrote a function to under the id key at the same time I created the video's tag. A function like:

function(state){alert(state);}

The state is like an event, but it's a number -1 for unstarted, 1 for playing, other numbers for other states.

And once its ready the video can be made to play and do other things by referring to its tag and using the various api methods on it.

Another important thing is that addEventListener in the above is a YT javascript api method, not the standard event model addEventListener, so works in IE less than 9 even though they don't support the standard event model. And it differs from the standard event model in that it requires no parameter for the bubble phase of the event and that the function param is given as a string, not as a function object.

It all works quite well and there are more detailed instructions/information/examples at:

https://developers.google.com/youtube/js_api_reference

[molendijk]

John, thanks for the information. I experimented with this already, though, and noticed that the YT javascript api doesn't give me all the freedom I want over my videos. It would take too much time to explain this, so let me just say I think I found a solution for the video-control issue in Firefox on the original page in this thread, see this.
Thanks,
Arie.