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

js/views/conversation_view.js

@@ -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);

js/views/message_list_view.js

@@ -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');
             }