Make thumbnails on quote load and on quote preview creation

This commit is contained in:
Scott Nonnenberg 2018-04-18 18:25:55 -07:00
parent 37cac717cb
commit 13ce056830
No known key found for this signature in database
GPG key ID: 5F82280C35134661
4 changed files with 131 additions and 70 deletions

View file

@ -610,6 +610,59 @@
return _.without(this.get('members'), me);
},
blobToArrayBuffer(blob) {
return new Promise((resolve, reject) => {
const fileReader = new FileReader();
fileReader.onload = e => resolve(e.target.result);
fileReader.onerror = reject;
fileReader.onabort = reject;
fileReader.readAsArrayBuffer(blob);
});
},
async makeThumbnailAttachment(attachment) {
const attachmentWithData = await loadAttachmentData(attachment);
const { data, contentType } = attachmentWithData;
const objectUrl = this.makeObjectUrl(data, contentType);
const thumbnail = await Whisper.FileInputView.makeThumbnail(128, objectUrl);
URL.revokeObjectURL(objectUrl);
const arrayBuffer = await this.blobToArrayBuffer(thumbnail);
const finalContentType = 'image/png';
const finalObjectUrl = this.makeObjectUrl(arrayBuffer, finalContentType);
return {
data: arrayBuffer,
objectUrl: finalObjectUrl,
contentType: finalContentType,
};
},
async makeQuote(quotedMessage) {
const contact = quotedMessage.getContact();
const attachments = quotedMessage.get('attachments');
return {
author: contact.id,
id: quotedMessage.get('sent_at'),
text: quotedMessage.get('body'),
attachments: await Promise.all((attachments || []).map(async (attachment) => {
const { contentType } = attachment;
const willMakeThumbnail = MIME.isImage(contentType);
return {
contentType,
fileName: attachment.fileName,
thumbnail: willMakeThumbnail
? await this.makeThumbnailAttachment(attachment)
: null,
};
})),
};
},
sendMessage(body, attachments) {
this.queueJob(async () => {
const now = Date.now();
@ -1113,18 +1166,8 @@
const queryFirst = queryAttachments[0];
try {
queryMessage.attachments[0] = await loadAttachmentData(queryFirst);
// Note: it would be nice to take the full-size image and downsample it into
// a true thumbnail here.
queryMessage.updateImageUrl();
// We need to differentiate between messages we load from database and those
// already in memory. More cleanup needs to happen on messages from the database
// because they aren't tracked any other way.
// eslint-disable-next-line no-param-reassign
message.quotedMessageFromDatabase = queryMessage;
message.quoteThumbnail = await this.makeThumbnailAttachment(queryFirst);
return true;
} catch (error) {
console.log(
@ -1155,12 +1198,9 @@
try {
const queryFirst = quotedAttachments[0];
// eslint-disable-next-line no-param-reassign
quotedMessage.attributes.attachments[0] = await loadAttachmentData(queryFirst);
// Note: it would be nice to take the full-size image and downsample it into
// a true thumbnail here.
quotedMessage.updateImageUrl();
// eslint-disable-next-line no-param-reassign
message.quoteThumbnail = await this.makeThumbnailAttachment(queryFirst);
} catch (error) {
console.log(
'Problem loading attachment data for quoted message',

View file

@ -188,6 +188,16 @@
if (this.quotedMessage) {
this.quotedMessage = null;
}
const quote = this.get('quote');
const attachments = (quote && quote.attachments) || [];
attachments.forEach((attachment) => {
if (attachment.thumbnail && attachment.thumbnail.objectUrl) {
URL.revokeObjectURL(attachment.thumbnail.objectUrl);
// eslint-disable-next-line no-param-reassign
attachment.thumbnail.objectUrl = null;
}
});
this.revokeImageUrl();
},
revokeImageUrl() {
@ -203,16 +213,6 @@
return this.imageUrl;
},
getQuoteObjectUrl() {
const fromDB = this.quotedMessageFromDatabase;
if (fromDB && fromDB.imageUrl) {
return fromDB.imageUrl;
}
const inMemory = this.quotedMessage;
if (inMemory && inMemory.imageUrl) {
return inMemory.imageUrl;
}
const thumbnail = this.quoteThumbnail;
if (thumbnail && thumbnail.objectUrl) {
return thumbnail.objectUrl;
@ -232,8 +232,11 @@
return ConversationController.get(author);
},
processAttachment(attachment, objectUrl) {
const thumbnail = !objectUrl
processAttachment(attachment, externalObjectUrl) {
const { thumbnail } = attachment;
const objectUrl = (thumbnail && thumbnail.objectUrl) || externalObjectUrl;
const thumbnailWithObjectUrl = !objectUrl
? null
: Object.assign({}, attachment.thumbnail || {}, {
objectUrl,
@ -242,7 +245,7 @@
return Object.assign({}, attachment, {
// eslint-disable-next-line no-bitwise
isVoiceMessage: Boolean(attachment.flags & this.VOICE_FLAG),
thumbnail,
thumbnail: thumbnailWithObjectUrl,
});
},
getPropsForQuote() {