PrivateCoffee/element-web
4
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 3

Fix scroll jump on image decryption

Browse source 
`onWidgetLoad` is now being called when an image has been decrypted so that the ScrollPanel maintains its scroll position (whether it's stuckAtBottom or not). This attempts to fix https://github.com/vector-im/riot-web/issues/2624
This commit is contained in:
Luke Barnard 2016-12-02 11:11:35 +00:00
parent 3aa1e0dd9e
commit 5665a0ef37
1 changed files with 8 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

11
src/components/views/messages/MImageBody.js
View file

@ -32,6 +32,9 @@ module.exports = React.createClass({
propTypes: { propTypes: {
/* the MatrixEvent to show */ /* the MatrixEvent to show */
mxEvent: React.PropTypes.object.isRequired, mxEvent: React.PropTypes.object.isRequired,
/* called when the image has loaded */
onWidgetLoad: React.PropTypes.func.isRequired,
}, },
getInitialState: function() { getInitialState: function() {
@ -123,6 +126,7 @@ module.exports = React.createClass({
decryptedUrl: contentUrl, decryptedUrl: contentUrl,
decryptedThumbnailUrl: thumbnailUrl, decryptedThumbnailUrl: thumbnailUrl,
}); });
this.props.onWidgetLoad();
}); });
}).catch((err) => { }).catch((err) => {
console.warn("Unable to decrypt attachment: ", err); console.warn("Unable to decrypt attachment: ", err);
@ -186,11 +190,12 @@ module.exports = React.createClass({
<span className="mx_MImageBody" ref="body"> <span className="mx_MImageBody" ref="body">
<div className="mx_MImageBody_thumbnail" ref="image" style={{ <div className="mx_MImageBody_thumbnail" ref="image" style={{
"display": "flex", "display": "flex",
"align-items": "center", "alignItems": "center",
"justify-items": "center",
"width": "100%", "width": "100%",
}}> }}>
<img src="img/spinner.gif" alt={content.body} width="16" height="16"/> <img src="img/spinner.gif" alt={content.body} width="32" height="32" style={{
"margin": "auto",
}}/>
</div> </div>
</span> </span>
); );