Community Documentation

Eye-drop Field - a CCK field for editable images.

Last updated August 16, 2007. Created by sime on February 16, 2007.
Edited by add1sun. Log in to edit this page.

Eye-drop Field is a CCK field that will ship with the first version of Eye-drop Editor (EE). This module is a functional example of integration with EE, and it was written due to the need for a practical solution in a new website.

Download

Goal

This module was written specifically for the following requirements:

  • The client runs a fancy dress shop, her products are often parts of other things. She uses images from her customers - say a customer has a party and sends a picture of 4 people (ie. four costumes). She wants to upload the image once and use parts of the image for different products.
  • The site theming requires consistency in image size. Some have a specific height and width (thumbnails). Some just need to be a certain width.
  • Images need to be applied to multiple products.
  • There is no time or resources for separate image editing software.

Solution

Image Image module is used for the image management. We'll be able to manage media in an independent and proven way. Also, the image module will manage the "variations" or "derivatives" like thumbnail, preview and whatever.
Image Attach Image Attach (which ships with Image) gives us the ability to attach one image to each node. We can change the image, and we can assign each image to multiple nodes. Once again, a tried an tested solution to minimize risk.
Eye-drop Field Eye-drop Field (ships with Eye-drop) is a CCK field. It allows us to associate an defined Image module derivative (eg "thumbnail" or "preview") to a field. The Image module derivative provides the height and width information for the destination image. The Eye-drop Field itself stores the information about how to crop the original.
Content (CCK) Obviously a requirement for a CCK field. The reason we are using CCK field is that each

Image Configuration

  • Go to Administer » Site configuration » Image and configure the image sizes that you want to have in the site. For example, make 'thumbnail' 100 x 100 and 'preview' 500 x BLANK.
  • Go to Administer » Site configuration » Image and allow images to attached to multiple nodes (not actually compulsory, just keeping in line with the goal).

New Content Type

  • Go to Administer » Content management » Add content type and create a new content type, say, called "Costume".
  • Click on your new content type and click Add field. Use a label that is the same as the image derivative name (eg. "thumbnail") and select "Image Selection" as the field type.
  • Next you edit the field itself, and there is only one setting you need to worry about - Link this field to which derivative size configured through the Image module? Here we select the "thumbnail", which effective links the label "thumbnail" and the target width and height (100x100) that we have assigned to the thumbnail derivative in the Image module settings.

Making it work

OK, some of this stuff is a bit hacky.

  • Whatever your normal files directory is, create a directory inside called eyedrop_field
  • Other stuff, yada yada yada. Yes, still very much in development.

About this page

Drupal version
Drupal 5.x

Site Building Guide

Drupal’s online documentation is © 2000-2012 by the individual contributors and can be used in accordance with the Creative Commons License, Attribution-ShareAlike 2.0. PHP code is distributed under the GNU General Public License.