PeerTube and Mastodon support.

[kimsible]

Feature Request

Hi, would it be possible to add embed support for Mastodon (https://joinmastodon.org) and PeerTube instances (https://joinpeertube.org/)?

Describe the solution you'd like

Maybe, the instance list accepted could be add in the back office extension options since there is no centralized domain for these services.

[clarkwinkelmann]

This extension does not contain any custom embed providers nor do I think it is meant to be.

There are two options:

• Add those providers to TextFormatter directly, that's where the list of providers is maintained https://github.com/s9e/TextFormatter
• Create a new Flarum extension that uses the TextFormatter MediaEmbed API to register those new sites https://s9etextformatter.readthedocs.io/Plugins/MediaEmbed/Add_custom/

Given the decentralized nature of the sites, I don't really see how this would be added to TextFormatter itself, other than hard-coding some domains. A new custom Flarum extension for this probably makes the most sense.

[kimsible]

Hi thank you for your answer!

This extension does not contain any custom embed providers nor do I think it is meant to be.

You mean this could not be changed caused of Flarum core limitations ?

Are you open to pull request from the community ? I mean these software are not like not maintained, these are real free Software founded and maintained by foundations and communities like Flarum. Plus standards as OpenGraph, Twitter Card, oEmbed are implemented. The only dynamic thing is the domain name, maybe the simple thing to implement is to parse any link except those which are non-standard and are really specifics ?

[dsevillamartin]

You mean this could not be changed caused of Flarum core limitations ?

This isn't the case at all. This extension's purpose is simply to enable TextFormatter plugins in a simple manner. Any further customization must be done outside this extension.

And because, as you say, the domain of those services can really be anything, I doubt a PR to TextFormatter would be possible, much less merged, as those are all specific URLs.

This behavior would most likely have to be simply code in your forum's extend.php or a separate extension of itself to implement this, as Clark mentioned earlier.

[kimsible]

Thanks for taking time to explain the details, I'm going to explore the way to create an extension.

[JoshyPHP]

I wrote the MediaEmbed plugin and I've thought a little bit about decentralized websites and how to handle them but I don't think there's a great way to simply enable all of them automatically. It's possible to make an educated guess on whether a given URL is from a Mastodon or PeerTube instance, then confirm it by scraping its content and looking at its meta tags, but you'd have to cache (and periodically refresh) the result so that you don't have to examine every link. Then the next hurdle would be that some users would eventually post content from instances that the forum owners don't want to support, so you'd have to implement an exclusion list on top of that. In the end, it wouldn't be better than manually adding the allowed instances.

If you add instances manually, each instance needs a unique name. Each instance can have multiple hosts as per the doc. Mastodon is a special case because its iframe is dynamically sized in JavaScript and it requires a listener to handle cross-document messaging. Ideally it would be handled globally with a single, common listener but it's much simpler to create one for every iframe created.

I wrote a proof-of-concept for each site, feel free to adapt it and use it for your own needs.

$id   = 'framatube';
$host = 'framatube.org';
$configurator->MediaEmbed->add(
	$id,
	[
		'host'    => $host,
		'extract' => '#/videos/\\w+/(?<id>[-0-9a-f]+)#',
		'iframe'  => ['src' => 'https://' . $host . '/videos/embed/{@id}']
	]
);

$id   = 'mastodon';
$host = 'mastodon.social';
$configurator->MediaEmbed->add(
	$id,
	[
		'host'    => $host,
		'extract' => '#/@(?<user>\\w+)/(?<id>\\d+)#',
		'iframe'  => [
			'src'    => 'https://' . $host . '/@{@user}/{@id}/embed',
			'width'  => '100%',
			'height' => '300px',
			'onload' => 'let t=this,w=t.contentWindow;w.postMessage({{id:0,type:"setHeight"}},"*");window.addEventListener("message",(e)=>{{if(e.source===w)t.style.height=e.data.height+"px"}})'
		]
	]
);