Is there a way to define a minWidth and minHeight for images to be uploaded?
And in the case for the image to have dimensions lower than the minimum defined dimensions it should display an error like the default for images not corresponding the permitted file type but saying something like: "you can't upload images with width lower than 500px".

How could I do this?

Is there a way to define a minWidth and minHeight for images to be uploaded?
And in the case for the image to have dimensions lower than the minimum defined dimensions it should display an error like the default for images not corresponding the permitted file type but saying something like: "you can't upload images with width lower than 500px".

How could I do this?

• javascript
• dropzone.js

2 Answers 2

From their page, when creating the dropzone you can specify an accept function which validates the dropped file:

Dropzone.options.myAwesomeDropzone = {
  paramName: "file", // The name that will be used to transfer the file
  maxFilesize: 2, // MB
  accept: function(file, done) {
    if (/* Get dimensions and check */) {
      done("Invalid dimensions!");
    }
    else { done(); }
  }
};

As for getting the height and width before upload, AFAIK the best way at the moment is to create a hidden img tag. See this fiddle for example http://jsfiddle/superscript18/nry4h/

Dropzone.options.myAwesomeDropzone = {
paramName: "file", // The name that will be used to transfer the file
maxFilesize: 2, // MB
accept: function(file, done) {
// FileReader() asynchronously reads the contents of files (or raw data buffers) stored on the user's puter.
        var reader = new FileReader();
        reader.onload = (function(entry) {
          // The Image() constructor creates a new HTMLImageElement instance.
          var image = new Image(); 
          image.src = entry.target.result;
          image.onload = function() {

            console.log(this.width);
            console.log(this.height);

          };
        });

        reader.readAsDataURL(file);
if (/* Get dimensions and check */) {
  done("Invalid dimensions!");
}
else { done(); }
}
}