checking image size before upload

Question

I noticed when uploading a profile pic to Twitter that its size is checked before upload. Can anyone point me to a solution like this?

Thanks

Answer 1

Something like this should cope with forms loaded asynchronously, inputs with or without "multiple" set and avoid the race conditions that happen when using FileReader.readAsDataURL and Image.src.

$('#formContainer').on('change', '#inputFileUpload', function(event) {
  var file, _fn, _i, _len, _ref;
  _ref = event.target.files;
  _fn = function(file) {
    var reader = new FileReader();
    reader.onload = (function(f) {
      return function() {
        var i = new Image();
        i.onload = (function(e) {
          var height, width;
          width = e.target.width;
          height = e.target.height;
          return doSomethingWith(width, height);
        });
        return i.src = reader.result;
      };
    })(file);
    return reader.readAsDataURL(file);
  };
  for (_i = 0, _len = _ref.length; _i < _len; _i++) {
    file = _ref[_i];
    _fn(file);
  }
});

Note: Needs jQuery, HTML5, hooks to a structure like:

  

  ...
    
  ...