title: Resize image before upload, but upload synchronously (not ajax). Is it possible?
body: <p>I have a form with some fields, including a input type='file', used to upload images.<br>
  I'm searching for a way to resize de image selected by this field, but not upload immediatly.</p>
  
  <p>I've read some tutorials that teaches the following proccess:<br>
  1 - catch the image using 'onchange' event on the file field;<br>
  2 - create a canvas element with the desired image size;<br>
  3 - draw the image in the canvas element and read its contents;<br>
  4 - send the image data asynchronously (ajax) using FormData.</p>
  
  <p>I'd like to do the same thing until step 3, and then send the resized image together with the other fields when the user clicks the form's submit button.</p>
  
  <p>Does anybody have any idea?<br>
  Thanks!</p>
  
  <p>Ps: Some posts that ALMOST do what I desire:<br>
  <a href="http://coding.pressbin.com/84/File-API-Resize-photo-before-upload/" rel="nofollow noreferrer">http://coding.pressbin.com/84/File-API-Resize-photo-before-upload/</a><br>
  <a href="https://stackoverflow.com/questions/2303690/resizing-an-image-in-an-html5-canvas">Resizing an image in an HTML5 canvas</a></p>