Scale and crop avatars to 256 square thumbnails.

Fixes #213 // FREEBIE
This commit is contained in:
lilia 2015-06-04 11:55:23 -07:00
parent cdb7fcfbad
commit f4a206b266
3 changed files with 39 additions and 4 deletions

View file

@ -85,7 +85,7 @@
// loadImage.scale -> components/blueimp-load-image
var canvas = loadImage.scale(img, {
canvas: true, maxWidth: 1920, maxHeight: 1920
canvas: true, maxWidth: maxWidth, maxHeight: maxHeight
});
var quality = 0.95;
@ -163,6 +163,41 @@
return this.autoScale(file).then(this.readFile);
},
getThumbnail: function() {
// Scale and crop an image to 256px square
var size = 256;
var file = this.file || this.$input.prop('files')[0];
if (file.type.split('/')[0] !== 'image' || file.type === 'image/gif') {
// nothing to do
return Promise.resolve();
}
return new Promise(function(resolve, reject) {
var url = URL.createObjectURL(file);
var img = document.createElement('img');
img.onerror = reject;
img.onload = function () {
URL.revokeObjectURL(url);
// loadImage.scale -> components/blueimp-load-image
// scale, then crop.
var canvas = loadImage.scale(img, {
canvas: true, maxWidth: size, maxHeight: size,
cover: true, minWidth: size, minHeight: size
});
canvas = loadImage.scale(canvas, {
canvas: true, maxWidth: size, maxHeight: size,
crop: true, minWidth: size, minHeight: size
});
// dataURLtoBlob -> components/blueimp-canvas-to-blob
var blob = dataURLtoBlob(canvas.toDataURL('image/png'));
resolve(blob);
};
img.src = url;
}).then(this.readFile);
},
readFile: function(file) {
var contentType = file.type;
return new Promise(function(resolve, reject) {

View file

@ -114,7 +114,7 @@
return;
}
return this.avatarInput.getFile().then(function(avatarFile) {
return this.avatarInput.getThumbnail().then(function(avatarFile) {
var members = this.getRecipients().pluck('id');
textsecure.storage.groups.createNewGroup(members).then(function(group) {
return group.id;

View file

@ -46,10 +46,10 @@
};
},
send: function() {
return this.avatarInput.getFiles().then(function(avatarFiles) {
return this.avatarInput.getThumbnail().then(function(avatarFile) {
this.model.save({
name: this.$('.name').val(),
avatar: avatarFiles[0],
avatar: avatarFile,
members: _.union(this.model.get('members'), this.recipients_view.recipients.pluck('id'))
});
textsecure.messaging.updateGroup(