/*
 * jPalette  v0.1.1
 * http://palette.seanmccambridge.com/
 *
 * Copyright (c) 2009 Sean McCambridge
 *
 * Date: 2009-10-14 04:02:00 -0500 (Wed, 14 October 2009)
 * First beta version
 */

$(document).ready(function() {
	
	// Make colors
	
	var swatchCount = 0;
	var colorCount = 0;
	var valueR = 0;
	var valueG = 0;
	var valueB = 0;
	
	createColors('r');
	createColors('g');
	createColors('b');
	
	function d2h(d) {return d.toString(16);}
	function h2d(h) {return parseInt(h,16);}
	function reset0() {
		valueR = 0;
		valueG = 0;
		valueB = 0;
	}
	
	function createColors(val) {
		valueG = 0;
		valueB = 0;
		for ($i=0; $i<15; $i++) {
			if (valueR >= 255) valueR = 0;
			valueR = d2h(valueR);
			if (valueR == 0) valueR = '00';
			if (valueG == 0) valueG = '00';
			if (valueB == 0) valueB = '00';
			
			if (val == 'r') {
				var rgb = valueR + valueG + valueB;
			}
			if (val == 'g') {
				var rgb = valueB + valueR + valueG;	
			}
			if (val == 'b') {
				var rgb = valueG + valueB + valueR;	
			}
			//$('#palette').append(rgb + '<br />');
			if (rgb == '000000') {
				gray = d2h(Math.round(colorCount * 23.18));
				gray = gray+gray+gray;
				$('#palette').append('<div class="swatch" id="swatch' + swatchCount + '"></div>');
				$('#swatch' + swatchCount).css('background-color','#' + gray).attr('rel',gray);
			} else {
				$('#palette').append('<div class="swatch" id="swatch' + swatchCount + '"></div>');
				$('#swatch' + swatchCount).css('background-color','#' + rgb).attr('rel',rgb);
			}
			
			valueR = h2d(valueR);
			valueR = valueR + 17;
			swatchCount++;
		}
		colorCount++;
		
		// create first tertiary
		for ($i=0; $i<15; $i++) {
			if (valueR >= 255) valueR = 0;
			valueG = Math.round(valueR / 2);
			valueR = d2h(valueR);
			valueG = d2h(valueG);
			if (valueR == 0) valueR = '00';
			if (valueG == 0) valueG = '00';
			if (valueG == 9) valueG = '09';
			
			if (val == 'r') {
				var rgb = valueR + valueG + valueB;
			}
			if (val == 'g') {
				var rgb = valueB + valueR + valueG;	
			}
			if (val == 'b') {
				var rgb = valueG + valueB + valueR;	
			}
			//$('#palette').append(rgb + '<br />');
			if (rgb == '000000') {
				gray = d2h(Math.round(colorCount * 23.18));
				gray = gray+gray+gray;
				$('#palette').append('<div class="swatch" id="swatch' + swatchCount + '"></div>');
				$('#swatch' + swatchCount).css('background-color','#' + gray).attr('rel',gray);
			} else {
				$('#palette').append('<div class="swatch" id="swatch' + swatchCount + '"></div>');
				$('#swatch' + swatchCount).css('background-color','#' + rgb).attr('rel',rgb);
			}
			
			valueR = h2d(valueR);
			valueR = valueR + 17;
			swatchCount++;
		}
		
		colorCount++;
		
		// create secondary
		for ($i=0; $i<15; $i++) {
			if (valueR >= 255) valueR = 0;
			valueR = d2h(valueR);
			if (valueR == 0) valueR = '00';
			if (valueG == 0) valueG = '00';
			if (valueB == 0) valueB = '00';
			
			if (val == 'r') {
				var rgb = valueR + valueR + valueB;
			}
			if (val == 'g') {
				var rgb = valueB + valueR + valueR;	
			}
			if (val == 'b') {
				var rgb = valueR + valueB + valueR;	
			}
			//$('#palette').append(rgb + '<br />');
			if (rgb == '000000') {
				gray = d2h(Math.round(colorCount * 23.18));
				gray = gray+gray+gray;
				$('#palette').append('<div class="swatch" id="swatch' + swatchCount + '"></div>');
				$('#swatch' + swatchCount).css('background-color','#' + gray).attr('rel',gray);
			} else {
				$('#palette').append('<div class="swatch" id="swatch' + swatchCount + '"></div>');
				$('#swatch' + swatchCount).css('background-color','#' + rgb).attr('rel',rgb);
			}
			
			valueR = h2d(valueR);
			valueR = valueR + 17;
			swatchCount++;
		}
		colorCount++;
		
		// create second tertiary
		for ($i=0; $i<15; $i++) {
			if (valueR >= 255) valueR = 0;
			valueG = Math.round(valueR / 2);
			valueR = d2h(valueR);
			valueG = d2h(valueG);
			if (valueR == 0) valueR = '00';
			if (valueG == 0) valueG = '00';
			if (valueG == 9) valueG = '09';
			
			if (val == 'r') {
				var rgb = valueG + valueR + valueB;
			}
			if (val == 'g') {
				var rgb = valueB + valueG + valueR;	
			}
			if (val == 'b') {
				var rgb = valueR + valueB + valueG;	
			}
			//$('#palette').append(rgb + '<br />');
			if (rgb == '000000') {
				gray = d2h(Math.round(colorCount * 23.18));
				gray = gray+gray+gray;
				$('#palette').append('<div class="swatch" id="swatch' + swatchCount + '"></div>');
				$('#swatch' + swatchCount).css('background-color','#' + gray).attr('rel',gray);
			} else {
				$('#palette').append('<div class="swatch" id="swatch' + swatchCount + '"></div>');
				$('#swatch' + swatchCount).css('background-color','#' + rgb).attr('rel',rgb);
			}
			
			valueR = h2d(valueR);
			valueR = valueR + 17;
			swatchCount++;
		}		
		colorCount++	
	}
	
	// Show current color
	
	var previewDiv = 'preview'; // name of your preview div
	var originalColor = $('#'+previewDiv).css('background-color');
	
	$('.swatch').hover(function() {
		var currentColor = $(this).css('background-color');
		$('#'+previewDiv).css('background-color',currentColor);
	}, function() {
		$('#'+previewDiv).css('background-color',originalColor);
	});
	
	$('.swatch').click(function() {
		var color = $(this).css('background-color');
		originalColor = color;
		var code = $(this).attr('rel');
		$('#colorCode').html(code);
	});
	
	// Set crosshair
	$('#palette').css( 'cursor', 'crosshair');
	
});