LemmyNet/lemmy-ui
2
0
Fork 0
mirror of https://github.com/LemmyNet/lemmy-ui.git synced 2024-11-25 13:51:13 +00:00
Code Issues Projects Releases Wiki Activity

Revert "Improved webm handling for pictrs and UI. Fixes #2072 (#2074)"

Browse source 
This reverts commit 7f993c6ce7.
This commit is contained in:
Dessalines 2023-09-29 07:43:33 -04:00
parent 8eb016d556
commit 8660a788bf
1 changed files with 14 additions and 44 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

34
src/shared/components/common/pictrs-image.tsx
View file

@ -21,37 +21,6 @@ export class PictrsImage extends Component<PictrsImageProps, any> {
} }
render() { render() {
if (this.props.src.endsWith("webm")) {
return (
<video
poster={this.src("png")}
autoPlay
loop
muted
className={classNames("overflow-hidden pictrs-image", {
"img-fluid": !this.props.icon && !this.props.iconOverlay,
banner: this.props.banner,
"thumbnail rounded object-fit-cover":
this.props.thumbnail && !this.props.icon && !this.props.banner,
"img-expanded slight-radius":
!this.props.thumbnail && !this.props.icon,
"img-blur": this.props.thumbnail && this.props.nsfw,
"object-fit-cover img-icon me-1": this.props.icon,
"ms-2 mb-0 rounded-circle object-fit-cover avatar-overlay":
this.props.iconOverlay,
"avatar-pushup": this.props.pushup,
})}
>
<source src={this.props.src} type="video/webm" />
<img
src={this.src("png")}
alt={this.alt()}
title="Unable to play webm video, your browser does not support it"
loading="lazy"
/>
</video>
);
} else {
return ( return (
<picture> <picture>
<source srcSet={this.src("webp")} type="image/webp" /> <source srcSet={this.src("webp")} type="image/webp" />
@ -69,6 +38,7 @@ export class PictrsImage extends Component<PictrsImageProps, any> {
this.props.thumbnail && !this.props.icon && !this.props.banner, this.props.thumbnail && !this.props.icon && !this.props.banner,
"img-expanded slight-radius": "img-expanded slight-radius":
!this.props.thumbnail && !this.props.icon, !this.props.thumbnail && !this.props.icon,
"img-blur": this.props.thumbnail && this.props.nsfw,
"object-fit-cover img-icon me-1": this.props.icon, "object-fit-cover img-icon me-1": this.props.icon,
"ms-2 mb-0 rounded-circle object-fit-cover avatar-overlay": "ms-2 mb-0 rounded-circle object-fit-cover avatar-overlay":
this.props.iconOverlay, this.props.iconOverlay,
@ -78,7 +48,6 @@ export class PictrsImage extends Component<PictrsImageProps, any> {
</picture> </picture>
); );
} }
}
src(format: string): string { src(format: string): string {
// sample url: // sample url:
@ -93,6 +62,7 @@ export class PictrsImage extends Component<PictrsImageProps, any> {
const host = split[0]; const host = split[0];
const path = split[1]; const path = split[1];
const params = { format }; const params = { format };
if (this.props.thumbnail) { if (this.props.thumbnail) {