Simplify avatar rendering

js/models/conversations.js

@@ -38,6 +38,7 @@
         });
 
         this.on('change:avatar', this.updateAvatarUrl);
+        this.on('destroy', this.revokeAvatarUrl);
     },
 
     validate: function(attributes, options) {
@@ -194,11 +195,15 @@
         return this.get('type') === 'private';
     },
 
-    updateAvatarUrl: function() {
+    revokeAvatarUrl: function() {
         if (this.avatarUrl) {
             URL.revokeObjectURL(this.avatarUrl);
             this.avatarUrl = null;
         }
+    },
+
+    updateAvatarUrl: function() {
+        this.revokeAvatarUrl();
         var avatar = this.get('avatar');
         if (avatar) {
             this.avatarUrl = URL.createObjectURL(

js/views/conversation_list_item_view.js

@@ -44,7 +44,8 @@
                     contact_name: this.model.getTitle(),
                     last_message: this.model.get('lastMessage'),
                     last_message_timestamp: moment(this.model.get('timestamp')).format('MMM D'),
-                    number: this.model.getNumber()
+                    number: this.model.getNumber(),
+                    avatar_url: this.model.getAvatarUrl()
                 })
             );
 
@@ -57,17 +58,6 @@
                 this.$el.removeClass('unread');
             }
 
-            if (this.model.get('avatar')) {
-                this.$el.find('.avatar').append(
-                    new Whisper.AttachmentView({model: this.model.get('avatar')}).render().el
-                );
-            }
-            else {
-                this.$el.find('.avatar').append(
-                    $('<img>').attr('src', '/images/default.png')
-                );
-            }
-
             return this;
         }
 

js/views/message_detail_view.js

@@ -62,8 +62,8 @@
                 tofrom: this.model.isIncoming() ? 'From' : 'To',
                 contacts: this.contacts().map(function(contact) {
                     return {
-                        name     : contact.getTitle(),
-                        avatar   : contact.get('avatar'),
+                        name       : contact.getTitle(),
+                        avatar_url : contact.getAvatarUrl()
                     };
                 }.bind(this))
             }));

js/views/message_view.js

@@ -53,21 +53,11 @@
                 Mustache.render(this.template, {
                     message: this.model.get('body'),
                     timestamp: moment(this.model.get('received_at')).fromNow(),
-                    sender: (contact && contact.getTitle()) || ''
+                    sender: (contact && contact.getTitle()) || '',
+                    avatar_url: (contact && contact.getAvatarUrl())
                 })
             );
 
-            var avatar;
-            if (contact && contact.get('avatar')) {
-                avatar = new Whisper.AttachmentView({
-                    model: contact.get('avatar')
-                }).render().el;
-            }
-            else {
-                avatar = $('<img>').attr('src', '/images/default.png');
-            }
-            this.$el.find('.avatar').append(avatar);
-
             twemoji.parse(this.el, { base: '/components/twemoji/', size: 16 });
 
             var content = this.$el.find('.content');

js/views/new_group_update_view.js

@@ -27,15 +27,6 @@
                 el: this.$el.find('.group-avatar')
             });
 
-            if (this.model.attributes.avatar) {
-                this.current_avatar = new Whisper.AttachmentView({
-                    model: this.model.attributes.avatar
-                });
-                this.avatarInput.$default.append(
-                    this.current_avatar.render().$el
-                );
-            }
-
             this.recipients_view = new Whisper.RecipientsInputView();
             this.$el.find('.scrollable').append(this.recipients_view.el);
         },
@@ -47,7 +38,10 @@
             this.trigger('back');
         },
         render_attributes: function() {
-            return { name: this.model.getTitle() };
+            return {
+                name: this.model.getTitle(),
+                avatar_url: this.model.getAvatarUrl()
+            };
         },
         send: function() {
             return this.avatarInput.getFiles().then(function(avatarFiles) {