diff --git a/modules/backend/formwidgets/fileupload/assets/js/fileupload.js b/modules/backend/formwidgets/fileupload/assets/js/fileupload.js index 8062c6bd5..447c950f3 100644 --- a/modules/backend/formwidgets/fileupload/assets/js/fileupload.js +++ b/modules/backend/formwidgets/fileupload/assets/js/fileupload.js @@ -124,6 +124,8 @@ this.uploaderOptions.thumbnailHeight = this.options.thumbnailHeight ? this.options.thumbnailHeight : null + this.uploaderOptions.resize = this.onResizeFileInfo + /* * Add CSRF token to headers */ @@ -139,6 +141,40 @@ this.dropzone.on('error', this.proxy(this.onUploadError)) } + FileUpload.prototype.onResizeFileInfo = function(file) { + var info, + targetWidth, + targetHeight + + if (!this.options.thumbnailWidth && !this.options.thumbnailWidth) { + targetWidth = targetHeight = 100 + } + else if (this.options.thumbnailWidth) { + targetWidth = this.options.thumbnailWidth + targetHeight = this.options.thumbnailWidth * file.height / file.width + } + else if (this.options.thumbnailHeight) { + targetWidth = this.options.thumbnailHeight * file.height / file.width + targetHeight = this.options.thumbnailHeight + } + + // drawImage(image, srcX, srcY, srcWidth, srcHeight, trgX, trgY, trgWidth, trgHeight) takes an image, clips it to + // the rectangle (srcX, srcY, srcWidth, srcHeight), scales it to dimensions (trgWidth, trgHeight), and draws it + // on the canvas at coordinates (trgX, trgY). + info = { + srcX: 0, + srcY: 0, + srcWidth: file.width, + srcHeight: file.height, + trgX: 0, + trgY: 0, + trgWidth: targetWidth, + trgHeight: targetHeight + } + + return info + } + FileUpload.prototype.onUploadAddedFile = function(file) { var $object = $(file.previewElement).data('dzFileObject', file)