Image processing with the atkFileAttribute

ATK Howto: Image processing with the atkFileAttribute Complexity: advanced Author: Ivo Jansch <ivo@achievo.org>

List of other Howto's

Intro

The atkFileAttribute can be used to upload images and other files into an ATK application. Sometimes however you will want to process files before they are uploaded.

In this howto we create a custom atkFileAttribute to handle this. As an example, we will do three things. First, we will make a thumbnail version of the uploaded image, and second, we make this thumbnail look Sepia, and finally, we want to add a small border around the generated thumbnail.

Requirements

All you need is to set up a node that contains at least an atkFileAttribute. Make sure you have a working sample before you start with this howto.

Your atkFileAttribute code may look something like the following:

  $this->add(new atkFileAttribute("picture", atkconfig("atkroot")."pictures/"))

This example uses a field called 'picture' in the database to hold the file name, and the image itself will be uploaded to the pictures/ subdirectory of our application.

Creating a custom attribute

First, we create a custom attribute that derives from atkFileAttribute. If you need this attribute only once, you can place the code directly in the class.<yournode>.inc file of the node you want to use it in, but, assuming you want to reuse this attribute later, we store it as a separate attribute:

<bash>

 [ivo@nikita workspace]$ cd <yourapplication>/modules/<yourmodule>

</bash>

You can in fact use any module you have; if you have a lot of custom attributes, you might want to consider creating an 'attriblib' module (as in 'library of attributes') or something along those lines to hold all the attributes that you create. For the rest of this howto, I'll assume that your application is called 'app' and your module is called 'attriblib'

After you decided what module to place the attribute in, create a subdirectory 'attributes':

<bash>

 [ivo@nikita yourmodule]$ mkdir attributes/

</bash>

Now it's time to decide a name for the new attribute. For our sepia example, let's call it the 'sepiaAttribute'. Create a file called 'class.sepiaattribute.inc' in the attributes/ subdirectory with the following contents:

  <?php
    // Include the base class
    useattrib("atkfileattribute");
  
    class sepiaAttribute extends atkFileAttribute
    {
    }
  ?>

You now have a custom attribute which behaves identical to the atkFileAttribute, since we have not added any processing yet. But we can already add this attribute to our node.

Adding the attribute to the node

Open your node class, and add the following useattrib call:

  useattrib("attriblib.sepiaattribute");

As you can see, you can use the modulename and the name of the attribute in the useattrib call. ATK will derive the actual location of the file from this identifier.

In your node, replace the atkFileAttribute with the sepiaAttribute like this:

  $this->add(new sepiaAttribute("picture", atkconfig("atkroot")."pictures/"))

When you now browse your application, everything should appear unchanged. You've added a custom attribute, but it doesn't do anything custom yet, so it acts just like a regular atkFileAttribute.

Adding image processing

The atkFileAttribute contains a method called 'processFile'. By default this method does not do anything, but it can be implemented in custom attributes to do the processing.

To make the image Sepia, I googled a bit and found a useful 'class.image.php' on http://php.amnuts.com/index.php?do=view