Quantcast
Channel: Planet Plone - Where Developers And Integrators Write
Viewing all articles
Browse latest Browse all 3535

Webmeisterei: Image cropping for everyone!

$
0
0

Image cropping in Plone is something that people are asking for quite a long time.
There are several add-ons such as Products.RichImage, Products.ImageEditor, CroppingImageField, archetypes.clippingimage or collective.croppingimagefield that either need their own field- or content type and don't work with dexterity.

Some history

There is  PLIP 10174 that dates back to February 2010 which is about adding cropping functionality to plone.app.imaging.
At the PloneConf in Bristol we defined a concept that allows automatic cropping and also pluggable transforms (gray-scale, sepia) (see slide 8 in this presentation) and got stuck in a rather difficult implementation that required several changes in plone.app.imaging and plone.app.blob.

Right before the PloneConf in Arnhem 2012 the topic popped up again as the frameworkteam rejected PLIP10174 so we discussed possible solutions in an open-space (and several of Arnhem's pubs).

We skipped pluggable transforms and concentrated on the possibility to manually define the cropping region with the JS editor JCrop.
We ended up with an approach very similar to a plone.app.imaging branch form a technical point of view. Main differences: no the need to patch/change plone.app.imaging and a different usability approach for the cropping view.

Introducing plone.app.imagecropping

At the post-conference sprints we started the implementation and now have the basic functionality working:

  • a view that allows to define and remove cropping regions for each available image scale using the JCrop editor (see screenshot below)
  • support for old-style image urls (eg. plone/image/image_large)
  • support for new-style plone.scale urls (used by tiny outputfilters eg. plone/image/@@images/519135a0-8a68-4c0f-bba1-651430445718.png)
  • unit tests
  • i18n infrastructure including translations for German and Dutch

plone.app.imagecropping editor screen

More information about can be found in the plone.app.imagecropping README.

For the final release we'll improve usability and add dexterity support and TinyMCE integration.

Try it out and spread the word!

Add plone.app.imagecropping alpha 1 to your buildout or check it out on gitbub and tell us what you think about it:


If you find plone.app.imagecropping useful spread the word and blog / twitter about it!
Let's get this package done and plipped into core so everybody can crop images in the next Plone release!


Viewing all articles
Browse latest Browse all 3535

Trending Articles