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
View the blog original blog post here© Copyright Muffin Research Labs 2005