diff --git a/src/components/views/messages/MEmoteMessage.js b/src/components/views/messages/MEmoteMessage.js deleted file mode 100644 index 26e29363cd..0000000000 --- a/src/components/views/messages/MEmoteMessage.js +++ /dev/null @@ -1,44 +0,0 @@ -/* -Copyright 2015 OpenMarket Ltd - -Licensed under the Apache License, Version 2.0 (the "License"); -you may not use this file except in compliance with the License. -You may obtain a copy of the License at - - http://www.apache.org/licenses/LICENSE-2.0 - -Unless required by applicable law or agreed to in writing, software -distributed under the License is distributed on an "AS IS" BASIS, -WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -See the License for the specific language governing permissions and -limitations under the License. -*/ - -'use strict'; - -var React = require('react'); -var linkify = require('linkifyjs'); -var linkifyElement = require('linkifyjs/element'); -var linkifyMatrix = require('../../../linkify-matrix'); - -linkifyMatrix(linkify); - -module.exports = React.createClass({ - displayName: 'MEmoteMessage', - - componentDidMount: function() { - linkifyElement(this.refs.content, linkifyMatrix.options); - }, - - render: function() { - var mxEvent = this.props.mxEvent; - var content = mxEvent.getContent(); - var name = mxEvent.sender ? mxEvent.sender.name : mxEvent.getSender(); - return ( - - * {name} {content.body} - - ); - }, -}); - diff --git a/src/components/views/messages/MNoticeMessage.js b/src/components/views/messages/MNoticeMessage.js deleted file mode 100644 index 3a89d1ff6a..0000000000 --- a/src/components/views/messages/MNoticeMessage.js +++ /dev/null @@ -1,59 +0,0 @@ -/* -Copyright 2015 OpenMarket Ltd - -Licensed under the Apache License, Version 2.0 (the "License"); -you may not use this file except in compliance with the License. -You may obtain a copy of the License at - - http://www.apache.org/licenses/LICENSE-2.0 - -Unless required by applicable law or agreed to in writing, software -distributed under the License is distributed on an "AS IS" BASIS, -WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -See the License for the specific language governing permissions and -limitations under the License. -*/ - -'use strict'; - -var React = require('react'); -var linkify = require('linkifyjs'); -var linkifyElement = require('linkifyjs/element'); -var linkifyMatrix = require('../../../linkify-matrix.js'); -linkifyMatrix(linkify); -var HtmlUtils = require('../../../HtmlUtils'); - -module.exports = React.createClass({ - displayName: 'MNoticeMessage', - - componentDidMount: function() { - linkifyElement(this.refs.content, linkifyMatrix.options); - - if (this.props.mxEvent.getContent().format === "org.matrix.custom.html") - HtmlUtils.highlightDom(this.getDOMNode()); - }, - - componentDidUpdate: function() { - if (this.props.mxEvent.getContent().format === "org.matrix.custom.html") - HtmlUtils.highlightDom(this.getDOMNode()); - }, - - shouldComponentUpdate: function(nextProps) { - // exploit that events are immutable :) - return (nextProps.mxEvent.getId() !== this.props.mxEvent.getId() || - nextProps.searchTerm !== this.props.searchTerm); - }, - - // XXX: fix horrible duplication with MTextTile - render: function() { - var content = this.props.mxEvent.getContent(); - var body = HtmlUtils.bodyToHtml(content, this.props.searchTerm); - - return ( - - { body } - - ); - }, -}); - diff --git a/src/components/views/messages/Message.js b/src/components/views/messages/Message.js index fa74a8e137..d983d3da06 100644 --- a/src/components/views/messages/Message.js +++ b/src/components/views/messages/Message.js @@ -32,9 +32,9 @@ module.exports = React.createClass({ var UnknownMessageTile = sdk.getComponent('messages.UnknownMessage'); var tileTypes = { - 'm.text': sdk.getComponent('messages.MTextMessage'), - 'm.notice': sdk.getComponent('messages.MNoticeMessage'), - 'm.emote': sdk.getComponent('messages.MEmoteMessage'), + 'm.text': sdk.getComponent('messages.TextualMessage'), + 'm.notice': sdk.getComponent('messages.TextualMessage'), + 'm.emote': sdk.getComponent('messages.TextualMessage'), 'm.image': sdk.getComponent('messages.MImageMessage'), 'm.file': sdk.getComponent('messages.MFileMessage'), 'm.video': sdk.getComponent('messages.MVideoMessage') diff --git a/src/components/views/messages/MTextMessage.js b/src/components/views/messages/TextualMessage.js similarity index 57% rename from src/components/views/messages/MTextMessage.js rename to src/components/views/messages/TextualMessage.js index d3b337cbc1..7393e2e149 100644 --- a/src/components/views/messages/MTextMessage.js +++ b/src/components/views/messages/TextualMessage.js @@ -17,6 +17,7 @@ limitations under the License. 'use strict'; var React = require('react'); +var ReactDOM = require('react-dom'); var HtmlUtils = require('../../../HtmlUtils'); var linkify = require('linkifyjs'); var linkifyElement = require('linkifyjs/element'); @@ -25,18 +26,18 @@ var linkifyMatrix = require('../../../linkify-matrix'); linkifyMatrix(linkify); module.exports = React.createClass({ - displayName: 'MTextMessage', + displayName: 'TextualMessage', componentDidMount: function() { linkifyElement(this.refs.content, linkifyMatrix.options); if (this.props.mxEvent.getContent().format === "org.matrix.custom.html") - HtmlUtils.highlightDom(this.getDOMNode()); + HtmlUtils.highlightDom(ReactDOM.findDOMNode(this)); }, componentDidUpdate: function() { if (this.props.mxEvent.getContent().format === "org.matrix.custom.html") - HtmlUtils.highlightDom(this.getDOMNode()); + HtmlUtils.highlightDom(ReactDOM.findDOMNode(this)); }, shouldComponentUpdate: function(nextProps) { @@ -46,14 +47,31 @@ module.exports = React.createClass({ }, render: function() { - var content = this.props.mxEvent.getContent(); + var mxEvent = this.props.mxEvent; + var content = mxEvent.getContent(); var body = HtmlUtils.bodyToHtml(content, this.props.searchTerm); - return ( - - { body } - - ); + switch (content.msgtype) { + case "m.emote": + var name = mxEvent.sender ? mxEvent.sender.name : mxEvent.getSender(); + return ( + + * {name} {content.body} + + ); + case "m.notice": + return ( + + { body } + + ); + default: // including "m.text" + return ( + + { body } + + ); + } }, });