Image attachments in grails using ImageMagick

I’ll admit it, I used ImageMagick for my image manipulation instead of Java and I’ll show you how I did it.

I tried using the image tools plugin. It’s terrific. It is easy to install and simple to use. I couldn’t ask for anything more. The only problem is that the default interpolation algorithm (nearest neighbor) doesn’t create the greatest images when scaling. This is a JAI problem. So I did some trial and error and found that bicubic interpolation is much better; not great, but better. It was slow. This is a JAI problem. It got even slower when I tried a multi pass approach to scaling the image. It was just too slow for the image quality that it was producing. It seemed I had a problem with JAI.

On a past RoR project I used a plugin that facilitated file uploads on models. It had a built-in thumbnailing feature that used ImageMagick for image processing. I had a decent experience with it, so I decided to give it a shot.

Pros: It is noticeably faster , the image quality is superb, and it supports modifying and saving gifs straight up. You can even scale a jpeg and save it as a gif if you so desired. Note that I wasn’t using mediaLib which speeds up processing, though quality is actually the biggest sticking point.

Con: I’m interfacing ImageMagick using Groovy’s String.execute() method (a wrapper for ProcessBuilder). Not that this is an ImageMagick problem, as there is a JMagick library that uses JNI to interop. However, judging from some reports on the intartubes, there haven’t been too many success stories.

If your still interested here’s how it went down:

1. Installed ImageMagick

Downloaded and installed ImageMagick

2. Installed Hibernate Events Plugin

  1. grails install-plugin http://thegioraproject.com/files/grails/plugins/grails-hibernate-events-0.2.zip

3. Created a generic Attachment Domain class

  1. import grails.util.GrailsUtil
  2. import org.springframework.web.multipart.MultipartFile
  3. import org.codehaus.groovy.grails.commons.ConfigurationHolder
  4.  
  5. class Attachment {
  6.     //Allows us to have spring bind the file automatically. <input name="attachment.file" type="file" />
  7.     MultipartFile file
  8.     //Save file metadata to the database
  9.     String contentType
  10.     String fileName
  11.     Long size    
  12.  
  13.     //Don’t try to save the MultipartFile.  Hibernate will barf all over you.
  14.     static transients = ["file"]
  15.  
  16.     //Location for saving files i.e. /home/me/app_files/attachments/
  17.     def baseDir = { ConfigurationHolder.config.paperclip.files.dir[GrailsUtil.environment] }
  18.  
  19.     //Use Hibernate Events Plugin to save the file after it’s metadata has been saved.
  20.     def afterInsert = {
  21.         writeFile()
  22.     }
  23.  
  24.     //Create a unique directory to store the file based on the saved id. Produces a two deep
  25.     //directory to stave off the 32000 hard link limit on ext3 filesystem.  So the path might look
  26.     //like 0000/0001/filename.extension
  27.     //see: http://thegioraproject.com/2008/03/02/workaround-for-subdirectory-limit-on-ext3-filesystem/
  28.     def directory = {
  29.         def stringId = id.toString()
  30.         def fullId = stringId.padLeft(8, "0")
  31.         [fullId[0..3], fullId[4..7]].join("/")
  32.     }
  33.  
  34.     //Joins the directory and filename to create a path.  Useful for creating links on views: can call
  35.     //attachment.path() to produce href.
  36.     def path = {
  37.         [directory(), fileName].join("/")
  38.     }
  39.  
  40.     //Location on disk to write the file to.
  41.     def absolutePath = {
  42.         [baseDir(), path()].join("/")
  43.     }
  44.  
  45.     //Writes the file to the disk making sure all parent directories are present
  46.     protected void writeFile() {
  47.         def destination = new File(absolutePath())
  48.         destination.mkdirs()
  49.         file.transferTo(destination)
  50.     }
  51.  
  52.     //When Spring binds the file to the object we set the metadata for the file on the object.
  53.     //Eliminates some setter code.
  54.     public void setFile(MultipartFile upload) {
  55.         file = upload
  56.         contentType = upload.contentType
  57.         fileName = upload.originalFilename
  58.         size = upload.size
  59.     }
  60. }

