JoomGalleryfriends / JG4-dev

Development repository for JoomGallery v4.x
GNU General Public License v3.0
10 stars 7 forks source link

IMGtools service #18

Closed Elfangor93 closed 2 years ago

Elfangor93 commented 2 years ago

This PR fixes different bugs and makes a lot of code improvements on the IMGtools service.

What is this service for

The IMGtools service will be used to perform image manipulations (resize, rotate, flip, orient, watermatk) and to handle image metadata (readMetadata, copyMetadata).

The service exists for two different image processors:

How to use this service

You can load the service anywhere in Joomla by doing

$component = Factory::getApplication()->bootComponent('com_joomgallery');  // boot JoomGallery component
$component->createIMGtools('gd');   // instantiate service with gd as image processor
$img = $component->getIMGtools();   // load the service into your scope
$img->read('image.jpg');   // read image from file
$img-><METHOD>   // whatever you want to do with the image

How to test this service

Make sure "Debug System" is "Yes" in Joomla Global configuration. Open the file /administrator/com_joomgallery/src/View/Faulties/HtmlView.php and insert the following code on line 62 after throw new \Exception(implode("\n", $errors)); }

// Test IMGtools
$this->component->createIMGtools('gd');
$img = $this->component->getIMGtools();
$img->set('keep_metadata', false);
$img->set('keep_anim', false);
$img->set('auto_orient', true);
$img->read('/images/<YOUR_IMAGE>.jpg');
$img->watermark('/images/joomla_black.png', 9, 2, 25, 50);
$img->resize(3, 500, 500);

// Output image
echo $img->stream(80);
$this->component->printDebug();

// Output image metadata
echo '<br /><br /><h3>Image metadata:</h3>';
dump($img->get('metadata'));

Navigate to Components->JoomGallery->Maintenance Manager to see the IMGtools service running...

What to test

Different Images

Different processing methods

Test the images with different amount and different order of processing methods. Available methods:

more infos: IMGtools interface

Different image processors

Elfangor93 commented 2 years ago

@szepty-ziemi You have to replace in $img->read('/images/<YOUR_IMAGE>.jpg');with the name of the image you uploaded to the images folder and with which you want to perform the tests. It is not related to images in the Image Manager.

Elfangor93 commented 2 years ago

During testing you need to adjust the code i provided under "How to test this service" in such a way that you can perfrom your specific test. If you want to test another variant you need to adjust the code, save it and refresh the page.

... I hope that was clear...

Elfangor93 commented 2 years ago

Possible JPG images to test auto_orient: https://github.com/recurser/exif-orientation-examples

szepty-ziemi commented 2 years ago

PHP Built On Linux s47.smarthost.pl 4.18.0-348.12.2.lve.el8.x86_64 #1 SMP Mon Jan 24 07:29:58 EST 2022 x86_64 Database Type mysql Database Version 10.3.34-MariaDB PHP Version 8.0.17 Web Server Apache Joomla! Version Joomla! 4.1.2 Stable [ Kuamini ] 30-March-2022 16:00 GMT User Agent Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:99.0) Gecko/20100101 Firefox/99.0

Different images of type:

✓ jpg ✓ png with transparency (transparency is keept) ✓ png without transparency ✓ gif with transparency (transparency is keept) ✓ gif without transparency and no animation ✓ gif with animation (animation is removed) ✓ jpg with metadata obraz ✓ jpg with metadata exif orientation Examples to download: https://github.com/recurser/exif-orientation-examples obraz

Different processing methods

✓ resize() ✓ rotate() ✓ flip() ✓ orient() ✓ watermark()

Different image processors ✓ gd ✓ im

Elfangor93 commented 2 years ago

Bug report

Image used for the test: baby

Code used to test the PR:

$this->component->createIMGtools('im');
$img = $this->component->getIMGtools();
$img->set('keep_metadata', false);
$img->set('keep_anim', true);
$img->set('auto_orient', false);
$img->read('/images/baby.gif');
$img->watermark('/images/joomla_black.png', 9, 2, 25, 50);
$img->resize(3, 400, 400);
echo $img->stream(80);

Result: grafik

szepty-ziemi commented 2 years ago

Animated gif used: animated-gif

Result:

obraz

Code:

