diff --git a/src/components/views/messages/MImageBody.js b/src/components/views/messages/MImageBody.js index 04559ce4fe..02ccfbd107 100644 --- a/src/components/views/messages/MImageBody.js +++ b/src/components/views/messages/MImageBody.js @@ -121,16 +121,21 @@ module.exports = React.createClass({ }, fixupHeight: function() { + if (!this.refs.image) { + return; + } + var content = this.props.mxEvent.getContent(); var thumbHeight = null; - var timelineWidth = this._body.offsetWidth; + var timelineWidth = this.refs.body.offsetWidth; var maxHeight = 600; // let images take up as much width as they can so long as the height doesn't exceed 600px. // the alternative here would be 600*timelineWidth/800; to scale them down to fit inside a 4:3 bounding box - //console.log("trying to fit image into timelineWidth of " + this._body.offsetWidth + " or " + this._body.clientWidth); + //console.log("trying to fit image into timelineWidth of " + this.refs.body.offsetWidth + " or " + this.refs.body.clientWidth); if (content.info) thumbHeight = this.thumbHeight(content.info.w, content.info.h, timelineWidth, maxHeight); - this._image.style.height = thumbHeight + "px"; + this.refs.image.style.height = thumbHeight + "px"; + console.log("Imageheight now", thumbHeight); }, render: function() { @@ -141,9 +146,9 @@ module.exports = React.createClass({ var thumbUrl = this._getThumbUrl(); if (thumbUrl) { return ( - this._body = c}> + - this._image = c} +