4. Created an Image Domain class

  1. import grails.util.GrailsUtil
  2. import org.codehaus.groovy.grails.commons.ConfigurationHolder
  3.  
  4. class Image extends Attachment {
  5.     //Root directory of the ImageMagick install determined by the environment.  So if we’re using
  6.     //development it will get the config variable paperclip.magick.dir.development from Config.groovy
  7.     def magickDir = { ConfigurationHolder.config.paperclip.magick.dir[GrailsUtil.environment] }    
  8.  
  9.     //After saving make sure we save the original by calling writeFile() on Attachment,
  10.     //then create the thumbnails
  11.     def afterInsert = {
  12.         writeFile()
  13.         createThumbnails()
  14.     }
  15.  
  16.     //Location on disk to write the thumbnail to
  17.     def absoluteThumbnail = {type ->
  18.         [baseDir(), thumbnail(type)].join("/")
  19.     }
  20.  
  21.     //Kind of like path on Attachment.  Allows us to call attachment.thumbnail("300") on the view to
  22.     //produce an img src.
  23.     def thumbnail = {type ->
  24.         def tokens = fileName.tokenize(".")
  25.         def name = [tokens[0..-2].join("."), type, tokens[-1]].join(".")
  26.         [directory(), name].join("/")
  27.     }
  28.  
  29.     //The meat of it all.  It gets a little lost because there isn’t a lot of code.  So we loop over
  30.     //an array to produce two thumbnails.  One will be 100×100, the other will be 300×300.  However
  31.     //ImageMagick will keep the images aspect ratio using the geometry we supplied.  This method will
  32.     //create a string like "/ImageMagick/convert /path/image.jpg -thumbnail 100×100 /path/image.100.jpg"
  33.     //and then execute it as if you were on the command line.  The ImageMagick command will resize and
  34.     //save the image to the supplied dir.  The execute() call returns a process object which we call
  35.     //waitFor on to make sure the processing finishes before we move on.  We can also get the exit code
  36.     //from the process to handle exceptions.
  37.     //More info ongeometry flags and resizing here: http://www.imagemagick.org/Usage/resize/#resize.
  38.     //It is very flexible.
  39.     protected void createThumbnails() {
  40.         [300, 100].each {
  41.             def process = "${magickDir()}/convert ${absolutePath()} -thumbnail ${it}x${it} ${absoluteThumbnail(it)}".execute()
  42.             process.waitFor()
  43.         }
  44.     }
  45. }

Hopefully the comments explain how everything works together. If you have questions, comments or criticism, please let me know. And yes, I feel a little dirty calling another program in a process, but when it works this well, getting a little dirty feels pretty good.

Image comparison (my youngest, Ariana):

ImageMagick
ImageMagick 100px Thumb

ImageTool (JAI)
ImageTool(JAI) 100px Thumb

ImageMagick
arianamagick300.JPG

ImageTool (JAI)
arianaimagetool300.jpg

6 Responses to “Image attachments in grails using ImageMagick”

  1. dahernan Says:

    Nice!!!. Good article.

  2. Kevin Burke Says:

    Thanks David, I’m glad you liked it.

  3. Andres Almiray Says:

    Very good Kevin, you can definitely add more spice to your images using ImageMagick itself or Gimp’s server-fu, but there is also a Groovy alternative: GraphicsBuilder ;-)

    Keep it up!

  4. Kevin Burke Says:

    Thanks for the tip Andres. I’ll have to check that out when I get some time. How do the speed and quality compare to that of ImageMagic or Gimp or JAI for scaling transformations?

  5. Andres Almiray Says:

    That is a good question, as speed is very important on servers. I have no numbers on those operations to be honest but I can surely run some benchmarks, after all GraphicsBuilder provides an abstraction layer over Java2D.

  6. Kevin Burke Says:

    I’d certainly be interested if you do some benchmarks, but don’t go out of your way :). If I come up with anything on this front I’ll let you know.

Leave a Reply