mirror of
https://git.bsd.gay/fef/nyastodon.git
synced 2024-12-26 20:43:42 +01:00
Render placeholder instead of image when MediaGallery container width isn't known
This commit is contained in:
parent
b3ff35a75c
commit
0d3612482e
1 changed files with 6 additions and 5 deletions
|
@ -237,7 +237,7 @@ export default class MediaGallery extends React.PureComponent {
|
|||
}
|
||||
|
||||
componentDidUpdate (prevProps) {
|
||||
if (this.node && this.node.offsetWidth) {
|
||||
if (this.node && this.node.offsetWidth && this.node.offsetWidth != this.state.width) {
|
||||
this.setState({
|
||||
width: this.node.offsetWidth,
|
||||
});
|
||||
|
@ -254,8 +254,7 @@ export default class MediaGallery extends React.PureComponent {
|
|||
|
||||
handleRef = (node) => {
|
||||
this.node = node;
|
||||
if (node /*&& this.isStandaloneEligible()*/) {
|
||||
// offsetWidth triggers a layout, so only calculate when we need to
|
||||
if (node && node.offsetWidth && node.offsetWidth != this.state.width) {
|
||||
this.setState({
|
||||
width: node.offsetWidth,
|
||||
});
|
||||
|
@ -276,10 +275,14 @@ export default class MediaGallery extends React.PureComponent {
|
|||
|
||||
const style = {};
|
||||
|
||||
const computedClass = classNames('media-gallery', { 'full-width': fullwidth });
|
||||
|
||||
if (this.isStandaloneEligible() && width) {
|
||||
style.height = width / this.props.media.getIn([0, 'meta', 'small', 'aspect']);
|
||||
} else if (width) {
|
||||
style.height = width / (16/9);
|
||||
} else {
|
||||
return (<div className={computedClass} ref={this.handleRef}></div>);
|
||||
}
|
||||
|
||||
if (!visible) {
|
||||
|
@ -299,8 +302,6 @@ export default class MediaGallery extends React.PureComponent {
|
|||
}
|
||||
}
|
||||
|
||||
const computedClass = classNames('media-gallery', { 'full-width': fullwidth });
|
||||
|
||||
return (
|
||||
<div className={computedClass} style={style} ref={this.handleRef}>
|
||||
{visible ? (
|
||||
|
|
Loading…
Reference in a new issue