Don't recreate views unnecessarily

Let ConversationListItemView save a reference to its corresponding
ConversationView. This lets it render or delegate/undelegate events
when opening and closing a conversation.

Similarly for ConversationView itself, which contains a MessageListView.

js/views/conversation_list_item_view.js

@@ -22,7 +22,15 @@ var Whisper = Whisper || {};
 
     open: function(e) {
       $('#main').trigger('close'); // detach any existing conversation views
-      var v = new Whisper.ConversationView({el: $('#main'), model: this.model});
+      if (!this.view) {
+        this.view = new Whisper.ConversationView({
+          el: $('#main'),
+          model: this.model
+        });
+      } else {
+        this.view.delegateEvents();
+      }
+      this.view.render();
     },
 
     render: function() {

js/views/conversation_view.js

@@ -5,14 +5,13 @@ var Whisper = Whisper || {};
 
   Whisper.ConversationView = Backbone.View.extend({
     initialize: function() {
-      this.listenTo(this.model, 'destroy', this.remove); // auto update
+      this.listenTo(this.model, 'destroy', this.stopListening); // auto update
 
-      var v = new Whisper.MessageListView({collection: this.model.messages()});
-      v.render();
+      this.view = new Whisper.MessageListView({collection: this.model.messages()});
     },
     events: {
       'submit #new-message': 'sendMessage',
-      'close': 'remove'
+      'close': 'undelegateEvents'
     },
 
     sendMessage: function(e) {
@@ -21,5 +20,10 @@ var Whisper = Whisper || {};
       this.$input.val("");
       e.preventDefault();
     },
+
+    render: function() {
+      this.view.render();
+      return this;
+    }
   });
 })();