Watermark not working

[bymayo]

I'm submitting a...

• [x] bug report
• [ ] feature request
• [ ] general question

Description

I'm trying to use the watermark feature, and it doesn't seem to be rendering anything no matter which way I try to implement this. Ideally i want to do this in the imager-x-transforms.php file like this:

'awardSilver' => [
        'transforms' => [
            ['width' => 400],
            ['width' => 800],
            ['width' => 1200],
            ['width' => 1600],
            ['width' => 1800]
        ],
        'defaults' => [
            'watermark' => [ 
                'image' => '@webroot/dist/images/watermark-award-silver.png', 
                'width' => 80, 
                'height' => 80, 
                'position' => [ 
                    'bottom' => 30, 
                    'right' => 30 
                ], 
                'opacity' => 1
            ]
        ]
    ],

I've also tried using an Asset model by using:

'image' => Craft::$app->getAssets()->getAssetById(353),

And i've also tried this inside the template using Twig, by setting this similar to how it says in the docs.

But still no luck!

I can see the transform is rendering fine, because if I change the width params, it recreates a new file. But does nothing with the watermark.

Displayed errors, stack trace, relevant logs

n/a, I can't see any errors appearing in the logs

Additional info

[aelvan]

Hi,

I think this is due to the fact that the servd transformer only supports a subset of the functionality that Imager itself supports. I'm not familiar with that transformer, Matt from servd made it, but from what I can tell looking at the source, it's very limited in scope, and there's no watermark functionality.

I would reach out to Matt and ask just to be sure though.

[bymayo]

@aelvan Okay, I'll reach out to Matt/Joe and see what they can do!

[bymayo]

@aelvan It seems theres 2 ways around this with using Servd:

1. We just bypass using Servd to transform the image and use it only as storage. But the downside here is that we don't get off server transforms. So it will impact the sites speed/CPU heavily.
2. We only apply watermarks to images if they are in a specific filesystem. But i'm unsure if Imager X allows to specify different configs, per filesystem, or even do this via the template?

Ideally if you could let me know about point 2, then I'll know where to go from there!

[aelvan]

Point 2 really depends on how you use the named transform currently. Is it used in an auto generate config, or only directly in templates?

In you templates you can always override both the transform, and your config settings, based on whatever data is available to you there. If all you need is to set a different transform depending on the asset volume, you could just do:

craft.imagerx.transformImage(image, image.volume.handle == 'myVolume' ? 'awardSilverWithWatermark' : 'awardSilverWithoutWatermark')

If you'd want to override the transformer you could do:

craft.imagerx.transformImage(image, awardSilver, {}, { transformer: image, image.volume.handle == 'myVolume' ? 'craft' : 'servd' })

If it's used in an auto generate config it might be harder. Most properties, like watermark, can take a function as value, where the image will be passed in as a variable, like:

        'transforms' => [
            'width' => 300,
            'format' => 'jpg',
            'watermark' => function($image) {
                return $image->volume->handle === 'myVolume' ?
                    [
                        ...
                    ] : [
                        ...
                    ];
            }
        ],

My initial thought was that it could be handled this way, but there isn't really a way of "unsetting" the watermark property currently. Ie, if I return an empty array or null from that function, Imager throws an error, because it expects a watermark definition.

This is maybe something that I could/should account for at some broader level in Imager, being able to "unset" a value in transforms may be useful, escpecially in cases like this. But I'll have to consider if there are any potential side-effects that could be introduced by doing that. It kinda feels like it could. In that case, maybe a more narrow solution is fine.

But, let me know if that's something that's even relevant to what you're trying to achieve.