// Test IMGtools
$this->component->createIMGtools('im');
$img = $this->component->getIMGtools();
$img->set('keep_metadata', false);
$img->set('keep_anim', false);
$img->set('auto_orient', true);
$img->read('/images/animated-gif.gif');
$img->watermark('/images/joomla_black.png', 9, 2, 25, 50);
Elfangor93 commented 2 years ago

With the last commit I solved a problem by using ImageMagick as image processor. Watermarking images with multiple frames had problems in ImageMagick. Now everything should work also with ImageMagick.

@szepty-ziemi could you redo the tests with ImageMagick as image processor to be sure I did not break something worked before?

szepty-ziemi commented 2 years ago

PHP Built On Linux s47.smarthost.pl 4.18.0-348.12.2.lve.el8.x86_64 #1 SMP Mon Jan 24 07:29:58 EST 2022 x86_64 Database Version 10.3.34-MariaDB PHP Version 8.0.17 Web Server Apache WebServer to PHP Interface litespeed Joomla! Version Joomla! 4.1.2 Stable [ Kuamini ] 30-March-2022 16:00 GMT User Agent Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:99.0) Gecko/20100101 Firefox/99.0

Test for IM only.

@Elfangor93 Two issues ware discovered. Are reports here enough or you want to have separate ticket?

X gif with animation AND transparency (animation is removed, transparency is kept) ISSUE: No watermark obraz Test image: http://j4.siristru.smarthost.pl/images/gN4HK.gif

X gif with transparency (transparency is kept) ISSUE: artifacts are displayed in the background while it should be just transparent. obraz Test image: http://j4.siristru.smarthost.pl/images/GIF_transparency_demonstration_1.gif (Note: that image was originally PNG converted to GIF, but that shouldn't matter, right?)

Different images of type:

✓ jpg https://prnt.sc/ObWtVn1MgCn_ ✓ png with transparency (transparency is keept) https://prnt.sc/gfPO_46gdQB6 ✓ png without transparency https://prnt.sc/FnnSnmbGbpyh ✓ gif without transparency and no animation https://prnt.sc/wolkFm6WM-YS ✓ gif with animation (animation is removed) https://prnt.sc/bGd_R_5o5zvP ✓ jpg with metadata https://prnt.sc/sjPKR0rGaQ9P https://prnt.sc/p8kvSsH29DCN ✓ jpg with metadata exif orientation https://prnt.sc/66pSayks_DOh

Different processing methods

✓ resize() https://prnt.sc/b8Zwn9pTLscd ✓ rotate() https://prnt.sc/XGJ-yQgxhdcL ✓ flip() https://prnt.sc/b8ZHW6lde2l4 ✓ orient() false: https://prnt.sc/2nyXm2EjrLXY true: https://prnt.sc/fPPANR7-1YJd ✓ watermark() https://prnt.sc/nbYDaOUGCfUg

Elfangor93 commented 2 years ago

X gif with animation AND transparency (animation is removed, transparency is kept) ISSUE: No watermark grafik Test image: http://j4.siristru.smarthost.pl/images/gN4HK.gif

I can not verify this issue on my system. @szepty-ziemi can you please post the code in the /administrator/com_joomgallery/src/View/Faulties/HtmlView.php file you used for this test?

Additionally I see in the Debug information that the image was watermarked before resizing. This should be the other way around. Please make sure you are using the latest code-version of this PR including the last commit: 0404136

Elfangor93 commented 2 years ago

X gif with transparency (transparency is kept) ISSUE: artifacts are displayed in the background while it should be just transparent. grafik Test image: http://j4.siristru.smarthost.pl/images/GIF_transparency_demonstration_1.gif

Same here. I can not verify this issue on my system. @szepty-ziemi Please post your code used for this test and make sure you are using the latest code-version of this PR including the last commit: 0404136

Elfangor93 commented 2 years ago

@szepty-ziemi which version of ImageMagick are you using for testing?

szepty-ziemi commented 2 years ago

@Elfangor93 my IM version: https://prnt.sc/lk5p5qNYIDVg

Okay, I made sure that I use latest version with your commit. I did a retest and issue with lack of watermark is gone:

obraz

But the issue with artifact in background do persist.

My code:

// Test IMGtools
$this->component->createIMGtools('im');
$img = $this->component->getIMGtools();
$img->set('keep_metadata', false);
$img->set('keep_anim', false);
$img->set('auto_orient', true);
$img->read('/images/gN4HK.gif');
$img->watermark('/images/joomla_black.png', 5, 8, 60, 100);
$img->resize(3, 500, 500);

