support hyperlinked topics

This commit is contained in:
Matthew Hodgson 2016-02-20 23:54:47 +00:00
parent a35ab6bcef
commit 2ca5529faa
2 changed files with 10 additions and 5 deletions

View file

@ -25,8 +25,9 @@ var sdk = require('matrix-react-sdk')
var dis = require('matrix-react-sdk/lib/dispatcher'); var dis = require('matrix-react-sdk/lib/dispatcher');
var linkify = require('linkifyjs'); var linkify = require('linkifyjs');
var linkifyElement = require('linkifyjs/element'); var linkifyString = require('linkifyjs/string');
var linkifyMatrix = require('matrix-react-sdk/lib/linkify-matrix'); var linkifyMatrix = require('matrix-react-sdk/lib/linkify-matrix');
var sanitizeHtml = require('sanitize-html');
linkifyMatrix(linkify); linkifyMatrix(linkify);
@ -61,8 +62,6 @@ module.exports = React.createClass({
self.forceUpdate(); self.forceUpdate();
} }
}); });
//linkifyElement(this.refs.directory_table, linkifyMatrix.options);
}, },
showRoom: function(roomId) { showRoom: function(roomId) {
@ -108,6 +107,9 @@ module.exports = React.createClass({
perms = <div className="mx_RoomDirectory_perms">{guestRead} {guestJoin}</div>; perms = <div className="mx_RoomDirectory_perms">{guestRead} {guestJoin}</div>;
} }
var topic = rooms[i].topic || '';
topic = linkifyString(sanitizeHtml(topic));
rows.unshift( rows.unshift(
<tr key={ rooms[i].room_id } onClick={self.showRoom.bind(null, rooms[i].room_id)}> <tr key={ rooms[i].room_id } onClick={self.showRoom.bind(null, rooms[i].room_id)}>
<td className="mx_RoomDirectory_roomAvatar"> <td className="mx_RoomDirectory_roomAvatar">
@ -120,7 +122,9 @@ module.exports = React.createClass({
<td className="mx_RoomDirectory_roomDescription"> <td className="mx_RoomDirectory_roomDescription">
<div className="mx_RoomDirectory_name">{ name }</div>&nbsp; <div className="mx_RoomDirectory_name">{ name }</div>&nbsp;
{ perms } { perms }
<div className="mx_RoomDirectory_topic">{ rooms[i].topic }</div> <div className="mx_RoomDirectory_topic"
onClick={ function(e) { e.stopPropagation() } }
dangerouslySetInnerHTML={{ __html: topic }}/>
<div className="mx_RoomDirectory_alias">{ rooms[i].aliases[0] }</div> <div className="mx_RoomDirectory_alias">{ rooms[i].aliases[0] }</div>
</td> </td>
<td className="mx_RoomDirectory_roomMemberCount"> <td className="mx_RoomDirectory_roomMemberCount">

View file

@ -73,7 +73,7 @@ limitations under the License.
.mx_RoomDirectory_roomAvatar { .mx_RoomDirectory_roomAvatar {
width: 24px; width: 24px;
padding-left: 16px; padding-left: 12px;
padding-right: 24px; padding-right: 24px;
vertical-align: top; vertical-align: top;
} }
@ -105,6 +105,7 @@ limitations under the License.
} }
.mx_RoomDirectory_topic { .mx_RoomDirectory_topic {
cursor: initial;
} }
.mx_RoomDirectory_alias { .mx_RoomDirectory_alias {