DropzoneJS: Image dimensions after file has been resized

Viewed 60

I’m using DropzoneJS to facilitate the upload of files (images) as part of a .net core application. I want to be able to send the dimensions (width and height) of the file to the .net controller. But I haven’t been able to figure out how to obtain the media file dimensions after the file has been resized.

Here is the js declaration:

product_media_dropzode_ctrl = new Dropzone("#product_form_ctrl", {
    paramName: "file",                                                               
    maxFilesize: 3,                               
    maxFiles: 10,                                  
    acceptedFiles: ".jpeg,.jpg,.png,.gif",                               

    autoProcessQueue: true,
    uploadMultiple: false,                                                         
    parallelUploads: 100,

    resizeWidth: 1920,
    resizeHeight: 1080,
    resizeMimeType: 'image/jpeg',
    resizeQuality: 1.0,
    resizeMethod: 'crop',

    accept: function (file, done) {
        if (UploadedNumberFiles() > maxNumberOfMediaFile) {
            done("The maximum number of files has been reached.");
        }
        else {
            done();
        }
    },
    init: function () {
        this.on("thumbnail", function (file, dataUrl) {
            **console.log("widthXheight:" + file.width + "X" + file.height);**
            $('#product_width_hidden_ctrl').val(file.width);
            $('#product_height_hidden_ctrl').val(file.height);
        })
        this.on("success", function (file, response) {
            HandleUploadSuccess(response);
        });
        this.on('error', function (file, response) {
            HandleUploadError(response);
        });
    },
});

}

If I upload a file 4151X2000, the file will be resized to 1920X1080, however the line below will display 4151X2000 instead of 1920X1080. If I upload a file 1800X1200, 1800X1200 is display instead of 1800X1080 which is the dimension of the file after being resized

            **console.log("widthXheight:" + file.width + "X" + file.height);**

Is there a way to capture the file dimensions after the image has been resized and before the file is submitted to the server?

0 Answers
Related