LemmyNet / lemmy-ui

The official web app for lemmy.
https://join-lemmy.org/
GNU Affero General Public License v3.0
866 stars 333 forks source link

Support for video embeds #709

Open Nutomic opened 2 years ago

Nutomic commented 2 years ago

This change removed API field post.embed_html, and added embed_url instead. This should work for Youtube, Peertube and and other sites that set the opengraph attribute in their html.

So lemmy-ui should show a video embed whenever that field is set. At the moment the implementation is a bit strange, because it only shows the embed if post.embed_title is set, which isnt always the case. I would also suggest to change the "plus" button behind which the embed is hidden, because its not clear at all what it does. Maybe just change it to a text label "watch video".

sam365724 commented 1 year ago

I'm confused, is it possible to emebd a video link already or is this still work in progress (0.16.6)?

Nutomic commented 1 year ago

This will be part of 0.17.0

dessalines commented 1 year ago

That PR does add support for video embeds from peertube, but we also need to support pictrs videos.

RobertSchuh commented 1 year ago

Could you also support onlineplayer.com?

For example: https://onelineplayer.com/player.html?autoplay=true&autopause=false&muted=true&loop=false&url=https%3A%2F%2Fcdn.discordapp.com%2Fattachments%2F701745118213832755%2F1065810962164219944%2FPDC_WIP01.mp4&poster=&time=true&progressBar=true&overlay=true&muteButton=true&fullscreenButton=true&style=light&quality=auto&playButton=true

This video player can be iframe-embedded like youtube or vimeo, but can play video files hosted elsewhere, like dropbox or discord. Or maybe implement your own video player with the same features so that links to .mp4 files hosted elsewhere can be played as videos.

Right now using this has video controls briefly show up but then gives the "no video with supported mime type found" error.

lordkitsuna commented 1 year ago

please add support for direct links to videos to be played back on site. a lot of us are all about self hosted and that includes our storage! i have a seafile and i host meme videos on it. these embed in things like Discord without issues would be nice for lemmy to also support it.

example url: https://seafile.kitsuna.net/f/ffb48fd595a34e3b8b0a/?raw=1

trymeouteh commented 1 year ago

Would like to see this feature as well for posts and comments. This will allow posts and comments to embed multiple videos in a post or comment.

Would be great if youtube, peertube and odysee was supported for video sites!

RokeJulianLockhart commented 1 year ago

I agree, @lordkitsuna. I believe that the title should be updated to reflect that.

oiwn commented 4 months ago

Yea would be nice to have feature to add code provided by video hosting. There are plenty of regional video platforms besides YouTube!

Nutomic commented 4 months ago

Video embeds are discovered using Opengraph attribute, there is no specific logic for Youtube. So it should work with any platform which provides these attributes.

graphit0 commented 1 month ago

Is there any docs regarding ogp embedding on lemmy? just looking for examples to make it work


My case is this ogp -- it's a mastodon post, not a video. I'd like to display preview either in the body or a comment of lemmy post

preview should look ~ like that

image

<meta property="og:title" content="Move fast and break things." />
<meta property="og:description" content="Design Thinking! Comic (@designthinkingcomic@mastodon.cloud)" />
<meta property="og:image" content="https://cdn.fosstodon.org/cache/media_attachments/files/112/602/710/504/014/882/small/f4e45a2b240352f7.png" />
<meta property="og:url" content="https://mastodon.cloud/@designthinkingcomic/112602710437100307" />
<meta property="og:type" content="article" />
<meta property="og:site_name" content="Mastodon.cloud" />
<meta property="article:published_time" content="2024-06-12T08:30:06.000Z" />

source for the ogp: https://shkspr.mobi/blog/2022/11/webmentions-privacy-and-ddos-oh-my/

dessalines commented 1 month ago

lemmy stores some embed info, and lemmy-ui currently shows a metadata card containing the embed title and description, if the back-end was able to fetch and store them correctly.

LizardWizardGB commented 1 week ago

Are you supposed to be able to play a PeerTube video, directly on Lemmy? Because it seems that it only gets a thumbnail and then a link to the PeerTube instance.