//show hide
$(document).ready(function() {
		$(".toggle").click(function(e){
			toggleDiv=$(this).attr('id') + 'Content';
			$("#"+toggleDiv).toggle('normal');
			return false;
			});
		});

//user data update preview
$(document).ready(function() {
		$(".user_data").each(function(e){
			previewDiv='#previewBox .' + $(this).attr('id');
			value=$(this).attr('value');
			$(previewDiv).html(value);
			});
		$(".user_data").blur(function(e){
			previewDiv='#previewBox .' + $(this).attr('id');
			value=$(this).attr('value');
			$(previewDiv).html(value);
			return false;
			});


		});




//color picker
$(document).ready(function() {
		var selected;
		$('.colorwell')
		.each(function () {
			placeholder = '#' + $(this).attr('id') + '_color_picker';
			$.farbtastic(placeholder, this);
			$(placeholder).hide();
			$(this).css('opacity', 0.75);
			color = $(this).css('background-color');
			$(this).css('color',color);
			})   
		.focus(function() {
			placeholder = '#' + $(this).attr('id') + '_color_picker';
			$(placeholder).toggle('fast');
			$(this).css('color','#FFF');
			if (selected) {
			$(selected).css('opacity', 0.75).removeClass('colorwell-selected');
			}       
			$(selected = this).css('opacity', 1).addClass('colorwell-selected');
			})             
		.blur(function() {
			placeholder = '#' + $(this).attr('id') + '_color_picker';
			$(placeholder).toggle('fast');
			color = $(this).css('background-color');
			$(this).css('color',color);
			updateTest();
			});
		$('.colorUpdate').click(function() { updateTest });
});

function updateColor(field)
{

	chooser = field + '_CHOOSER';
	setBackground(field,chooser);
	updateTest();

}

function setBackground(source,target)
{
	color = $(source).attr('value');
	$(target).css('background',color);
	//alert(target +' set to '+color);
}

function setColor(source,target)
{
	color = $(source).attr('value');
	$(target).css('color',color);
}


function setBorderColor(source,target)
{
	color = $(source).attr('value');
	$(target).css('border-color',color);
}


function setBorderSize(source,target)
{
	size = $(source).attr('value');
	$(target).css('border-width',size);
}


function setFont(source,target)
{
	font = $(source).attr('value');
	$(target).css('font-family',font);
}


function updateTest()
{
	setBackground('#form #background','#PREVIEW_BODY');	
	setBackground('#form #box','#PREVIEW_BOX');	

	setBorderColor('#form #border','#PREVIEW_BOX');	
	setBorderColor('#form #border','#PREVIEW_IMAGE img');	

	setColor('#form #font','#PREVIEW_CONTENT');	
	setColor('#form #font','#PREVIEW_NAME');	
	setColor('#form #links','#PREVIEW_LINKS');	

	setFont('#form #BODY_FONT_FAMILY','#PREVIEW_BODY');	
	setFont('#form #BODY_FONT_FAMILY','#PREVIEW_SITE_TITLE');	
	setFont('#form #BODY_FONT_FAMILY','#PREVIEW_CONTENT');	
}