From 0956d328da7e4b1704741287a73298a6af1d1d89 Mon Sep 17 00:00:00 2001
From: lilia <liliakai@gmail.com>
Date: Mon, 10 Nov 2014 23:16:46 -0800
Subject: [PATCH] Fixes #71 Autoscroll

Conversation view autoscroll triggers on dom change, not storage change,
ensuring that we don't scroll before the new element is inserted.
---
 js/views/conversation_view.js | 7 +------
 js/views/list_view.js         | 1 +
 js/views/message_list_view.js | 8 +++++++-
 3 files changed, 9 insertions(+), 7 deletions(-)

diff --git a/js/views/conversation_view.js b/js/views/conversation_view.js
index fa746c3f..c57711e2 100644
--- a/js/views/conversation_view.js
+++ b/js/views/conversation_view.js
@@ -12,7 +12,6 @@ var Whisper = Whisper || {};
       this.$el.html(Mustache.render(this.template));
 
       this.view = new Whisper.MessageListView({collection: this.model.messages()});
-      this.listenTo(this.model.messages(), 'add', this.scrollToBottom);
 
       this.fileInput = new Whisper.FileInputView({el: this.$el.find('.attachments')});
 
@@ -41,13 +40,9 @@ var Whisper = Whisper || {};
       }
     },
 
-    scrollToBottom: function() {
-        this.view.$el.scrollTop(this.view.el.scrollHeight);
-    },
-
     render: function() {
       Whisper.Layout.setContent(this.$el.show());
-      this.scrollToBottom();
+      this.view.scrollToBottom();
       return this;
     }
   });
diff --git a/js/views/list_view.js b/js/views/list_view.js
index 6d9444cb..1d152bb2 100644
--- a/js/views/list_view.js
+++ b/js/views/list_view.js
@@ -21,6 +21,7 @@ var Whisper = Whisper || {};
       if (this.itemView) {
         var view = new this.itemView({model: model});
         this.$el.append(view.render().el);
+        this.$el.trigger('add');
       }
     },
 
diff --git a/js/views/message_list_view.js b/js/views/message_list_view.js
index bc4aedfd..0c161d4a 100644
--- a/js/views/message_list_view.js
+++ b/js/views/message_list_view.js
@@ -6,6 +6,12 @@ var Whisper = Whisper || {};
   Whisper.MessageListView = Whisper.ListView.extend({
     tagName: 'ul',
     className: 'discussion',
-    itemView: Whisper.MessageView
+    itemView: Whisper.MessageView,
+    events: {
+      'add': 'scrollToBottom'
+    },
+    scrollToBottom: function() {
+        this.$el.scrollTop(this.el.scrollHeight);
+    },
   });
 })();