/* Copyright 2009 Simon Rönnqvist, all rights reserved */
(function($){

	$(document).ready(function(){
		$('#nav li a').click(function(){
			$(this).blur();
			$('#nav li a').removeClass('active');
			$(this).addClass('active');
			return false;
		});
	});
	
	function rgbToHex(rgbString) {
		// code mostly taken from: http://stackoverflow.com/questions/638948/background-color-hex-to-js-variable-jquery
		
		if (rgbString.match(/^#/)) {
			return rgbString.replace('#', ''); //IE fix, cause IE returns whatever you set in the CSS, eg. black, white, yellow, etc. won't work with this fix though.
	  } else {
			var parts = rgbString
		        	.match(/^rgb\((\d+),\s*(\d+),\s*(\d+)\)$/)
			;
			// parts now should be ["rgb(0, 70, 255", "0", "70", "255"]

		  delete (parts[0]);
  		for (var i = 1; i <= 3; ++i) {
		    parts[i] = parseInt(parts[i]).toString(16);
		    if (parts[i].length == 1) parts[i] = '0' + parts[i];
			}
			var hexString = parts.join(''); // "0070ff"
			return hexString;
		}
	}
	
	// Found at: http://osdir.com/answers/javascript/10931-jquery-append-into-style-element-causes-error-ie-only.html
	//addStyles 0.1
	// Ricardo Tomasi < ricardobeat at gmail com >
	// Licensed under the WTFPL - http://sam.zoy.org/wtfpl/
	function addStyles(rule){
		var sheet = document.styleSheets[0],
		ln = (sheet.cssRules||sheet.rules).length;
		if (sheet.addRule) {
			rule = rule.match(/(.*){(.*)}/);
			sheet.addRule(rule[1],rule[2], ln);
		} else {
			sheet.insertRule(rule, ln);
		};
		return arguments.callee;
	};
	
	
	var initLayout = function() {
		
		function selectElementColor(element, property, colorSelector, appendStyleTag, otherSelectors) {
			$(colorSelector + 'Field').val(rgbToHex($(element).css(property)));
			$(colorSelector + ' div').css('backgroundColor', '#' + rgbToHex($(element).css(property)));
			$(colorSelector).ColorPicker({
				color: '#' + rgbToHex($(element).css(property)),
				onBeforeShow: function (colpkr) {
					$(this).ColorPickerSetColor(rgbToHex($(element).css(property)));
				},
				onShow: function (colpkr) {
					$(colpkr).fadeIn(500);
					return false;
				},
				onHide: function (colpkr) {
					if (appendStyleTag) {
						$(element).removeAttr('style');
					} else {	
						$(element).css(property, $(colorSelector + ' div').css('backgroundColor')); //Possible value from onSubmit read here						
					}
					$(colpkr).fadeOut(500);
					return false;
				},
				onChange: function (hsb, hex, rgb) {
					$(element).css(property, '#' + hex); //Previews color selection live
				},
				onSubmit: function(hsb, hex, rgb) {
					$(colorSelector + 'Field').val(hex);
					$(colorSelector + ' div').css('backgroundColor', '#' + hex); //This value will be read during onHide
					if (appendStyleTag) {
						addStyles(element + '{ ' + appendStyleTag + ': #' + hex + '; }');
						if (otherSelectors) addStyles(otherSelectors + ' { ' + appendStyleTag + ': #' + hex + '; }');
// Replaced this with the above two lines in order to get this working in IE
//						$('style').append(element + '{ ' + appendStyleTag + ': #' + hex + '; }'); // Needed for elements where the class might change, eg. navigation.
//						if (otherSelectors) $('style').append(otherSelectors + ' { ' + appendStyleTag + ': #' + hex + '; }'); // Workaournd since eg. :hover isn't otherwise supported.
					}
				}
			})
			.bind('keyup', function(){
				$(this).ColorPickerSetColor($(colorSelector + ' div').css('backgroundColor'));
			});
		}
		
		
		selectElementColor('body', 'color', '#bodyColorSelector');
		selectElementColor('body', 'backgroundColor', '#bodyBackgroundSelector');
		selectElementColor('h1', 'color', '#headingColorSelector');
		selectElementColor('#content', 'backgroundColor', '#contentBackgroundSelector');
		selectElementColor('#header, #header h1 a', 'color', '#headerColorSelector');
		selectElementColor('#header', 'backgroundColor', '#headerBackgroundSelector');
		selectElementColor('#header ul a:not(.active)', 'color', '#navColorSelector');
		selectElementColor('#header ul#nav li a.active', 'color', '#navActiveColorSelector', 'color', '#header ul#nav li a:hover');
		selectElementColor('#header ul#nav', 'backgroundColor', '#navBackgroundSelector');
		
	};
	
	EYE.register(initLayout, 'init');
})(jQuery)