nuxt / image

Plug-and-play image optimization for Nuxt applications.
https://image.nuxt.com
MIT License
1.28k stars 253 forks source link

Missing fit modes on cloudinary provider, and existing ones are wrongly mapped #1354

Open ptdev opened 1 month ago

ptdev commented 1 month ago

Hey,

The cloudinary provider is missing some fit modes that are supported by Cloudinary.

Specifically, I was looking to use the "lfill" mode, which as far as I can see, is the equivalent to the "cover" mode in nuxt-image.

But after looking into the source code, nuxt-image is apparently mapping the "cover" mode with cloudinary's "fit" mode which are not equivalent.

According to nuxt-image docs, the "cover" mode states:

Preserving aspect ratio, ensure the image covers both provided dimensions by cropping/clipping to fit

While cloudinary's "fit" mode does not crop or clip images. From their docs regarding their "fit" mode, they state:

(...) The original aspect ratio is retained and all of the original image is visible

Also, doing a test with the same image using ipx and cloudinary using default values yields different images which further confirms the mappings for the fit modes are not totally correct.

Cheers!

danielroe commented 1 month ago

Improvement would be welcome 🙏

ptdev commented 1 month ago

Hey,

I've submitted a 1 line PR with just the correct mapping for nuxt-image's default "cover" fit mode to the correct cloudinary fit mode (lfill).

As for the other missing cloudinary fit modes, since they're mapped to different names, I'll leave that for the nuxt team as I'm not sure how to name them 😕

Cheers

danielroe commented 1 month ago

@ptdev How would you describe the issue with other fit modes? Would you give an example of what you're trying that isn't working?

ptdev commented 1 month ago

Hey,

Thanks for the merge.

I didn't actually came across any issues with the missing modes.

It was just that when I was investigating the issue with the cover<->lfill mapping and looking at cloudinary's documentation, I noticed that cloudinary appears to have some more modes that are not on this module.

But looking at it closer now it seems it's just missing the "fill_pad" and auto modes which maybe don't even apply.

And their "fit" mode is now also unmapped after switching it to the correct "lfill" mode.

I honestly do not need any other modes so didn't get quite into all details, sorry.

Cheers. 👍