timmy icon indicating copy to clipboard operation
timmy copied to clipboard

Support for Letterboxing

Open lmartins opened this issue 9 years ago • 9 comments

Any plans to support the letterboxing cropping mode: https://github.com/jarednova/timber/wiki/Image-cookbook#letterboxing-images

lmartins avatar Mar 08 '16 16:03 lmartins

Yeah, sure, that could be implemented.

What do you think, would it make sense to use letterbox like this in the image configuration?

'custom-4-crop' => array(
    // output should be 370, 370
    'resize' => array( 370, 370 ),
    // use letterbox with color #bada55
    'letterbox' => '#bada55',
)

When I’d use a parameter letterbox, it would take the resize parameters to letterbox the image.

In addition to that, I also thought about using the tojpg filter.

'custom-4-crop' => array(
    'resize' => array( 240 ),
    // convert to jpg with background #c0ffee when image is not a jpg
    'tojpg' => '#c0ffee',
)

When I’d use a parameter tojpg, it would convert PNGs to JPGs and use the assigned color to fill transparent space in the image (This is not possible with the normal Timber filter, but it’s possible if we directly go through a TimberImageHelper function).

Of course you could also use both. In that case it would first convert the image to JPG and then letterbox it.

Would it also make sense to use it with a twig filter? Like this:

<img {{post.thumbnail|to_jpg|get_timber_image_responsive('header')}}>

What do you think? I’ve never used any of the two filters before, so your opinion about how you could work with that would be nice ;).

gchtr avatar Mar 08 '16 22:03 gchtr

Sorry for not answering this before. We have a few hours difference. Your suggestions seem spot on I think.

lmartins avatar Mar 09 '16 08:03 lmartins

Since the issue has been closed, is this something planned for a future release?

lmartins avatar Mar 09 '16 09:03 lmartins

Huh? Why did I close that? Of course it’s not supposed to be closed!

Thanks for the feedback. I’ll implement this in the next days.

gchtr avatar Mar 09 '16 09:03 gchtr

@gchtr Thanks Lukas.

lmartins avatar Mar 09 '16 09:03 lmartins

@lmartins Hey Luis.

I added support for letterbox and tojpg filters in 08ac4f3cab9dd47ab9f8046d45cda70cef6f13b2. When you download the latest version, you should be good to go.

gchtr avatar Mar 13 '16 20:03 gchtr

@gchtr Hi Lukas,

I can confirm it is now working. I couldn't get letterbox to work as a filter, as in <img {{ post.thumbnail|letterbox('#fff')|get_timber_image_responsive('product-tile') }} itemprop="image"> but other than that it is working great. Thanks man.

lmartins avatar Mar 14 '16 11:03 lmartins

I didn’t implement the direct use of these filters in Twig yet. I’ll see what I can do.

gchtr avatar Mar 14 '16 11:03 gchtr

Ah ok. It is not essential in my use case, just a nice to have.

lmartins avatar Mar 14 '16 11:03 lmartins