From 77caa633217d48566e1ba3d4dad2e2b762cdcded Mon Sep 17 00:00:00 2001 From: lilia Date: Tue, 8 Dec 2015 15:01:29 -0800 Subject: [PATCH] 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 | 2 +- js/views/confirmation_dialog_view.js | 2 +- js/views/contact_list_view.js | 2 +- js/views/end_session_view.js | 2 +- js/views/file_input_view.js | 2 +- js/views/group_member_list_view.js | 2 +- js/views/key_conflict_dialogue_view.js | 10 ++++------ js/views/key_verification_view.js | 2 +- js/views/message_detail_view.js | 6 +++--- js/views/message_view.js | 4 ++-- js/views/phone-input-view.js | 2 +- js/views/toast_view.js | 2 +- 12 files changed, 18 insertions(+), 20 deletions(-) diff --git a/js/views/attachment_preview_view.js b/js/views/attachment_preview_view.js index d619d3a6ad..69f931b596 100644 --- a/js/views/attachment_preview_view.js +++ b/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}; } diff --git a/js/views/confirmation_dialog_view.js b/js/views/confirmation_dialog_view.js index 4ab39ef84f..b6d0116f12 100644 --- a/js/views/confirmation_dialog_view.js +++ b/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; diff --git a/js/views/contact_list_view.js b/js/views/contact_list_view.js index 15b6683e1e..f263b28c05 100644 --- a/js/views/contact_list_view.js +++ b/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(), diff --git a/js/views/end_session_view.js b/js/views/end_session_view.js index 23e937c522..63b150b6d5 100644 --- a/js/views/end_session_view.js +++ b/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' }; } diff --git a/js/views/file_input_view.js b/js/views/file_input_view.js index 4055cd6018..dc5e59b8d9 100644 --- a/js/views/file_input_view.js +++ b/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({ diff --git a/js/views/group_member_list_view.js b/js/views/group_member_list_view.js index 97d7e7a520..45fd52c3ef 100644 --- a/js/views/group_member_list_view.js +++ b/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({ diff --git a/js/views/key_conflict_dialogue_view.js b/js/views/key_conflict_dialogue_view.js index 190c4d3469..a2b3d080be 100644 --- a/js/views/key_conflict_dialogue_view.js +++ b/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; } }); })(); diff --git a/js/views/key_verification_view.js b/js/views/key_verification_view.js index eae511234c..23a7a61147 100644 --- a/js/views/key_verification_view.js +++ b/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' }, diff --git a/js/views/message_detail_view.js b/js/views/message_detail_view.js index ee641d3abd..d910c6d44d 100644 --- a/js/views/message_detail_view.js +++ b/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', diff --git a/js/views/message_view.js b/js/views/message_view.js index fed6b39e2e..7cf2c7e949 100644 --- a/js/views/message_view.js +++ b/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()) || '', diff --git a/js/views/phone-input-view.js b/js/views/phone-input-view.js index 48c981e00f..fafc08d873 100644 --- a/js/views/phone-input-view.js +++ b/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(); diff --git a/js/views/toast_view.js b/js/views/toast_view.js index bf5edd0e40..f32adc4e1d 100644 --- a/js/views/toast_view.js +++ b/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); }