Safari needs the img.onload event before actually working on the img

This commit is contained in:
Emmanuel ROHEE 2014-08-22 10:15:15 +02:00
parent be2f948da5
commit c8d0c4762d
2 changed files with 39 additions and 27 deletions

View file

@ -82,6 +82,7 @@ angular.module('mFileUpload', ['matrixService', 'mUtilities'])
// First, get the image size
mUtilities.getImageSize(imageFile).then(
function(size) {
console.log("image size: " + JSON.stringify(size));
// The final operation: send imageFile
var uploadImage = function() {

View file

@ -38,10 +38,15 @@ angular.module('mUtilities', [])
img.src = e.target.result;
// Once ready, returns its size
deferred.resolve({
width: img.width,
height: img.height
});
img.onload = function() {
deferred.resolve({
width: img.width,
height: img.height
});
};
img.onerror = function(e) {
deferred.reject(e);
};
};
reader.onerror = function(e) {
deferred.reject(e);
@ -72,32 +77,38 @@ angular.module('mUtilities', [])
img.src = e.target.result;
var ctx = canvas.getContext("2d");
ctx.drawImage(img, 0, 0);
// Once ready, returns its size
img.onload = function() {
var ctx = canvas.getContext("2d");
ctx.drawImage(img, 0, 0);
var MAX_WIDTH = maxSize;
var MAX_HEIGHT = maxSize;
var width = img.width;
var height = img.height;
var MAX_WIDTH = maxSize;
var MAX_HEIGHT = maxSize;
var width = img.width;
var height = img.height;
if (width > height) {
if (width > MAX_WIDTH) {
height *= MAX_WIDTH / width;
width = MAX_WIDTH;
if (width > height) {
if (width > MAX_WIDTH) {
height *= MAX_WIDTH / width;
width = MAX_WIDTH;
}
} else {
if (height > MAX_HEIGHT) {
width *= MAX_HEIGHT / height;
height = MAX_HEIGHT;
}
}
} else {
if (height > MAX_HEIGHT) {
width *= MAX_HEIGHT / height;
height = MAX_HEIGHT;
}
}
canvas.width = width;
canvas.height = height;
var ctx = canvas.getContext("2d");
ctx.drawImage(img, 0, 0, width, height);
canvas.width = width;
canvas.height = height;
var ctx = canvas.getContext("2d");
ctx.drawImage(img, 0, 0, width, height);
var dataUrl = canvas.toDataURL("image/jpeg", 0.7);
deferred.resolve(self.dataURItoBlob(dataUrl));
var dataUrl = canvas.toDataURL("image/jpeg", 0.7);
deferred.resolve(self.dataURItoBlob(dataUrl));
};
img.onerror = function(e) {
deferred.reject(e);
};
};
reader.onerror = function(e) {
deferred.reject(e);