Don't stop scrolling at the read-up-to mark.

We want to keep things scrolling up after the read-up-to mark hits the middle
of the screen. Do this by giving the ScrollPanel a stickyBottom (provided we're
not in old history) instead of updating the scroll position when RRs arrive.

Also, when we switch back to a room, if there was no special scroll state, jump
to the end of the timeline instead of the RR mark.
This commit is contained in:
Richard van der Hoff 2016-02-09 11:08:26 +00:00
parent 4996164b46
commit 8641dab756

View file

@ -66,7 +66,8 @@ module.exports = React.createClass({
roomId: React.PropTypes.string.isRequired, roomId: React.PropTypes.string.isRequired,
// id of an event to jump to. If not given, will use the read-up-to-marker. // id of an event to jump to. If not given, will go to the end of the
// live timeline.
eventId: React.PropTypes.string, eventId: React.PropTypes.string,
// where to position the event given by eventId, in pixels from the // where to position the event given by eventId, in pixels from the
@ -196,11 +197,6 @@ module.exports = React.createClass({
_initTimeline: function(props) { _initTimeline: function(props) {
var initialEvent = props.eventId; var initialEvent = props.eventId;
if (!initialEvent) {
// go to the 'read-up-to' mark if no explicit event given
initialEvent = this.state.readMarkerEventId;
}
var pixelOffset = props.eventPixelOffset; var pixelOffset = props.eventPixelOffset;
return this._loadTimeline(initialEvent, pixelOffset); return this._loadTimeline(initialEvent, pixelOffset);
}, },
@ -499,20 +495,6 @@ module.exports = React.createClass({
readMarkerEventId: readMarkerEventId, readMarkerEventId: readMarkerEventId,
readMarkerGhostEventId: readMarkerGhostEventId, readMarkerGhostEventId: readMarkerGhostEventId,
}); });
// if the scrollpanel is following the timeline, attempt to scroll
// it to bring the read message up to the middle of the panel. This
// will have no immediate effect (since we are already at the
// bottom), but will ensure that if there is no further user
// activity, but room activity continues, the read message will
// scroll up to the middle of the window, but no further.
//
// we do this here as well as in sendReadReceipt to deal with
// people using two clients at once.
if (this.refs.messagePanel && this.state.atEndOfLiveTimeline) {
this.refs.messagePanel.scrollToToken(readMarkerEventId);
}
} }
}, },
@ -1809,15 +1791,22 @@ module.exports = React.createClass({
</div> </div>
); );
} else { } else {
// it's important that stickyBottom = false on this, otherwise if somebody hits the // give the messagepanel a stickybottom if we're at the end of the
// bottom of the loaded events when viewing historical messages, we get stuck in a // live timeline, so that the arrival of new events triggers a
// loop of paginating our way through the entire history of the room. // scroll.
//
// Make sure that stickyBottom is *false* if we can paginate
// forwards, otherwise if somebody hits the bottom of the loaded
// events when viewing historical messages, we get stuck in a loop
// of paginating our way through the entire history of the room.
var stickyBottom = !this._timelineWindow.canPaginate(EventTimeline.FORWARDS);
messagePanel = ( messagePanel = (
<ScrollPanel ref="messagePanel" className="mx_RoomView_messagePanel" <ScrollPanel ref="messagePanel" className="mx_RoomView_messagePanel"
onScroll={ this.onMessageListScroll } onScroll={ this.onMessageListScroll }
onFillRequest={ this.onMessageListFillRequest } onFillRequest={ this.onMessageListFillRequest }
style={ hideMessagePanel ? { display: 'none' } : {} } style={ hideMessagePanel ? { display: 'none' } : {} }
stickyBottom={ false }> stickyBottom={ stickyBottom }>
<li className={scrollheader_classes}></li> <li className={scrollheader_classes}></li>
{this.getEventTiles()} {this.getEventTiles()}
</ScrollPanel> </ScrollPanel>