//====================================================//
//               P e a c e H a c k e R                //
/* create desaturate image element by using class element
 * original code by http://www.ajaxblender.com and also 
 * applied by peacehacker.
 * ex. $(selector).peaceDesatureate();
 */ 
function grayscaleImageIE(imgObj){
        imgObj.style.filter = 'progid:DXImageTransform.Microsoft.BasicImage(grayScale=1)';
}
 
function grayscaleImage(imgObj){
        var canvas = document.createElement('canvas');
        var canvasContext = canvas.getContext('2d');
        
        var imgW = imgObj.width;
        var imgH = imgObj.height;
        canvas.width = imgW;
        canvas.height = imgH;
        
        canvasContext.drawImage(imgObj, 0, 0);
        var imgPixels = canvasContext.getImageData(0, 0, imgW, imgH);
        
        for(var y = 0; y < imgPixels.height; y++){
            for(var x = 0; x < imgPixels.width; x++){
                var i = (y * 4) * imgPixels.width + x * 4;
                var avg = (imgPixels.data[i] + imgPixels.data[i + 1] + imgPixels.data[i + 2]) / 3;
                imgPixels.data[i] = avg; 
                imgPixels.data[i + 1] = avg; 
                imgPixels.data[i + 2] = avg;
            }
        }
        
        canvasContext.putImageData(imgPixels, 0, 0, 0, 0, imgPixels.width, imgPixels.height);
        return canvas.toDataURL();
}
if (typeof jQuery != "undefined" && jQuery && jQuery.fn) {
	jQuery.fn.peaceDesaturate = function() {
		if($.browser.msie){
			this.each(function(){
				grayscaleImageIE(this)
			});
			return false;
		}
		this.each(function(){
			this.src = grayscaleImage(this);
		});
		return this;
	}
}