diff --git a/src/components/structures/RoomView.js b/src/components/structures/RoomView.js index 8a355a8f6d..a0c36374b6 100644 --- a/src/components/structures/RoomView.js +++ b/src/components/structures/RoomView.js @@ -1276,13 +1276,7 @@ module.exports = React.createClass({ return; } - var pos = this.refs.messagePanel.getReadMarkerPosition(); - - // we want to show the bar if the read-marker is off the top of the - // screen. - // If pos is null, the event might not be paginated, so show the unread bar! - var showBar = pos < 0 || pos === null; - + const showBar = this.refs.messagePanel.canJumpToReadMarker(); if (this.state.showTopUnreadMessagesBar != showBar) { this.setState({showTopUnreadMessagesBar: showBar}, this.onChildResize); diff --git a/src/components/structures/TimelinePanel.js b/src/components/structures/TimelinePanel.js index f07bad0052..f72d35c41c 100644 --- a/src/components/structures/TimelinePanel.js +++ b/src/components/structures/TimelinePanel.js @@ -766,6 +766,19 @@ var TimelinePanel = React.createClass({ return null; }, + canJumpToReadMarker: function() { + // 1. Do not show jump bar if neither the RM nor the RR are set. + // 2. Only show jump bar if RR !== RM. If they are the same, there are only fully + // read messages and unread messages. We already have a badge count and the bottom + // bar to jump to "live" when we have unread messages. + // 3. We want to show the bar if the read-marker is off the top of the screen. + // 4. Also, if pos === null, the event might not be paginated - show the unread bar + const pos = this.getReadMarkerPosition(); + return this.state.readMarkerEventId !== null && // 1. + this.state.readMarkerEventId !== this._getCurrentReadReceipt() && // 2. + (pos < 0 || pos === null); // 3., 4. + }, + /** * called by the parent component when PageUp/Down/etc is pressed. *