Image editor button not showing up in the interface on larger files

directus / v8-archive

Directus Database API — Wraps Custom SQL Databases with a REST/GraphQL API

https://docs.directus.io/api/reference.html

505 stars 204 forks source link

Image editor button not showing up in the interface on larger files #2292

Open sascha-schieferdecker opened 4 years ago

sascha-schieferdecker commented 4 years ago

Directus Version: 8.5.5

In the files collection, I get the image editor only on smaller files.

The button to start the image editing doesn't show if the file seems to be larger than roughly 1MB. I can reproduce this behavior with the demo instance.

Is this known and is there any workaround?

rijkvanzanten commented 4 years ago

This is by design, as the image edits are all done client side and sent up as base64 data. Trying to manage bigger files causes issues in memory management / api timeouts in various browsers

sascha-schieferdecker commented 4 years ago

Do you see any chance to change this design to cropping a generated thumb if the image is larger than a certain size? I think that would work, the cropping values of the thumbnail just have to be calculated for the original image. IMHO for the editor it would really be a big step if all images could be cropped and edited.

rijkvanzanten commented 4 years ago

If we can move the actual cropping logic to the API, and only have the app submit the new dimensions and x/y values, then sure. Until that's the case, we're bound to what the browser can hold in memory

sascha-schieferdecker commented 4 years ago

Ah I get it. The cropping process itself is done in the browser.

The workflow could be like this:

user opens image in files collection
API sends a scaled down version for cropping
the original width / height is already known in the app
user crops image - and by cropping I think of just setting crop coordinates
app calculates ratio of cropped file coordinates to coordinates of full size image
app sends calculated coordinates to backend
API generates cropped image

Is this something that could be worth turning into a feature request? IMHO it would be a nice feature, because it is not transparent for a non technical editor why some images can be cropped while others can't.

rijkvanzanten commented 4 years ago

Exactly! Yeah definitely, we should open this as a feature request on the API.

I'm thinking this should be a separate endpoint for modifying the image assets, as the regular PATCH /files/:id endpoint is used for updating the fields associated with the file. Thoughts on that @sascha-schieferdecker ?

sascha-schieferdecker commented 4 years ago

I think it really makes sense to introduce a separate endpoint for that. The files endpoint should stay the way it is.

The new endpoint is more about modifying properties and additional information of a file. So the changes could even be non destructive, if this endpoint would just save the crop coordinates and rotation for example.

But non destructive editing would mean more changes in the thumper middleware for thumbnail generation. I don't know if this is doable in a reasonable amount of time.