web-dev-qa-db-fra.com

Comment détecter quand une vidéo youtube se termine?

Je travaille sur un site qui contient une tonne de vidéos youtube intégrées, le client souhaite afficher une fenêtre contextuelle chaque fois qu'une vidéo cesse de s'afficher.

J'ai regardé l'api youtube et il semble y avoir un moyen de détecter la fin d'une vidéo:

http://code.google.com/apis/youtube/js_api_reference.html

mais je ne peux pas intégrer les vidéos telles qu'elles sont mentionnées sur cette page, car elles sont toutes déjà présentes sur le site (des milliers ont été ajoutées manuellement en collant du code intégré).

Existe-t-il un moyen de détecter la fin de ces vidéos sans modifier aucune des vidéos existantes (à l'aide de javascript)?

javascriptflashapiactionscriptyoutube
82
TK123

Cela peut être fait via l'API du lecteur youtube:

http://jsfiddle.net/7Gznb/

Exemple de travail:

    <div id="player"></div>

    <script src="http://www.youtube.com/player_api"></script>

    <script>

        // create youtube player
        var player;
        function onYouTubePlayerAPIReady() {
            player = new YT.Player('player', {
              width: '640',
              height: '390',
              videoId: '0Bmhjf0rKe8',
              events: {
                onReady: onPlayerReady,
                onStateChange: onPlayerStateChange
              }
            });
        }

        // autoplay video
        function onPlayerReady(event) {
            event.target.playVideo();
        }

        // when video ends
        function onPlayerStateChange(event) {        
            if(event.data === 0) {          
                alert('done');
            }
        }

    </script>
158
TK123