Share » Forums » Setup & design » Image filters and rounded corners

Image filters and rounded corners

Image filters and rounded corners

Monday 29 May 2006 2:04:14 am - 17 replies

Author Message

paul bolger

Thursday 08 February 2007 7:28:47 pm

Hi Børge

I'm interested in this topic too, did you make any progress outside the forum?

regards
Paul Bolger

Paul Bolger

Bruce Morrison

Friday 09 February 2007 12:25:10 am

Hi Børge

According to http://www.imagemagick.org/Usage/thumbnails/#soft_edges you should be able to pass the appropriate parameters to convert to do what you require. I suspect that your success will depend on the version of ImageMagick you have installed on your system.

Adding the following to image.ini may do the trick

[ImageMagick]
Filters[]=roundedborder=-matte -virtual-pixel transparent -channel A -blur 0x8 

[small]
Filters[]=geometry/scaledownonly=100;100
Filters[]=roundedborder=

I've not tested this as I don't have a sserver with a version of convert that suports the required flags.

HTH

Cheers
Bruce

My Blog: http://www.stuffandcontent.com/
Follow me on twitter: http://twitter.com/brucemorrison
Consolidated eZ Publish Feed : http://friendfeed.com/rooms/ez-publish

Daniele Nocentini

Friday 09 February 2007 2:48:51 am

and the template code?

Antica Bottega Digitale srl
http://www.abd.it

Børge Warvik

Friday 09 February 2007 3:05:10 am

There would be no special template code for this. Just make sure you name the correct alias.

Daniele Nocentini

Friday 09 February 2007 3:15:10 am

OK but in which template operator can I use this?

Antica Bottega Digitale srl
http://www.abd.it

Børge Warvik

Friday 09 February 2007 3:21:59 am

Wherever a node is available, by default or by fetch.

{attribute_view_gui image_class=small attribute=$node.data_map.image_attribute.content.data_map.image}

Just change the image_class and image_attribute to fit your needs.

Xavier Dutoit

Friday 09 February 2007 4:27:25 am

Have you explored the javascript+css option ?

You can do quite a few nice things without having to alter the image...

X+

http://www.sydesy.com

paul bolger

Monday 12 February 2007 5:32:44 pm

Thanks for your responses - it sounds like the most flexible solution to this problem would be to use the draw command, which was detailed next on the page Bruce cited

http://www.imagemagick.org/Usage/thumbnails/#rounded_border.

but it's pretty complicated.

I think for my purposes (the resulting image has to be of a set size) I could use the composite command to overlay a mask on the image (after resizing and cropping it).

Does anyone know the syntax for getting a second image, the mask, in the Ezpublish filters section?

Paul Bolger

Paul Bolger

Bruce Morrison

Monday 12 February 2007 11:40:07 pm

Hi Paul

I don't think you'll be able to do composite commands (by composite do you mean multiple?) with the image filter system.

You can apply multiple filters to an image but these are all run as parameters to the one convert call.

Looking at the default image.ini file it seems possible to define your own ImageConverter, create a shell script to do the multi-stage conversion and set this as the excetuable.

Your image.ini would look something like:

[ImageConverterSettings]
ImageConverters[]=myconverter

[myconverter]
Name=MyConverter
IsEnabled=true
Handler=ezimageshell
ExecutablePath=/path/to/myconverter/
Executable=myconverter.sh

Filters[]=roundedcorners=

[small]
Reference=reference
Filters[]=roundedcorners

/path/to/myconverter/myconverter.sh would do the conversion. I think it would get passed input & output files.

This is the code that would run it http://pubsvn.ez.no/doxygen/ezimageshellhandler_8php-source.html#l00066

Of course this is all untested :)

Cheers
Bruce

My Blog: http://www.stuffandcontent.com/
Follow me on twitter: http://twitter.com/brucemorrison
Consolidated eZ Publish Feed : http://friendfeed.com/rooms/ez-publish

paul bolger

Wednesday 14 February 2007 5:08:24 pm

Hi Bruce

By 'composite' I was meaning using the composite command:

http://www.imagemagick.org/script/command-line-options.php#composite

