How to embed a Facebook public video?

[lcanavesio]

Hi team!
I want to embed a public video from Facebook but can't get it to display. It does not show me anything and the hmtl is

I clone your code and in your MediaType define { type: "facebook", name: "Facebook", match_str: "^(https?:)?\/*(www.)?facebook.com", cls: Facebook } And in markup

markup = <div class="fb-video" data-href="${this.data.caption}" data-width="500" data-allowfullscreen="true" data-autoplay="true" data-show-captions="true"> </div>

The official documentation recommends (import sdk script) I add it in the index.html and load ok

https://developers.facebook.com/docs/plugins/embedded-video-player?locale=es_ES#configurator

Any solution? Thank you so much

[JoeGermuska]

TimelineJS currently has no specific handling for Facebook.

That's great that you took a shot at implementing a media type; however, your markup is very specific to video, but the matcher would be invoked for any URL from Facebook, and non-video URLs would not work. (Also, it seems unlikely that data-href="${this.data.caption}" is exactly right -- I would think the value for data-href should be a URL, not a block of text.

If we can find a way to improve that matcher so that it only applies to video, we could consider adding the solution you provide. Are you interested in refining it, and perhaps submitting it as a pull request?

Generally with Facebook (more specifically, with Instagram), we've run into serious headaches with their app review process, which is required to support Instagram oembeds, and which seems to really not be designed for organizations like ours. But your solution doesn't look like it requires app approval, which would be great.

[lcanavesio]

Hi @JoeGermuska ! Thanks for answering

You are right, my regular expression is super basic! The idea was to quickly test if it lifted the video and then improve it.

I also started trying to understand your code which luckily is fantastic.

I will keep trying and if I can reach a favorable solution, I will do a pull request.

[lcanavesio]

@JoeGermuska I was doing tests with videos and posts. https://github.com/lcanavesio/TimelineJS3 The problem that I still can't solve is that it only loads me the first video or post it finds when MediaType executes the for. (Line 238)

Inside Sorces - Page - Expanded - Top figure id (video.php) only one

But if I add a breakpoint in the class Facebook line 26 I see that it loads the rest (id video.php) (id post.php) (id video.php) etc and shows it correctly. It's like if it doesn't finish loading everything.

That could be happening?

[kentkravitz]

I would like to add my support for this getting included. Facebook is a valuable source to have access to even if it's just videos for now.

[JoeGermuska]

@JoeGermuska I was doing tests with videos and posts. https://github.com/lcanavesio/TimelineJS3 The problem that I still can't solve is that it only loads me the first video or post it finds when MediaType executes the for. (Line 238)

I don't understand the entirety of your post, but in any case, are you suggesting that TimelineJS should somehow show as many videos as are referenced by a given Facebook URL? That seems challenging to design effectively.

[lcanavesio]

it's only one video or image per post but when changing to the next one it does not load it. But if it works for me adding a breakpoint in the mentioned line with developer tool. I do not know if it is a synchronization problem or that it cannot call the facebook SDK again then it does not resolve the video or image.