Reputation: 81
I'm embedding a live Facebook video on my web page and need to place event handlers on the video. For example, I'd like to know if the video has been paused.
With regular videos (non-live) videos, I'm able to do this by subscribing to the events using the method outlined in the Facebook documentation. Here are the docs: https://developers.facebook.com/docs/plugins/embedded-video-player/api and my example code:
FB.Event.subscribe('xfbml.ready', function (msg) {
if (msg.type === 'video') {
fplayer = msg.instance;
fplayer.subscribe('paused', facebookPauseEventHandler);
}
});
The problem is, when embedding a live video instead of an "on-demand" or pre-recorded video that has an end, the xfbml.ready event never fires. This is detrimental because you need the response, in this case "msg", in order to subscribe to the Facebook events.
I've tried using 'xfmbl.rendered' instead but the msg received when the event is fired is just '1'.
I also had tried placing event handlers on the events conducted by the player itself vs using msg.instance, but this is not possible due to cross origin policy issues (the Facebook player is inside an iFrame).
This post => Unmute facebook live video is also asking a similar question that relates to xfbml.ready not firing.
Thanks for your help.
Upvotes: 8
Views: 933
Reputation: 1
FB.Event.subscribe('xfbml.ready'...
is called on FB.XFBML.parse, you can force a new parse before your event, parsing only on your embed video parent, like this:
FB.XFBML.parse(document.getElementById('my-embed-video-id').parentNode);
FB.Event.subscribe('xfbml.ready', function(msg) {
if(msg.type === 'video'){
//do something
}
});
Upvotes: 0