which allows you to pull in a second image and overlay it onto the current image.
I'm not sure if it would work, but the first problem in trying it is that I'm not sure what the current directory is - if image.ini told Imagemagick to go look for a second image to overlay, where would Imagemagick look?

I'll give your suggestion a try, but I'm unclear of the current location in this context - ExecutablePath=/path/to/myconverter/ - were is '/' ?

BTW: and this is more for the benefit of the thread than anything else: This page

http://ez.no/download/ez_publish/changelogs/ez_publish_3_3/new_image_system

has some good information on image filters in image.ini which doesn't seem to appear anywhere else.

It probably should be added to the documentation - how does one go about requesting this?

regards
Paul Bolger

Paul Bolger

Bruce Morrison

Wednesday 14 February 2007 11:15:37 pm

Hi Paul

No need to use my advice to use the compposite flag. I was thinking you were looking at running convert multiple times.

You should be fine to setup an image filter using the convert flag with a designated file as a parameter as long as the file was fully qualifed. By fully qualified I mean something like /path/to/my/file.png where the initial / is the root of the file system (not the web site document root)

HTH

Cheers
Bruce

My Blog: http://www.stuffandcontent.com/
Follow me on twitter: http://twitter.com/brucemorrison
Consolidated eZ Publish Feed : http://friendfeed.com/rooms/ez-publish

paul bolger

Thursday 15 February 2007 7:41:11 pm

Ok, this is driving me crazy...

I have an entry in [ImageMagick]
Filters[]=rounded=-composite %1

I have an entry in [AliasSettings]
AliasList[]=bighighlights

and I have an alias

[bighighlights]
Filters[]=geometry/scalewidth=156
Filters[]=geometry/crop=156;90;0;0
Filters[]=rounded=/var/www/html/...the rest of the path.../design/news_site/images/picmask.png

..and I have the mask image in the correct directory - !

Can anyone spot the problem?

Thanks

Paul Bolger

Bruce Morrison

Thursday 15 February 2007 9:36:06 pm

Hi Paul

Always good to provide something to go on when requesting help:
What is/isn't happening?
Are the images being displayed at all?
When you turn on debugging is there any output related to ImageMagick/convert ?
Is the picmask.png file readable by the webserver user?

From http://www.imagemagick.org/script/command-line-options.php#composite it looks like the <i>composite</i> flag requires addition flags to work

Something like

Filters[]=rounded=%1 -compose DstIn -composite

Cheers
Bruce

My Blog: http://www.stuffandcontent.com/
Follow me on twitter: http://twitter.com/brucemorrison
Consolidated eZ Publish Feed : http://friendfeed.com/rooms/ez-publish

paul bolger

Saturday 17 February 2007 6:26:41 am

Hi Bruce

Was in the middle of writing a more complete description of what was, and was not, happening yesterday when the power failed, I lost the lot, and we all ended up going home. Anyhow, tried your last suggestion on a local installation and, after the obligatory three hours of messing around, got it to work. The filter setting I ended up using was

Filters[]=roundedborder=-compose dst-over -composite -gravity NorthWest C:\eZpublish\ezpublish\design\plain_site\images\rightsize.png

Thanks for your help and patience. I have a couple of details to sort out, after which I'll tie the thread off with a howto.

regards
Paul Bolger

Paul Bolger

michele krammer

Sunday 18 February 2007 4:26:53 pm

it is rare to find any template that has good rounded corners, is fast loading and does not load the content box in sections
:)

michele

Bruce Morrison

Sunday 18 February 2007 5:15:33 pm

@paul
Yeeha! Glad to hear! Got a URL so we can see the results?

@michele
I think you are talking about something else. There are plenty of sites out there with designs that incorporate rounded corners. Some solutions are better than others.

Cheers
Bruce

My Blog: http://www.stuffandcontent.com/
Follow me on twitter: http://twitter.com/brucemorrison
Consolidated eZ Publish Feed : http://friendfeed.com/rooms/ez-publish

paul bolger

Tuesday 20 February 2007 9:04:34 pm

I've put a description of how we got this going using ImageMagick in

http://ez.no/community/forum/setup_design/rounded_corners_on_images

Paul Bolger

You must be logged in to post messages in this topic!

36 542 Users on board!

Forums menu