diff --git a/package.json b/package.json index 78ad899381..223672b8d8 100644 --- a/package.json +++ b/package.json @@ -37,8 +37,8 @@ "gfm.css": "^1.1.1", "highlight.js": "^9.0.0", "linkifyjs": "^2.0.0-beta.4", - "matrix-js-sdk": "^0.5.1", - "matrix-react-sdk": "^0.4.0", + "matrix-js-sdk": "matrix-org/matrix-js-sdk#develop", + "matrix-react-sdk": "matrix-org/matrix-react-sdk#develop", "modernizr": "^3.1.0", "q": "^1.4.1", "react": "^0.14.2", diff --git a/src/components/views/elements/ImageView.js b/src/components/views/elements/ImageView.js index ef00b387e9..db23e91b8f 100644 --- a/src/components/views/elements/ImageView.js +++ b/src/components/views/elements/ImageView.js @@ -27,7 +27,8 @@ module.exports = React.createClass({ displayName: 'ImageView', propTypes: { - onFinished: React.PropTypes.func.isRequired + onFinished: React.PropTypes.func.isRequired, + name: React.PropTypes.string }, // XXX: keyboard shortcuts for managing dialogs should be done by the modal @@ -65,6 +66,20 @@ module.exports = React.createClass({ }); }, + getName: function () { + var name; + + if(this.props.name) { + name = this.props.name; + } else if(this.props.mxEvent) { + name = props.mxEvent.getContent().body; + } else { + name = null; + } + + return name; + }, + render: function() { /* @@ -106,10 +121,28 @@ module.exports = React.createClass({ } var size; - if (this.props.mxEvent.getContent().info && this.props.mxEvent.getContent().info.size) { + if (this.props.mxEvent && + this.props.mxEvent.getContent().info && + this.props.mxEvent.getContent().info.size) { size = filesize(this.props.mxEvent.getContent().info.size); } + var showEventMeta = !!this.props.mxEvent; + + var eventMeta; + if(showEventMeta) { + eventMeta = (<div className="mx_ImageView_metadata"> + Uploaded on { DateUtils.formatDate(new Date(this.props.mxEvent.getTs())) } by { this.props.mxEvent.getSender() } + </div>); + } + + var eventRedact; + if(showEventMeta) { + eventRedact = (<div className="mx_ImageView_button" onClick={this.onRedactClick}> + Redact + </div>); + } + return ( <div className="mx_ImageView"> <div className="mx_ImageView_lhs"> @@ -122,11 +155,9 @@ module.exports = React.createClass({ <div className="mx_ImageView_shim"> </div> <div className="mx_ImageView_name"> - { this.props.mxEvent.getContent().body } - </div> - <div className="mx_ImageView_metadata"> - Uploaded on { DateUtils.formatDate(new Date(this.props.mxEvent.getTs())) } by { this.props.mxEvent.getSender() } + { this.getName() } </div> + { eventMeta } <a className="mx_ImageView_link" href={ this.props.src } target="_blank"> <div className="mx_ImageView_download"> Download this file<br/> @@ -138,9 +169,7 @@ module.exports = React.createClass({ View full screen </a> </div> - <div className="mx_ImageView_button" onClick={this.onRedactClick}> - Redact - </div> + { eventRedact } <div className="mx_ImageView_shim"> </div> </div> diff --git a/src/skins/vector/css/common.css b/src/skins/vector/css/common.css index 9a8e80a811..c18d05e04d 100644 --- a/src/skins/vector/css/common.css +++ b/src/skins/vector/css/common.css @@ -214,3 +214,8 @@ input[type=text]:focus, textarea:focus { color: #454545; background-color: #fff; } + +.emojione { + height: 1em; + vertical-align: middle; +} diff --git a/src/skins/vector/css/matrix-react-sdk/views/rooms/MemberInfo.css b/src/skins/vector/css/matrix-react-sdk/views/rooms/MemberInfo.css index 6ff57ba75f..e6a340df60 100644 --- a/src/skins/vector/css/matrix-react-sdk/views/rooms/MemberInfo.css +++ b/src/skins/vector/css/matrix-react-sdk/views/rooms/MemberInfo.css @@ -32,6 +32,14 @@ limitations under the License. clear: both; } +.mx_MemberInfo_avatar .mx_BaseAvatar { + cursor: not-allowed; +} + +.mx_MemberInfo_avatar .mx_BaseAvatar.mx_BaseAvatar_image { + cursor: pointer; +} + .mx_MemberInfo_profile { margin-bottom: 16px; }