message_view.js: eslint fixes and a bit of fixup

This commit is contained in:
Scott Nonnenberg 2018-04-09 09:43:03 -07:00
parent 09c3fbc5e2
commit 2def6afe45
No known key found for this signature in database
GPG key ID: 5F82280C35134661
2 changed files with 424 additions and 425 deletions

View file

@ -110,6 +110,7 @@ module.exports = function(grunt) {
'!js/signal_protocol_store.js', '!js/signal_protocol_store.js',
'!js/views/conversation_search_view.js', '!js/views/conversation_search_view.js',
'!js/views/debug_log_view.js', '!js/views/debug_log_view.js',
'!js/views/message_view.js',
'!js/WebAudioRecorderMp3.js', '!js/WebAudioRecorderMp3.js',
'_locales/**/*' '_locales/**/*'
], ],

View file

@ -1,57 +1,59 @@
/* eslint-disable */
/* global Whisper: false */ /* global Whisper: false */
/* global i18n: false */
/* global textsecure: false */
/* global _: false */
/* global emoji_util: false */
/* global Mustache: false */
// eslint-disable-next-line func-names
(function () { (function () {
'use strict'; 'use strict';
window.Whisper = window.Whisper || {};
const { HTML } = window.Signal; const { HTML } = window.Signal;
const { Attachment } = window.Signal.Types;
const { loadAttachmentData } = window.Signal.Migrations; const { loadAttachmentData } = window.Signal.Migrations;
var URL_REGEX = /(^|[\s\n]|<br\/?>)((?:https?|ftp):\/\/[\-A-Z0-9\u00A0-\uD7FF\uE000-\uFDCF\uFDF0-\uFFFD+\u0026\u2019@#\/%?=()~_|!:,.;]*[\-A-Z0-9+\u0026@#\/%=~()_|])/gi; window.Whisper = window.Whisper || {};
var ErrorIconView = Whisper.View.extend({ const ErrorIconView = Whisper.View.extend({
templateName: 'error-icon', templateName: 'error-icon',
className: 'error-icon-container', className: 'error-icon-container',
initialize: function() { initialize() {
if (this.model.name === 'UnregisteredUserError') { if (this.model.name === 'UnregisteredUserError') {
this.$el.addClass('unregistered-user-error'); this.$el.addClass('unregistered-user-error');
} }
} },
}); });
var NetworkErrorView = Whisper.View.extend({ const NetworkErrorView = Whisper.View.extend({
tagName: 'span', tagName: 'span',
className: 'hasRetry', className: 'hasRetry',
templateName: 'hasRetry', templateName: 'hasRetry',
render_attributes: function() { render_attributes() {
var messageNotSent; let messageNotSent;
if (!this.model.someRecipientsFailed()) { if (!this.model.someRecipientsFailed()) {
messageNotSent = i18n('messageNotSent'); messageNotSent = i18n('messageNotSent');
} }
return { return {
messageNotSent: messageNotSent, messageNotSent,
resend: i18n('resend') resend: i18n('resend'),
}; };
} },
}); });
var SomeFailedView = Whisper.View.extend({ const SomeFailedView = Whisper.View.extend({
tagName: 'span', tagName: 'span',
className: 'some-failed', className: 'some-failed',
templateName: 'some-failed', templateName: 'some-failed',
render_attributes: { render_attributes: {
someFailed: i18n('someRecipientsFailed') someFailed: i18n('someRecipientsFailed'),
} },
}); });
var TimerView = Whisper.View.extend({ const TimerView = Whisper.View.extend({
templateName: 'hourglass', templateName: 'hourglass',
initialize: function() { initialize() {
this.listenTo(this.model, 'unload', this.remove); this.listenTo(this.model, 'unload', this.remove);
}, },
update: function() { update() {
if (this.timeout) { if (this.timeout) {
clearTimeout(this.timeout); clearTimeout(this.timeout);
this.timeout = null; this.timeout = null;
@ -61,35 +63,35 @@
} }
if (this.model.isExpiring()) { if (this.model.isExpiring()) {
this.render(); this.render();
var totalTime = this.model.get('expireTimer') * 1000; const totalTime = this.model.get('expireTimer') * 1000;
var remainingTime = this.model.msTilExpire(); const remainingTime = this.model.msTilExpire();
var elapsed = (totalTime - remainingTime) / totalTime; const elapsed = (totalTime - remainingTime) / totalTime;
this.$('.sand').css('transform', 'translateY(' + elapsed*100 + '%)'); this.$('.sand').css('transform', `translateY(${elapsed * 100}%)`);
this.$el.css('display', 'inline-block'); this.$el.css('display', 'inline-block');
this.timeout = setTimeout(this.update.bind(this), Math.max(totalTime / 100, 500)); this.timeout = setTimeout(this.update.bind(this), Math.max(totalTime / 100, 500));
} }
return this; return this;
} },
}); });
Whisper.ExpirationTimerUpdateView = Whisper.View.extend({ Whisper.ExpirationTimerUpdateView = Whisper.View.extend({
tagName: 'li', tagName: 'li',
className: 'expirationTimerUpdate advisory', className: 'expirationTimerUpdate advisory',
templateName: 'expirationTimerUpdate', templateName: 'expirationTimerUpdate',
id: function() { id() {
return this.model.id; return this.model.id;
}, },
initialize: function() { initialize() {
this.conversation = this.model.getExpirationTimerUpdateSource(); this.conversation = this.model.getExpirationTimerUpdateSource();
this.listenTo(this.conversation, 'change', this.render); this.listenTo(this.conversation, 'change', this.render);
this.listenTo(this.model, 'unload', this.remove); this.listenTo(this.model, 'unload', this.remove);
}, },
render_attributes: function() { render_attributes() {
var seconds = this.model.get('expirationTimerUpdate').expireTimer; const seconds = this.model.get('expirationTimerUpdate').expireTimer;
var timerMessage; let timerMessage;
var timerUpdate = this.model.get('expirationTimerUpdate'); const timerUpdate = this.model.get('expirationTimerUpdate');
var prettySeconds = Whisper.ExpirationTimerOptions.getName(seconds); const prettySeconds = Whisper.ExpirationTimerOptions.getName(seconds);
if (timerUpdate && timerUpdate.fromSync) { if (timerUpdate && timerUpdate.fromSync) {
timerMessage = i18n('timerSetOnSync', prettySeconds); timerMessage = i18n('timerSetOnSync', prettySeconds);
@ -102,51 +104,51 @@
]); ]);
} }
return { content: timerMessage }; return { content: timerMessage };
} },
}); });
Whisper.KeyChangeView = Whisper.View.extend({ Whisper.KeyChangeView = Whisper.View.extend({
tagName: 'li', tagName: 'li',
className: 'keychange advisory', className: 'keychange advisory',
templateName: 'keychange', templateName: 'keychange',
id: function() { id() {
return this.model.id; return this.model.id;
}, },
initialize: function() { initialize() {
this.conversation = this.model.getModelForKeyChange(); this.conversation = this.model.getModelForKeyChange();
this.listenTo(this.conversation, 'change', this.render); this.listenTo(this.conversation, 'change', this.render);
this.listenTo(this.model, 'unload', this.remove); this.listenTo(this.model, 'unload', this.remove);
}, },
events: { events: {
'click .content': 'showIdentity' 'click .content': 'showIdentity',
}, },
render_attributes: function() { render_attributes() {
return { return {
content: this.model.getNotificationText() content: this.model.getNotificationText(),
}; };
}, },
showIdentity: function() { showIdentity() {
this.$el.trigger('show-identity', this.conversation); this.$el.trigger('show-identity', this.conversation);
} },
}); });
Whisper.VerifiedChangeView = Whisper.View.extend({ Whisper.VerifiedChangeView = Whisper.View.extend({
tagName: 'li', tagName: 'li',
className: 'verified-change advisory', className: 'verified-change advisory',
templateName: 'verified-change', templateName: 'verified-change',
id: function() { id() {
return this.model.id; return this.model.id;
}, },
initialize: function() { initialize() {
this.conversation = this.model.getModelForVerifiedChange(); this.conversation = this.model.getModelForVerifiedChange();
this.listenTo(this.conversation, 'change', this.render); this.listenTo(this.conversation, 'change', this.render);
this.listenTo(this.model, 'unload', this.remove); this.listenTo(this.model, 'unload', this.remove);
}, },
events: { events: {
'click .content': 'showIdentity' 'click .content': 'showIdentity',
}, },
render_attributes: function() { render_attributes() {
var key; let key;
if (this.model.get('verified')) { if (this.model.get('verified')) {
if (this.model.get('local')) { if (this.model.get('local')) {
@ -156,7 +158,7 @@
} }
return { return {
icon: 'verified', icon: 'verified',
content: i18n(key, this.conversation.getTitle()) content: i18n(key, this.conversation.getTitle()),
}; };
} }
@ -168,21 +170,21 @@
return { return {
icon: 'shield', icon: 'shield',
content: i18n(key, this.conversation.getTitle()) content: i18n(key, this.conversation.getTitle()),
}; };
}, },
showIdentity: function() { showIdentity() {
this.$el.trigger('show-identity', this.conversation); this.$el.trigger('show-identity', this.conversation);
} },
}); });
Whisper.MessageView = Whisper.View.extend({ Whisper.MessageView = Whisper.View.extend({
tagName: 'li', tagName: 'li',
templateName: 'message', templateName: 'message',
id: function() { id() {
return this.model.id; return this.model.id;
}, },
initialize: function() { initialize() {
// loadedAttachmentViews :: Promise (Array AttachmentView) | null // loadedAttachmentViews :: Promise (Array AttachmentView) | null
this.loadedAttachmentViews = null; this.loadedAttachmentViews = null;
@ -211,28 +213,30 @@
'click .timestamp': 'select', 'click .timestamp': 'select',
'click .status': 'select', 'click .status': 'select',
'click .some-failed': 'select', 'click .some-failed': 'select',
'click .error-message': 'select' 'click .error-message': 'select',
}, },
retryMessage: function() { retryMessage() {
var retrys = _.filter(this.model.get('errors'), const retrys = _.filter(
this.model.isReplayableError.bind(this.model)); this.model.get('errors'),
_.map(retrys, 'number').forEach(function(number) { this.model.isReplayableError.bind(this.model)
);
_.map(retrys, 'number').forEach((number) => {
this.model.resend(number); this.model.resend(number);
}.bind(this)); });
}, },
onExpired: function() { onExpired() {
this.$el.addClass('expired'); this.$el.addClass('expired');
this.$el.find('.bubble').one('webkitAnimationEnd animationend', function(e) { this.$el.find('.bubble').one('webkitAnimationEnd animationend', (e) => {
if (e.target === this.$('.bubble')[0]) { if (e.target === this.$('.bubble')[0]) {
this.remove(); this.remove();
} }
}.bind(this)); });
// Failsafe: if in the background, animation events don't fire // Failsafe: if in the background, animation events don't fire
setTimeout(this.remove.bind(this), 1000); setTimeout(this.remove.bind(this), 1000);
}, },
/* jshint ignore:start */ /* jshint ignore:start */
onUnload: function() { onUnload() {
if (this.avatarView) { if (this.avatarView) {
this.avatarView.remove(); this.avatarView.remove();
} }
@ -262,47 +266,47 @@
this.remove(); this.remove();
}, },
/* jshint ignore:end */ /* jshint ignore:end */
onDestroy: function() { onDestroy() {
if (this.$el.hasClass('expired')) { if (this.$el.hasClass('expired')) {
return; return;
} }
this.onUnload(); this.onUnload();
}, },
select: function(e) { select(e) {
this.$el.trigger('select', { message: this.model }); this.$el.trigger('select', { message: this.model });
e.stopPropagation(); e.stopPropagation();
}, },
className: function() { className() {
return ['entry', this.model.get('type')].join(' '); return ['entry', this.model.get('type')].join(' ');
}, },
renderPending: function() { renderPending() {
this.$el.addClass('pending'); this.$el.addClass('pending');
}, },
renderDone: function() { renderDone() {
this.$el.removeClass('pending'); this.$el.removeClass('pending');
}, },
renderSent: function() { renderSent() {
if (this.model.isOutgoing()) { if (this.model.isOutgoing()) {
this.$el.toggleClass('sent', !!this.model.get('sent')); this.$el.toggleClass('sent', !!this.model.get('sent'));
} }
}, },
renderDelivered: function() { renderDelivered() {
if (this.model.get('delivered')) { this.$el.addClass('delivered'); } if (this.model.get('delivered')) { this.$el.addClass('delivered'); }
}, },
renderRead: function() { renderRead() {
if (!_.isEmpty(this.model.get('read_by'))) { if (!_.isEmpty(this.model.get('read_by'))) {
this.$el.addClass('read'); this.$el.addClass('read');
} }
}, },
onErrorsChanged: function() { onErrorsChanged() {
if (this.model.isIncoming()) { if (this.model.isIncoming()) {
this.render(); this.render();
} else { } else {
this.renderErrors(); this.renderErrors();
} }
}, },
renderErrors: function() { renderErrors() {
var errors = this.model.get('errors'); const errors = this.model.get('errors');
this.$('.error-icon-container').remove(); this.$('.error-icon-container').remove();
@ -338,26 +342,26 @@
this.$('.meta').prepend(this.someFailedView.render().el); this.$('.meta').prepend(this.someFailedView.render().el);
} }
}, },
renderControl: function() { renderControl() {
if (this.model.isEndSession() || this.model.isGroupUpdate()) { if (this.model.isEndSession() || this.model.isGroupUpdate()) {
this.$el.addClass('control'); this.$el.addClass('control');
var content = this.$('.content'); const content = this.$('.content');
content.text(this.model.getDescription()); content.text(this.model.getDescription());
emoji_util.parse(content); emoji_util.parse(content);
} else { } else {
this.$el.removeClass('control'); this.$el.removeClass('control');
} }
}, },
renderExpiring: function() { renderExpiring() {
if (!this.timerView) { if (!this.timerView) {
this.timerView = new TimerView({ model: this.model }); this.timerView = new TimerView({ model: this.model });
} }
this.timerView.setElement(this.$('.timer')); this.timerView.setElement(this.$('.timer'));
this.timerView.update(); this.timerView.update();
}, },
isImageWithoutCaption: function() { isImageWithoutCaption() {
var attachments = this.model.get('attachments'); const attachments = this.model.get('attachments');
var body = this.model.get('body'); const body = this.model.get('body');
if (!attachments || attachments.length === 0) { if (!attachments || attachments.length === 0) {
return false; return false;
} }
@ -366,31 +370,29 @@
return false; return false;
} }
var first = attachments[0]; const first = attachments[0];
if (first.contentType.startsWith('image/') && first.contentType !== 'image/tiff') { if (first.contentType.startsWith('image/') && first.contentType !== 'image/tiff') {
return true; return true;
} }
return false; return false;
}, },
render: function() { render() {
var contact = this.model.isIncoming() ? this.model.getContact() : null; const contact = this.model.isIncoming() ? this.model.getContact() : null;
this.$el.html( this.$el.html(Mustache.render(_.result(this, 'template', ''), {
Mustache.render(_.result(this, 'template', ''), {
message: this.model.get('body'), message: this.model.get('body'),
timestamp: this.model.get('sent_at'), timestamp: this.model.get('sent_at'),
sender: (contact && contact.getTitle()) || '', sender: (contact && contact.getTitle()) || '',
avatar: (contact && contact.getAvatar()), avatar: (contact && contact.getAvatar()),
profileName: (contact && contact.getProfileName()), profileName: (contact && contact.getProfileName()),
innerBubbleClasses: this.isImageWithoutCaption() ? '' : 'with-tail', innerBubbleClasses: this.isImageWithoutCaption() ? '' : 'with-tail',
}, this.render_partials()) }, this.render_partials()));
);
this.timeStampView.setElement(this.$('.timestamp')); this.timeStampView.setElement(this.$('.timestamp'));
this.timeStampView.update(); this.timeStampView.update();
this.renderControl(); this.renderControl();
var body = this.$('.body'); const body = this.$('.body');
emoji_util.parse(body); emoji_util.parse(body);
@ -414,23 +416,21 @@
return this; return this;
}, },
updateColor: function() { updateColor() {
var bubble = this.$('.bubble'); const bubble = this.$('.bubble');
// this.contact is known to be non-null if we're registered for color changes // this.contact is known to be non-null if we're registered for color changes
var color = this.contact.getColor(); const color = this.contact.getColor();
if (color) { if (color) {
bubble.removeClass(Whisper.Conversation.COLORS); bubble.removeClass(Whisper.Conversation.COLORS);
bubble.addClass(color); bubble.addClass(color);
} }
this.avatarView = new (Whisper.View.extend({ this.avatarView = new (Whisper.View.extend({
templateName: 'avatar', templateName: 'avatar',
render_attributes: { avatar: this.contact.getAvatar() } render_attributes: { avatar: this.contact.getAvatar() },
}))(); }))();
this.$('.avatar').replaceWith(this.avatarView.render().$('.avatar')); this.$('.avatar').replaceWith(this.avatarView.render().$('.avatar'));
}, },
/* eslint-enable */
/* jshint ignore:start */
loadAttachmentViews() { loadAttachmentViews() {
if (this.loadedAttachmentViews !== null) { if (this.loadedAttachmentViews !== null) {
return this.loadedAttachmentViews; return this.loadedAttachmentViews;
@ -483,7 +483,5 @@
view.setElement(view.el); view.setElement(view.el);
this.trigger('afterChangeHeight'); this.trigger('afterChangeHeight');
}, },
/* jshint ignore:end */
/* eslint-disable */
}); });
})(); }());