Question

I embed the YouTube player on my site. Is there a way using JS or the YouTube API to know when a user has clicked on the video itself, which takes him to YouTube? I can’t find a good way to differentiate Flash clicks that play/stop the video vs. clicks that cause the user to go to YouTube.

Answer 1

If you suscribe to the onStateChange event then you can be notified when the player state changes.

function onYouTubePlayerReady(playerId) {
    var player = document.getElementById("YTplayer");
    player.addEventListener("onStateChange", "onplayerStateChange");
}

Then in the onplayerStateChange You can check for a “5” value which is issued when the video is ready to be “played” for the first time or when the user clicks the video to open a new Youtube window. You should save the old value of the player state to distinguish the two cases.

function onplayerStateChange(newState) {
    if (newState == 5) {
        if (oldState == -1) {
            // First time the video loads
        } else {
            // User has just opened a new youtube window
        }
    }
    oldState = newState;
}