20px at bottom of conversation considered 'at the bottom'

So users who are 'close enough' at the bottom of the conversation won't
get marooned in history.

FREEBIE
This commit is contained in:
Scott Nonnenberg 2017-05-26 17:24:51 -07:00
parent cc4d2993d1
commit 84397a2ef4
2 changed files with 10 additions and 11 deletions

View file

@ -291,14 +291,14 @@
unreadEl.insertBefore(this.$('#' + oldestUnread.get('id')));
if (this.view.bottomOffset === 0 || options.scroll) {
if (this.view.atBottom() || options.scroll) {
var position = unreadEl[0].scrollIntoView(true);
}
// scrollIntoView is an async operation, but we have no way to listen for
// completion of the resultant scroll.
setTimeout(function() {
if (this.view.bottomOffset > 0) {
if (!this.view.atBottom()) {
this.addScrollDownButtonWithCount(unreadCount);
}
}.bind(this), 1);

View file

@ -17,12 +17,15 @@
if (this.$el.scrollTop() === 0) {
this.$el.trigger('loadMore');
}
if (this.bottomOffset === 0) {
if (this.atBottom()) {
this.$el.trigger('atBottom');
} else if (this.bottomOffset > this.outerHeight) {
this.$el.trigger('farFromBottom');
}
},
atBottom: function() {
return this.bottomOffset < 20;
},
measureScrollPosition: function() {
if (this.el.scrollHeight === 0) { // hidden
return;
@ -30,18 +33,13 @@
this.outerHeight = this.$el.outerHeight();
this.scrollPosition = this.$el.scrollTop() + this.outerHeight;
this.scrollHeight = this.el.scrollHeight;
this.shouldStickToBottom = this.scrollPosition === this.scrollHeight;
if (this.shouldStickToBottom) {
this.bottomOffset = 0;
} else {
this.bottomOffset = this.scrollHeight - this.$el.scrollTop() - this.outerHeight;
}
this.bottomOffset = this.scrollHeight - this.$el.scrollTop() - this.outerHeight;
},
resetScrollPosition: function() {
this.$el.scrollTop(this.scrollPosition - this.$el.outerHeight());
},
scrollToBottomIfNeeded: function() {
if (this.bottomOffset === 0) {
if (this.atBottom()) {
this.scrollToBottom();
}
},
@ -63,7 +61,8 @@
var index = this.collection.indexOf(model);
this.measureScrollPosition();
if (model.get('unread') && this.bottomOffset > 0) {
if (model.get('unread') && !this.atBottom()) {
this.$el.trigger('newOffscreenMessage');
}