jQuery(function($) {
	$.fn.coloredPixels = function() {
		props = {
			colors: [
				"#f7e700", "#fec700", "#faa100", "#f77b00", "#f55600", "#f22f00",
				"#d4d600", "#d5b900", "#d79800", "#d77500", "#d65200", "#d52b00",
				"#9fc30e", "#a6aa1d", "#ad8d36", "#af6e3a", "#b14d3c", "#b1233b",
				"#5fb02d", "#6f9a3e", "#7b824e", "#846655", "#8a4958", "#8d1f58",
				"#00a13a", "#008e4c", "#3e785f", "#565f68", "#61436f", "#6a1b70",
				"#00913b", "#008059", "#006d6b", "#005578", "#143b80", "#381d7d",
			]
		};
		
		function RGBToHex(value) {
		    var re = /\d+/g;
		    var matches = value.match(re);
		    for (var i=0; i<matches.length; i++) {
		        matches[i] = parseInt(matches[i]).toString(16);
		        if (matches[i].length < 2) matches[i] = '0'+matches[i];
		    }
			return "#" + matches[0] + matches[1] + matches[2];
		}
		
		var total = props.colors.length;
		var $current = $(this);
		
		for (i=0; i<total; i++) {
			var $box = $("<span style='background-color:"+props.colors[i]+"'></span>");
			$box.appendTo("#col_container");
			$box.mouseover(function() {
				var c = $(this).css("background-color");
				if (c.indexOf('rgb') != -1) {
					var color = RGBToHex(c);
				} else {
					color = c;
				}
				$current.css({'background-color': color});
			});
		}		
		var randomNumber = Math.floor(Math.random()*36);
		$current.css({'background-color': props.colors[randomNumber]});
		
		return this;
	};
});