factor out tintable SVGs into their own component, and use plain DOM onload rather than react synthetic events

This commit is contained in:
Matthew Hodgson 2016-01-06 02:11:07 +00:00
parent 9e8daba8d7
commit 509ea7c4f3
8 changed files with 82 additions and 20 deletions

View file

@ -19,6 +19,7 @@ limitations under the License.
var React = require('react');
var filesize = require('filesize');
var MatrixClientPeg = require('../../../MatrixClientPeg');
var sdk = require('../../../index');
var dis = require("../../../dispatcher");
module.exports = React.createClass({
@ -57,12 +58,14 @@ module.exports = React.createClass({
var httpUrl = cli.mxcUrlToHttp(content.url);
var text = this.presentableTextForFile(content);
var TintableSvg = sdk.getComponent("elements.TintableSvg");
if (httpUrl) {
return (
<span className="mx_MFileBody">
<div className="mx_MImageBody_download">
<a href={cli.mxcUrlToHttp(content.url)} target="_blank">
<object onLoad={ this.onSvgLoad } className="mx_Svg" type="image/svg+xml" data="img/download.svg" width="12" height="14"/>
<TintableSvg src="img/download.svg" width="12" height="14"/>
Download {text}
</a>
</div>