mirrors/signal-desktop
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages 2 Wiki Activity Actions

Pop toast on attempted attach if image attachment is too large

Browse source
This commit is contained in:
Scott Nonnenberg 2018-09-05 17:47:21 -07:00
parent 8290146721
commit 46dac94ab8
2 changed files with 75 additions and 42 deletions
Download patch file Download diff file Expand all files Collapse all files

3
_locales/en/messages.json
View file

@ -549,6 +549,9 @@
"fileSizeWarning": { "fileSizeWarning": {
"message": "Sorry, the selected file exceeds message size restrictions." "message": "Sorry, the selected file exceeds message size restrictions."
}, },
"unableToLoadAttachment": {
"message": "Unable to load selected attachment."
},
"disconnected": { "disconnected": {
"message": "Disconnected", "message": "Disconnected",
"description": "description":

114
js/views/file_input_view.js
View file

@ -24,6 +24,12 @@
}; };
}, },
}); });
Whisper.UnableToLoadToast = Whisper.ToastView.extend({
render_attributes() {
return { toastMessage: i18n('unableToLoadAttachment') };
},
});
Whisper.UnsupportedFileTypeToast = Whisper.ToastView.extend({ Whisper.UnsupportedFileTypeToast = Whisper.ToastView.extend({
template: i18n('unsupportedFileType'), template: i18n('unsupportedFileType'),
}); });
@ -88,14 +94,21 @@
this.thumb.$('img')[0].onload = () => { this.thumb.$('img')[0].onload = () => {
this.$el.trigger('force-resize'); this.$el.trigger('force-resize');
}; };
this.thumb.$('img')[0].onerror = () => {
this.unableToLoadAttachment();
};
},
unableToLoadAttachment() {
const toast = new Whisper.UnableToLoadToast();
toast.$el.insertAfter(this.$el);
toast.render();
this.deleteFiles();
}, },
autoScale(file) { autoScale(file) {
if ( if (file.type.split('/')[0] !== 'image' || file.type === 'image/tiff') {
file.type.split('/')[0] !== 'image' ||
file.type === 'image/gif' ||
file.type === 'image/tiff'
) {
// nothing to do // nothing to do
return Promise.resolve(file); return Promise.resolve(file);
} }
@ -111,14 +124,19 @@
const maxHeight = 4096; const maxHeight = 4096;
const maxWidth = 4096; const maxWidth = 4096;
if ( if (
img.width <= maxWidth && img.naturalWidth <= maxWidth &&
img.height <= maxHeight && img.naturalHeight <= maxHeight &&
file.size <= maxSize file.size <= maxSize
) { ) {
resolve(file); resolve(file);
return; return;
} }
if (file.type === 'image/gif') {
reject(new Error('GIF is too large'));
return;
}
const canvas = loadImage.scale(img, { const canvas = loadImage.scale(img, {
canvas: true, canvas: true,
maxWidth, maxWidth,
@ -180,6 +198,9 @@
const renderImagePreview = async () => { const renderImagePreview = async () => {
if (!MIME.isJPEG(file.type)) { if (!MIME.isJPEG(file.type)) {
this.previewObjectUrl = URL.createObjectURL(file); this.previewObjectUrl = URL.createObjectURL(file);
if (!this.previewObjectUrl) {
throw new Error('Failed to create object url for image!');
}
this.addThumb(this.previewObjectUrl); this.addThumb(this.previewObjectUrl);
return; return;
} }
@ -206,42 +227,51 @@
this.addThumb('images/file.svg'); this.addThumb('images/file.svg');
} }
const blob = await this.autoScale(file); try {
let limitKb = 1000000; const blob = await this.autoScale(file);
const blobType = let limitKb = 1000000;
file.type === 'image/gif' ? 'gif' : contentType.split('/')[0]; const blobType =
file.type === 'image/gif' ? 'gif' : contentType.split('/')[0];
switch (blobType) { switch (blobType) {
case 'image': case 'image':
limitKb = 6000; limitKb = 6000;
break; break;
case 'gif': case 'gif':
limitKb = 25000; limitKb = 25000;
break; break;
case 'audio': case 'audio':
limitKb = 100000; limitKb = 100000;
break; break;
case 'video': case 'video':
limitKb = 100000; limitKb = 100000;
break; break;
default: default:
limitKb = 100000; limitKb = 100000;
break; break;
} }
if ((blob.size / 1024).toFixed(4) >= limitKb) { if ((blob.size / 1024).toFixed(4) >= limitKb) {
const units = ['kB', 'MB', 'GB']; const units = ['kB', 'MB', 'GB'];
let u = -1; let u = -1;
let limit = limitKb * 1000; let limit = limitKb * 1000;
do { do {
limit /= 1000; limit /= 1000;
u += 1; u += 1;
} while (limit >= 1000 && u < units.length - 1); } while (limit >= 1000 && u < units.length - 1);
const toast = new Whisper.FileSizeToast({ const toast = new Whisper.FileSizeToast({
model: { limit, units: units[u] }, model: { limit, units: units[u] },
}); });
toast.$el.insertAfter(this.$el); toast.$el.insertAfter(this.$el);
toast.render(); toast.render();
this.deleteFiles(); this.deleteFiles();
}
} catch (error) {
window.log.error(
'Error ensuring that image is properly sized:',
error && error.message ? error.message : error
);
this.unableToLoadAttachment();
} }
}, },