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:
parent
4996164b46
commit
8641dab756
1 changed files with 13 additions and 24 deletions
|
@ -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>
|
||||||
|
|
Loading…
Reference in a new issue