Simpe Image Resampling

upload.js

// var fileInput = document.querySelector('file');
var targetWidth = 400;
var targetHeight = 400;

function doUpload () {
  // upload picture
}

fileInput.onChange = function () {
  var file = this.files[0];
  var reader = new FileReader();
  reader.onload = function () {
    var image = new Image();
    image.onload = function () {
      var canvas = document.createElement('canvas');
      var context = canvas.getContext('2d');
      context.drawImage(image, 0, 0, targetWidth, targetHeight);
      var imageData = context.toDataURL('image/png');
      doUpload(imageData);
    }
    
  }
  reader.readAsDataURL(file);
}