Normalize views' template fetching pattern

Typically, a view can specify its templateName and then use the default
render method on Whisper.View, except in some special cases like message
view or message detail where other operations are performed during
render.

// FREEBIE

js/views/attachment_preview_view.js

@@ -7,7 +7,7 @@
 
     Whisper.AttachmentPreviewView = Whisper.View.extend({
         className: 'attachment-preview',
-        template: $('#attachment-preview').html(),
+        templateName: 'attachment-preview',
         render_attributes: function() {
             return {source: this.src};
         }

js/views/confirmation_dialog_view.js

@@ -7,7 +7,7 @@
 
     Whisper.ConfirmationDialogView = Whisper.View.extend({
         className: 'confirmation-dialog',
-        template: $('#confirmation-dialog').html(),
+        templateName: 'confirmation-dialog',
         initialize: function(options) {
             this.message = options.message;
             this.resolve = options.resolve;

js/views/contact_list_view.js

@@ -10,7 +10,7 @@
         itemView: Whisper.View.extend({
             tagName: 'div',
             className: 'contact',
-            template: Whisper.View.Templates.contact,
+            templateName: 'contact',
             render_attributes: function() {
                 return {
                     title: this.model.getTitle(),

js/views/end_session_view.js

@@ -9,7 +9,7 @@
     Whisper.EndSessionView = Whisper.View.extend({
         tagName:   "div",
         className: "end-session",
-        template: $('#message').html(),
+        templateName: 'message',
         render_attributes: function() {
             return { text: 'Secure session ended' };
         }

js/views/file_input_view.js

@@ -6,7 +6,7 @@
     window.Whisper = window.Whisper || {};
 
     Whisper.FileSizeToast = Whisper.ToastView.extend({
-        template: $('#file-size-modal').html()
+        templateName: 'file-size-modal'
     });
 
     Whisper.FileInputView = Backbone.View.extend({

js/views/group_member_list_view.js

@@ -7,7 +7,7 @@
 
     Whisper.GroupMemberList = Whisper.View.extend({
         className: 'group-member-list',
-        template: $('#group-member-list').html(),
+        templateName: 'group-member-list',
         initialize: function() {
             this.render();
             this.member_list_view = new Whisper.ContactListView({

js/views/key_conflict_dialogue_view.js

@@ -6,11 +6,10 @@
 
     window.Whisper = window.Whisper || {};
 
-    Whisper.KeyConflictDialogueView = Backbone.View.extend({
+    Whisper.KeyConflictDialogueView = Whisper.View.extend({
         className: 'key-conflict-dialogue',
+        templateName: 'key-conflict-dialogue',
         initialize: function(options) {
-            this.template = $('#key-conflict-dialogue').html();
-            Mustache.parse(this.template);
             this.conversation = options.conversation;
         },
         events: {
@@ -32,9 +31,8 @@
             this.remove();
             this.conversation.resolveConflicts(this.model);
         },
-        render: function() {
-            this.$el.html(Mustache.render(this.template, this.model));
-            return this;
+        render_attributes: function() {
+            return this.model;
         }
     });
 })();

js/views/key_verification_view.js

@@ -7,7 +7,7 @@
 
     Whisper.KeyVerificationView = Whisper.View.extend({
         className: 'key-verification',
-        template: $('#key-verification').html(),
+        templateName: 'key-verification',
         events: {
             'click .back': 'goBack'
         },

js/views/message_detail_view.js

@@ -31,9 +31,9 @@
         }
     });
 
-    Whisper.MessageDetailView = Backbone.View.extend({
+    Whisper.MessageDetailView = Whisper.View.extend({
         className: 'message-detail',
-        template: $('#message-detail').html(),
+        templateName: 'message-detail',
         initialize: function(options) {
             this.view = new Whisper.MessageView({model: this.model});
             this.view.render();
@@ -107,7 +107,7 @@
                 return (e.name === 'OutgoingMessageError' ||
                         e.name === 'SendMessageNetworkError');
             });
-            this.$el.html(Mustache.render(this.template, {
+            this.$el.html(Mustache.render(_.result(this, 'template', ''), {
                 sent_at     : moment(this.model.get('sent_at')).toString(),
                 received_at : moment(this.model.get('received_at')).toString(),
                 tofrom      : this.model.isIncoming() ? 'From' : 'To',

js/views/message_view.js

@@ -7,7 +7,7 @@
 
     Whisper.MessageView = Whisper.View.extend({
         tagName:   "li",
-        template: $('#message').html(),
+        templateName: 'message',
         initialize: function() {
             this.listenTo(this.model, 'change:errors', this.onErrorsChanged);
             this.listenTo(this.model, 'change:body', this.render);
@@ -73,7 +73,7 @@
         render: function() {
             var contact = this.model.getContact();
             this.$el.html(
-                Mustache.render(this.template, {
+                Mustache.render(_.result(this, 'template', ''), {
                     message: this.model.get('body'),
                     timestamp: this.model.get('sent_at'),
                     sender: (contact && contact.getTitle()) || '',

js/views/phone-input-view.js

@@ -8,7 +8,7 @@
     Whisper.PhoneInputView = Whisper.View.extend({
         tagName: 'div',
         className: 'phone-input',
-        template: $('#phone-number').html(),
+        templateName: 'phone-number',
         render: function() {
             this.$el.html($(Mustache.render(this.template)));
             this.$('input.number').intlTelInput();

js/views/toast_view.js

@@ -16,7 +16,7 @@
         },
 
         render: function() {
-            this.$el.html(Mustache.render(this.template, this.model));
+            this.$el.html(Mustache.render(_.result(this, 'template', ''), this.model));
             this.$el.show();
             setTimeout(this.close.bind(this), 2000);
         }