Fixing peertube and ordinary video embeds. (#2676)

- Fixes #709
This commit is contained in:
Dessalines 2024-08-27 15:35:12 -04:00 committed by GitHub
parent 8c68ee450e
commit 2fdd42087a
No known key found for this signature in database
GPG key ID: B5690EEEBB952194

View file

@ -187,6 +187,7 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
{this.showBody && post.url && post.embed_title && ( {this.showBody && post.url && post.embed_title && (
<MetadataCard post={post} /> <MetadataCard post={post} />
)} )}
{this.showBody && this.videoBlock}
{this.showBody && this.body()} {this.showBody && this.body()}
</> </>
) : ( ) : (
@ -238,29 +239,44 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
</div> </div>
); );
} }
get img() {
const { post } = this.postView;
const { url } = post;
if (this.isoData.showAdultConsentModal) { get videoBlock() {
return <></>; const post = this.postView.post;
} const url = post.url;
// if direct video link or embedded video link // if direct video link or embedded video link
if (url && (isVideo(url) || post.embed_video_url)) { if (url && isVideo(url)) {
return ( return (
<div className="embed-responsive ratio ratio-16x9 mt-3"> <div className="ratio ratio-16x9 mt-3">
<video <video
onLoadStart={linkEvent(this, this.handleVideoLoadStart)} onLoadStart={linkEvent(this, this.handleVideoLoadStart)}
onPlay={linkEvent(this, this.handleVideoLoadStart)} onPlay={linkEvent(this, this.handleVideoLoadStart)}
onVolumeChange={linkEvent(this, this.handleVideoVolumeChange)} onVolumeChange={linkEvent(this, this.handleVideoVolumeChange)}
controls controls
className="embed-responsive-item col-12"
> >
<source src={post.embed_video_url ?? url} type="video/mp4" /> <source src={post.embed_video_url ?? url} type="video/mp4" />
</video> </video>
</div> </div>
); );
} else if (post.embed_video_url) {
return (
<div className="ratio ratio-16x9 mt-3">
<iframe
title="video embed"
src={post.embed_video_url}
sandbox="allow-same-origin allow-scripts"
allowFullScreen={true}
></iframe>
</div>
);
}
}
get img() {
const { post } = this.postView;
if (this.isoData.showAdultConsentModal) {
return <></>;
} }
if (this.imageSrc) { if (this.imageSrc) {