Preview and Cropper images not handling small sizes

Hi Lefteris,

I am currently testing J5 on our sites and found some odd behavior with the Econa image cropping field (we use it for creating a 16:9 feature image for all of our content).

In plugins/fields/econa/src/Field/EconaField.php in the getImages() method it appears to me that the logic for $previewImage and $cropperImage is not thought through for small preview sizes.

We have a $sizes array of [1000, 600, 400, 300, 200, 80] and this is resulting in the following return values:

$previewImage = /images/econa/feature-image-landscape/51426/80/tb-0924-p39_fig1.jpeg?t=1725521510

$cropperImage = /images/econa/feature-image-landscape/51426/tb-0924-p39_fig1.jpeg?t=1725521510

This means when we open the article and view the econa cropper field we see an 80px preview version of the file which just looks like a blob.  if we click edit we see the expected 1000px cropper image but the preview at 80px size is not informative.

I assume you are doing this to prevent displaying an enormous preview image but maybe the $previewImage size should be chosen from the sizes value closest to the enclosing div's size of 600px (from the .econa-container class).

i wrote a little snippet and tested this thinking -- it works well for our use case.  i'm sure the block could be tightened up but it was tested and works with size arrays with values over 600, straddling 600 and under 600.  here is the snippet from 

/*
 * find largest size <= 600 or use last size if not found
 */
$validSizes = array_filter($sizes, function ($k) {
    return $k <= 600;
});
if (!empty($validSizes)) {
    $previewSize = max($validSizes);
} else {
    $previewSize = end($sizes);
}

$previewImage = Uri::root(true) . '/' . $this->value['path'] . '/' . $previewSize . '/' . $this->value['filename'] . '.' . $this->value['extension'] . '?t=' . time();

Let me know if I misunderstood the code here but for me this matches more properly the behavior in J4 while using the new J5 features and not showing an 80px  thumbnail as a 600px preview.

Thank you,

Oliver Rockwell

Hi Lefteris,

That's funny.  I assumed you were specifically taking the smallest image because of some outlier case with a huge image breaking the preview page.  I first changed the call 'end($sizes)' to 'max($sizes)' but then realized if I did that than $cropperImage and $previewImage were effectively identical since $previewImage was being generated from the max size during the upgrade from v1 to v2. 

I guess my question now is do you really need both a cropper and preview version when the cropper version would probably work in both cases?

I actually want to remove some of our no longer used sizes because we now use Cloudinary for dynamic resizing and just need our largest size -- Econa is still great for generating the core 16:9 feature image.  Do you have any advice on doing this?  I'm worried that removing legacy sizes may cause older fields to misbehave.  I obviously plan on thoroughly testing this beforehand but thought you might have some warnings or suggestions.

Thanks for the quick response.

Oliver

Hi Lefteris,

I actually started building out a quick console plugin to upgrade the images and when testing the discover install realized there was already an 'econa:upgrade' console plugin.  mine was almost identical to yours which confused me for a bit.  I've run it on our J5 test site and works as expected.

i'll play with removing the old sizes and let you know if there are any issues.  i'll also look into a console plugin to remove unneeded sizes and possibly adding new sizes to legacy content if that comes up.

I'm happy to discuss and share code as to how we have integrated Cloudinary into our Joomla sites and use it with Econa.  We've been using Cloudinary for almost 5 years now and are very happy with it but do find it more efficient in terms of cost and transformations to bypass the API for generating image URLs.  We've built out some Joomla libraries to handle this.  Let's have a private discussion about this if you're interested.

Oliver