Custom image manipulation in Drupal in just a few lines of code with the ImageAPI module

This article relates to Drupal 5.x.

Dopry, maintainer of imagecache, has released imagecache 2.x beta and ImageAPI 5.1.

A little someting about imagecache

For those of you who don’t know imagecache: it’s a very cool module that generates resized and/or cropped versions of images you upload to your Drupal site. You define different “presets”, indicate what actions (resize, crop, desaturate, ...) need to be performed in what order, and all these image versions will be available alongside the original image you uploaded. In addition, it also does caching and some other intelligent stuff.

Basically, imagecache is what you need if you want to generate thumbnails (think user profiles and image galleries), and different size and/or quality versions (like flickr).

Way cool.

Now, with version 2.x, the actual image manipulation actions have been abstracted to a second module ImageAPI. ImageAPI supports multiple image manipulation libraries. GD is fully supported and imagemagick support is added, but still experimental.

The api allows you to perform any manipulation you want, when you want, how you want, without the need of installing the entire imagecache module.

Time for an example

Just to show you how easy this module is, I’ll show you a snippet I’m using in a project. In addition, this is a nice example of how easy it is to write your own image manipulating module by implementing hook_nodeapi.

Just stick this code in myfoo.module, provide a myfoo.info file and you’re all set.

The function will check if we’re dealing with a node of type ‘foo’ and make sure our code is only executed when the operation being performed on the node is ‘submit’ (so each time a node is inserted/updated + passed validation). A final check is made to make sure one or more files are have actually been attached already.

When we’re good to go, each image is opened, a manipulation is performed, and the image is saved. Note that, in this case, a copy of the original image is saved. At this time, overwriting the original image is not yet supported, but it’ll be added in a few days from now.

Behold:

<br></br>
/**
 * implementation of hook_nodeapi()
 */<br></br>
function myfoo_nodeapi(&$node, $op, $a3 = <span class="caps">NULL</span>, $a4 = <span class="caps">NULL</span>) {
  // check node type
  if ($node->type == “foo”){

    switch ($op) {

      // check operation being performed
      case ‘submit’:

        // check if the field in question is present 
        // and that it’s an array
        if (isset ($node->field_foo_image) 
          && is_array ($node->field_foo_image)){

          foreach ($node->field_foo_image as $img){
            if ($img[“filepath”] != “”){

              $image = imageapi_image_open ($img[“filepath”]);

              imageapi_image_scale_and_crop ($image, 80, 90); 

              imageapi_image_close ($image, $img[“filepath”]);			

            }
	  }
        }
        break;
    }
  }
}

Some code improvements could be added and some additional logic should be added to check if an image has already been resized, but that’s beside the point. This is just an example to demonstrate how easy custom image manipulation in Drupal is, now that imageapi is out there.

Thanks dopry!

note: this example was added in the contrib modules section of the drupal handbook: http://drupal.org/node/237750