// JavaScript Document
$(document).ready(function(){

	$('.bloc-themes-desc').css({'display':'block','height':'80px','font-size':'10px'})
	$('.bloc-themes-desc strong').css('font-size','11px')

	$('.bloc-themes tr:has(input)').hide();
	$('.bloc-themes tr:has(img)').css('height',$('.bloc-themes tr img').height()+10);

	$('.bloc-themes img').css('cursor','pointer');
	$('.bloc-themes img').hover(themeDescImgOver,themeDescImgOut);
	$('.bloc-themes img').bind('click',themeClickImg);
	
	$('.bloc-themes input[name=theme]').bind('click focus change blur',themeRefreshInput);
	themeRefreshInput();
	themeDescImgOut();
});



function themeDesc(data){
	if(data==undefined)
		data = 'Thèmes ~ Survolez les thèmes pour en savoir plus';

	var desc = (data+'~').split('~');
	$('.bloc-themes-desc').html('<strong>'+desc[0]+'</strong><br />'+desc[1]);
}

function themeDescImgOver(){
	themeDesc($(this).attr('alt'));
	$(this).stop().animate({'opacity':1},'fast');
	
	var desc = $(this).attr('alt')
	if(desc!='')
	{
		desc = desc.split('~');
		var offset = $(this).offset();
		$('body').append('<div class="blocThemeTempCaption" style="width:200px;background:#fff;border:1px solid #9e0827;padding:4px;-moz-border-radius:4px;border-radius:4px;-webkit-border-radius:4px;position:absolute;top:'+(offset.top+60)+'px;left:'+(offset.left+10)+'px;"><strong>'+desc[0]+'</strong><br />'+desc[1]+'</div>');
	}
}
function themeDescImgOut(){
	
	$('.blocThemeTempCaption').remove();
	
	var el = $('.bloc-themes input:checked');
	if(el.length>0)
		themeDesc($('.bloc-themes img[rel='+el.val()+']').attr('alt'));
	else
		themeDesc();

	themeRefreshInput();
}

function themeClickImg(){
	
	var container = $(this).parents('form');
	var el = container.find('input[value='+$(this).attr('rel')+']');

	if(!el.attr('checked'))
		el.attr('checked',true);
	else
		el.attr('checked',false);

	el.trigger('change');

	themeRefreshInput();
	themeDescImgOut();
}

function themeRefreshInput(){
	
	
	var $img = $('.bloc-themes img');
	$img.stop().animate({'opacity':0.2},'fast');
	$img.css({'border':'3px solid #ffffff'});
	
	$('.bloc-themes input:checked').each(function()
	{
		var container = $(this).parents('form');
		
		var $img = container.find('img[rel='+$(this).val()+']');
		$img.stop().animate({'opacity':1},'fast');
		$img.css({'border':'3px solid #9e0827'});
	});
}