Skip to content

Instantly share code, notes, and snippets.

@stgoos
Forked from jacobtwlee/ProcessFile.js
Created January 15, 2017 15:12
Show Gist options
  • Save stgoos/7c36653484dc8cc441e0bb840f73fa15 to your computer and use it in GitHub Desktop.
Save stgoos/7c36653484dc8cc441e0bb840f73fa15 to your computer and use it in GitHub Desktop.
Processing the image with canvas
function processFile(dataURL, fileType) {
var maxWidth = 800;
var maxHeight = 800;
var image = new Image();
image.src = dataURL;
image.onload = function () {
var width = image.width;
var height = image.height;
var shouldResize = (width > maxWidth) || (height > maxHeight);
if (!shouldResize) {
sendFile(dataURL);
return;
}
var newWidth;
var newHeight;
if (width > height) {
newHeight = height * (maxWidth / width);
newWidth = maxWidth;
} else {
newWidth = width * (maxHeight / height);
newHeight = maxHeight;
}
var canvas = document.createElement('canvas');
canvas.width = newWidth;
canvas.height = newHeight;
var context = canvas.getContext('2d');
context.drawImage(this, 0, 0, newWidth, newHeight);
dataURL = canvas.toDataURL(fileType);
sendFile(dataURL);
};
image.onerror = function () {
alert('There was an error processing your file!');
};
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment