Current Setup
Each product on the store has multiple images. When the visitor visits a product page they see a main image and a series of thumbnails (view). When they click on a thumbnail that image is instantly displayed in the main image area.
Each product also has an attribute selection dropdown for example “Colour”.
Drupal / Ubercart Configuration
I’m using Drupal 6. There is a Product content-type that has a custom image field of type file. This image field accepts multiple values (i.e. multiple images).
I then use a view (views module) to display a series of thumbnails and javascript to change the main image when a thumbnail is clicked.
What I’m trying to achieve
What I would like in addition to the thumbnails is when the visitor selects a colour option from the colour attribute dropdown is for one of the available images be displayed (basically the one that matches the colour selection).
What I’ve looked at
I am aware of Ubercart Option Image but this forces you to upload a new image for each attribute and is not per product. For example the attribute colour is used for multiple different products that all share the same colours.
With option image module all products that share the same attribute would display the same image. So this is a no go.
Also I don’t wan’t to upload a new image I want to be able to use one of the existing images from the product node.
This should possible but in a somewhat roundabout way. Perhaps the following method will be worth the pain?
Create a new content type. Call it ImagefieldAttribute. Let that content type store an unlimited number of imagefields. Also associate the ImagefieldAttribute content type with a taxonomy vocabulary called attribute. Essentially the ImagefieldAttribute content type will store all product images having the same attribute
Now create a node reference field in the Product content type. The nodereference field will only link to the ImagefieldAttribute content type. (edit: make sure that nodereference field can have unlimited number of nodereferences. This is so that you can refer to an arbitrary number of ImageFieldAttribute content types — each of them containing all images with a specific attribute)
You will need to change the view and thumbnails to reflect an additional level of indirection in the Product content type. If you’re experienced in views you’ll just recognize this as a case of creating a views relationship.
You should also be able to create exposed filters. Please note that again you will need to use relationships as the filters would be in the ImagefieldAttribute content type (which you will get through using the nodereference relationship). You can restrict the attributes which will be on display (e.g. If there is no yellow color amongst any of the items) you should not get yellow in the drop down. This you can achieve by using the http://drupal.org/project/views_taxonomy_selective_filter module.
It can be tedious to have to create an ImagefieldAttribute everytime and then nodereference it to your Product. This can be made easy using http://drupal.org/project/popups_reference
Obviously I haven’t tried this out so you could encounter unforeseen problems along the way. It might also be a good idea to not have a taxonomy vocabulary for attributes but simply CCK select list. However, the views taxonomy selective filter will not work subsequently.