Merge pull request #354 from vector-im/ignore-non-mxc
Display some sensible UI for non-mxc content URLs.
This commit is contained in:
commit
e0efb6862e
2 changed files with 46 additions and 21 deletions
|
@ -30,15 +30,25 @@ module.exports = React.createClass({
|
||||||
var content = this.props.mxEvent.getContent();
|
var content = this.props.mxEvent.getContent();
|
||||||
var cli = MatrixClientPeg.get();
|
var cli = MatrixClientPeg.get();
|
||||||
|
|
||||||
return (
|
var httpUrl = cli.mxcUrlToHttp(content.url);
|
||||||
<span className="mx_MFileTile">
|
var text = this.presentableTextForFile(content);
|
||||||
<div className="mx_MImageTile_download">
|
|
||||||
<a href={cli.mxcUrlToHttp(content.url)} target="_blank">
|
if (httpUrl) {
|
||||||
<img src="img/download.png" width="10" height="12"/>
|
return (
|
||||||
Download {this.presentableTextForFile(content)}
|
<span className="mx_MFileTile">
|
||||||
</a>
|
<div className="mx_MImageTile_download">
|
||||||
</div>
|
<a href={cli.mxcUrlToHttp(content.url)} target="_blank">
|
||||||
|
<img src="img/download.png" width="10" height="12"/>
|
||||||
|
Download {text}
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</span>
|
||||||
|
);
|
||||||
|
} else {
|
||||||
|
var extra = text ? ': '+text : '';
|
||||||
|
return <span className="mx_MFileTile">
|
||||||
|
Invalid file{extra}
|
||||||
</span>
|
</span>
|
||||||
);
|
}
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
|
|
@ -73,18 +73,33 @@ module.exports = React.createClass({
|
||||||
var imgStyle = {};
|
var imgStyle = {};
|
||||||
if (thumbHeight) imgStyle['height'] = thumbHeight;
|
if (thumbHeight) imgStyle['height'] = thumbHeight;
|
||||||
|
|
||||||
return (
|
var thumbUrl = cli.mxcUrlToHttp(content.url, 480, 360);
|
||||||
<span className="mx_MImageTile">
|
if (thumbUrl) {
|
||||||
<a href={cli.mxcUrlToHttp(content.url)} onClick={ this.onClick }>
|
return (
|
||||||
<img className="mx_MImageTile_thumbnail" src={cli.mxcUrlToHttp(content.url, 480, 360)} alt={content.body} style={imgStyle} />
|
<span className="mx_MImageTile">
|
||||||
</a>
|
<a href={cli.mxcUrlToHttp(content.url)} onClick={ this.onClick }>
|
||||||
<div className="mx_MImageTile_download">
|
<img className="mx_MImageTile_thumbnail" src={thumbUrl} alt={content.body} style={imgStyle} />
|
||||||
<a href={cli.mxcUrlToHttp(content.url)} target="_blank">
|
|
||||||
<img src="img/download.png" width="10" height="12"/>
|
|
||||||
Download {content.body} ({ content.info && content.info.size ? filesize(content.info.size) : "Unknown size" })
|
|
||||||
</a>
|
</a>
|
||||||
</div>
|
<div className="mx_MImageTile_download">
|
||||||
</span>
|
<a href={cli.mxcUrlToHttp(content.url)} target="_blank">
|
||||||
);
|
<img src="img/download.png" width="10" height="12"/>
|
||||||
|
Download {content.body} ({ content.info && content.info.size ? filesize(content.info.size) : "Unknown size" })
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</span>
|
||||||
|
);
|
||||||
|
} else if (content.body) {
|
||||||
|
return (
|
||||||
|
<span className="mx_MImageTile">
|
||||||
|
Image '{content.body}' cannot be displayed.
|
||||||
|
</span>
|
||||||
|
);
|
||||||
|
} else {
|
||||||
|
return (
|
||||||
|
<span className="mx_MImageTile">
|
||||||
|
This image cannot be displayed.
|
||||||
|
</span>
|
||||||
|
);
|
||||||
|
}
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
|
Loading…
Reference in a new issue