Image upload with preprocessing

Support Forms & Blueprints
#1

Hey guys,

I am trying to create a new form field based on the file upload field. My goal is to do some image preprocessing on the temporary image file before uploading it to the destination folder.

Do you have any hints how I get the temporary image file path after the upload via dropzone finishes? Are there events to hook into?

Is there any kind of documentation regarding the Grav Dropzone?

Edit: Found out Grav uses Dropzone,js (https://www.dropzonejs.com/)

#2

@stepbyweb, You could create a plugin and subscribe to event onFormProcessed.

In that event, you can fetch the values submitted by the form. Never tried your specific use-case though…

1 Like
#3

Right now my solution is a pure JavaScript one.

I also decided to do pre-upload manipulation.

You can get the Dropzone object from Grav’s file field or the pagemedia field (which I switched to) and intercept the image upload with the Dropzone’s “transformFile” hook.

At this point I can manipulate the dropped image and return it to Grav for uploading.

1 Like