CODEWITHSUNDEEP
javascriptiphoneiossafariyoutube
Armin Cifuentes
Armin Cifuentes

Reputation: 515

Events for YouTube embed on Mobile Safari, iPhone (callback on stop)

I'm working on this mobile site, where I need to play a YouTube video in Fullscreen. So far, so good. Just a YouTube embed, and voilá.

But! (Yeah, there's always a «but»)

I need to fire an event (namely, a JS function) when the video ends. I figured Safari translated the YT embed to a <video> tag, so I tried using HTML5s video events, but didn't work:

$('video').bind('ended', function () {
    alert('Video has ended');
});

This fine piece of code works when using a <video> tag directly, but not when using a YT embed.

So, any ideas on how can I fire this function when the YT video has finished playing?

Thanks!

Upvotes: 1

Views: 945

Answers (1)

Jason
Jason

Reputation: 105

When you create your YT instance, you can provide a hash that maps events to handlers. Provide a handler for the onStateChange event, and test for the eventType that corresponds to video end ( 0 ).

new YT.Player('player', {
    events: {
        'onStateChange' : function ( eventType ) { if ( eventType.data == 0 ) { ... } }
    }
} );

See the section of YouTube's JavaScript API for events

Upvotes: 1

Related Questions