// Output image
echo $img->stream(80);
$this->component->printDebug();

// Output image metadata
echo '<br /><br /><h3>Image metadata:</h3>';
dump($img->get('metadata'));
Elfangor93 commented 2 years ago

This is the output I get when applying the same code as you did: grafik

My ImageMagick version is 7.0.10-16 Q16 x64 2020-05-31

Elfangor93 commented 2 years ago

@szepty-ziemi with the latest commit (9dfb5c9) the bug with artifacts should be gone. Plaese try again with your old ImageMagick version.

szepty-ziemi commented 2 years ago

@Elfangor93 issue still persist.

obraz

Elfangor93 commented 2 years ago

Then I dont know anything more to do. I am afraid but I think this is an issue in the ImageMagick version you are using...

szepty-ziemi commented 2 years ago

Lets just mark it as "Known issue". It may be indeed an issue related with particular version.

Elfangor93 commented 2 years ago

Lets just mark it as "Known issue". It may be indeed an issue related with particular version.

Agreed!

szepty-ziemi commented 2 years ago

ENV: https://prnt.sc/8qC2doP6pmBr

I have an error:

obraz

Code:

obraz

Image file is located correctly:

obraz

@Elfangor93 could you advise?

Elfangor93 commented 2 years ago

@szepty-ziemi With commit 5a9abf6 I added a check in order to see if the image format is supported by the used image processor. I have seen now that GD is listening only support for "JPEG" files but not "JPG" files even the file types are the same...

It should be now again possible to process jpg files with GD image processor. Thanks for reporting this bug!

szepty-ziemi commented 2 years ago

Issues

Two issues with IM library:

x gif with transparency (transparency is keept) - no watermark is added x flip() - image under watermark with transparency is unfliped

GD:

✓ jpg ✓ png with transparency (transparency is keept) ✓ png without transparency ✓ gif with transparency (transparency is keept) ✓ gif without transparency and no animation ✓ gif with animation (animation is removed) ✓ jpg with metadata ✓ jpg with metadata exif orientation

✓ resize() ✓ rotate() ✓ flip() ✓ orient() ✓ watermark()

IM:

✓ jpg ✓ png with transparency (transparency is keept) ✓ png without transparency x gif with transparency (transparency is keept) - no watermark is added obraz ✓ gif without transparency and no animation ✓ gif with animation (animation is removed) ✓ jpg with metadata ✓ jpg with metadata exif orientation

✓ resize() ✓ rotate() x flip() - image under watermark with transparency is unfliped obraz

Compare to GD: obraz

✓ orient() ✓ watermark()

System information: obraz

Elfangor93 commented 2 years ago

gif with transparency (transparency is keept) - no watermark is added

@szepty-ziemi I can not confirm this issue. It works very well on my system. But the Debug output on your screenshot shows me that you probably are not using the most current version of the JoomGallery code or that you dont have turned on the "Debug System" in the Joomla global config. Please check that you are using the most current code files. And turn on the "Debug System" conig that I can see the shell command created to perform the image manipulation.

My Debug output grafik

My system

Elfangor93 commented 2 years ago

flip() - image under watermark with transparency is unfliped

@szepty-ziemi Problem should be fixed. I hope deleting this coalesce command will not create issues with IM somewhere else. At least for now all my tests are still good without this coalesce command.

szepty-ziemi commented 2 years ago

I can not confirm this issue. It works very well on my system. But the Debug output on your screenshot shows me that you probably are not using the most current version of the JoomGallery code or that you dont have turned on the "Debug System" in the Joomla global config. Please check that you are using the most current code files. And turn on the "Debug System" conig that I can see the shell command created to perform the image manipulation.

@Elfangor93 Issue do not persist with most recent code:

obraz

szepty-ziemi commented 2 years ago

@Elfangor93 Problem should be fixed. I hope deleting this coalesce command will not create issues with IM somewhere else. At least for now all my tests are still good without this coalesce command.

I confirm, issue is fixed:

obraz

I did regression testing for IM:

✓ jpg ✓ png with transparency (transparency is keept) ✓ png without transparency ✓ gif with transparency (transparency is keept) ✓ gif without transparency and no animation ✓ gif with animation (animation is removed) ✓ jpg with metadata ✓ jpg with metadata exif orientation

✓ resize() ✓ rotate() ✓ flip() ✓ orient() ✓ watermark()

All GOOD! We may proceed further :)