create permalink creator in roomview and pass it on to the event tiles

src/components/structures/MessagePanel.js

@@ -525,6 +525,7 @@ module.exports = React.createClass({
                         eventSendStatus={mxEv.status}
                         tileShape={this.props.tileShape}
                         isTwelveHour={this.props.isTwelveHour}
+                        permaLinkCreator={this.props.permaLinkCreator}
                         last={last} isSelectedEvent={highlight} />
                 </li>,
         );

src/components/structures/RoomView.js

@@ -30,6 +30,7 @@ import Promise from 'bluebird';
 import filesize from 'filesize';
 const classNames = require("classnames");
 import { _t } from '../../languageHandler';
+import {RoomPermaLinkCreator} from "../../matrix-to";
 
 const MatrixClientPeg = require("../../MatrixClientPeg");
 const ContentMessages = require("../../ContentMessages");
@@ -441,6 +442,11 @@ module.exports = React.createClass({
             RoomScrollStateStore.setScrollState(this.state.roomId, this._getScrollState());
         }
 
+        // stop tracking room changes to format permalinks
+        if (this.state.permaLinkCreator) {
+            this.state.permaLinkCreator.stop();
+        }
+
         if (this.refs.roomView) {
             // disconnect the D&D event listeners from the room view. This
             // is really just for hygiene - we're going to be
@@ -652,6 +658,11 @@ module.exports = React.createClass({
         this._loadMembersIfJoined(room);
         this._calculateRecommendedVersion(room);
         this._updateE2EStatus(room);
+        if (!this.state.permaLinkCreator) {
+            const permaLinkCreator = new RoomPermaLinkCreator(room);
+            permaLinkCreator.start();
+            this.setState({permaLinkCreator});
+        }
     },
 
     _calculateRecommendedVersion: async function(room) {
@@ -1219,6 +1230,7 @@ module.exports = React.createClass({
                      searchResult={result}
                      searchHighlights={this.state.searchHighlights}
                      resultLink={resultLink}
+                     permaLinkCreator={this.state.permaLinkCreator}
                      onWidgetLoad={onWidgetLoad} />);
         }
         return ret;
@@ -1826,6 +1838,7 @@ module.exports = React.createClass({
                 showUrlPreview = {this.state.showUrlPreview}
                 className="mx_RoomView_messagePanel"
                 membersLoaded={this.state.membersLoaded}
+                permaLinkCreator={this.state.permaLinkCreator}
             />);
 
         let topUnreadMessagesBar = null;

src/components/structures/TimelinePanel.js

@@ -1202,6 +1202,7 @@ var TimelinePanel = React.createClass({
         return (
             <MessagePanel ref="messagePanel"
                           room={this.props.timelineSet.room}
+                          permaLinkCreator={this.props.permaLinkCreator}
                           hidden={this.props.hidden}
                           backPaginating={this.state.backPaginating}
                           forwardPaginating={forwardPaginating}

src/components/views/rooms/EventTile.js

@@ -32,7 +32,6 @@ import withMatrixClient from '../../../wrappers/withMatrixClient';
 
 const ContextualMenu = require('../../structures/ContextualMenu');
 import dis from '../../../dispatcher';
-import {makeEventPermalink} from "../../../matrix-to";
 import SettingsStore from "../../../settings/SettingsStore";
 import {EventStatus} from 'matrix-js-sdk';
 
@@ -544,7 +543,10 @@ module.exports = withMatrixClient(React.createClass({
             mx_EventTile_redacted: isRedacted,
         });
 
-        const permalink = makeEventPermalink(this.props.mxEvent.getRoomId(), this.props.mxEvent.getId());
+        let permalink = "#";
+        if (this.props.permaLinkCreator) {
+            permalink = this.props.permaLinkCreator.forEvent(this.props.mxEvent.getId());
+        }
 
         const readAvatars = this.getReadAvatars();
 

src/components/views/rooms/SearchResultTile.js

@@ -56,6 +56,7 @@ module.exports = React.createClass({
             }
             if (EventTile.haveTileForEvent(ev)) {
                 ret.push(<EventTile key={eventId+"+"+j} mxEvent={ev} contextual={contextual} highlights={highlights}
+                          permaLinkCreator={this.props.permaLinkCreator}
                           highlightLink={this.props.resultLink}
                           onWidgetLoad={this.props.onWidgetLoad} />);
             }

src/matrix-to.js

@@ -97,9 +97,9 @@ export class RoomPermaLinkCreator {
     }
 
     stop() {
-        this._room.off("RoomMember.membership", this.onMembership);
-        this._room.off("RoomMember.powerLevel", this.onPowerlevel);
-        this._room.off("RoomState.events", this.onRoomState);
+        this._room.removeListener("RoomMember.membership", this.onMembership);
+        this._room.removeListener("RoomMember.powerLevel", this.onPowerlevel);
+        this._room.removeListener("RoomState.events", this.onRoomState);
     }
 
     forEvent(eventId) {