Pickr: colour palettes from photography | Comments (7)

Posted in Code on 7th November 2005, 2:10 am by Stuart

Pickr is a small demonstration of javascript’s ability to leverage server-side libraries using XMLHttpRequest. In this case the client-side script is making use of the GD library on the server side. The co-ordinates of the on-click are generated by working out the offset of the image in relation to the viewport. These co-ordinates are then sent to a PHP script (via XMLHttpRequest) which returns the RGB value of the pixel using the GD graphics library. Subsequently the “holder’s” background color is changed to match the value of that pixel.

If javascript is turned off on the browser the script degrades to using PHP sessions and GET requests to replicate the client side functionality. The image is a form input in order to retrieve the X and Y co-ordinates of the image where it was clicked and these are passed to GD to work out the colour information for that pixel

Althought this is purely a demonstration there are a few possible applications for this script. One would be to extend the script to allow users to upload photos to create palettes of colours from the photography. Also one idea I had (which is the reason for the script’s name!) would allow the user to retrieve pictures from their flickr account to create colour schemes. If nothing else, it shows that it should be possible to access anything that the GD library can do from the client side.

Check out the Pickr Demo here

Post Tools

• Permalink
• Comments
• Feed
• Digg it!
• Tag it!
• Cosmos