diff --git a/skins/base/views/molecules/MImageTile.js b/skins/base/views/molecules/MImageTile.js index 783583cb..4b581e38 100644 --- a/skins/base/views/molecules/MImageTile.js +++ b/skins/base/views/molecules/MImageTile.js @@ -21,6 +21,10 @@ var React = require('react'); var MImageTileController = require("../../../../src/controllers/molecules/MImageTile"); var MatrixClientPeg = require('../../../../src/MatrixClientPeg'); +var Modal = require('../../../../src/Modal'); +var ComponentBroker = require('../../../../src/ComponentBroker'); + +var ImageView = ComponentBroker.get("atoms/ImageView"); module.exports = React.createClass({ displayName: 'MImageTile', @@ -48,6 +52,17 @@ module.exports = React.createClass({ } }, + onClick: function(ev) { + ev.preventDefault(); + var content = this.props.mxEvent.getContent(); + var httpUrl = MatrixClientPeg.get().mxcUrlToHttp(content.url); + Modal.createDialog(ImageView, { + src: httpUrl, + width: content.info.w, + height: content.info.h + }); + }, + render: function() { var content = this.props.mxEvent.getContent(); var cli = MatrixClientPeg.get(); @@ -60,7 +75,7 @@ module.exports = React.createClass({ return ( - + {content.body} diff --git a/src/ComponentBroker.js b/src/ComponentBroker.js index e74d8ecc..2476ff6a 100644 --- a/src/ComponentBroker.js +++ b/src/ComponentBroker.js @@ -103,6 +103,7 @@ require('../skins/base/views/molecules/RoomDropTarget'); require('../skins/base/views/molecules/BottomLeftMenu'); require('../skins/base/views/molecules/DateSeparator'); require('../skins/base/views/atoms/voip/VideoFeed'); +require('../skins/base/views/atoms/ImageView'); require('../skins/base/views/molecules/voip/VideoView'); require('../skins/base/views/molecules/voip/CallView'); require('../skins/base/views/molecules/voip/IncomingCallBox');