Pickr: colour palettes from photography | Comments (6)
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.
Still looking good Stu - great choice of photo, although the Monkey noise one would have been funnier…
I still think the reset button needs work.
And where’s the link to the files? >makes a note - “does not share toys”
Will sort out a download of the files some point in due course ; )
This is an awesome concept - one suggestion I’d love to see is a method to display either a list of the codes selected or next to each icon as they are selected - some way to quickly grab the codes for a photoshop swatch.
@Timothy: Yes great idea, I will add your suggestion in the next iteration at the same time as providing the source for download.
Hi would love to see how this works did you ever release the source?
Ditto. I was just looking for the source myself.