function reloadCategories(url){
	window.location.replace(url);
}

$(document).ready(function(){

	
	var colorPurple = $("#purple").val()
	var colorAqua =	 $("#aqua").val()
	var colorGold = $("#gold").val()
	var colorPink = $("#pink").val()
	var colorGreen = $("#green").val()
	
	$("#sort").change(function() {
		
		var animateColor = $(this).find("option:selected").val()
		var label = $(this).find("option:selected").attr("lang")
		var  bgColorSelect=$(this).find("option:selected").val()
//			empty
		if(label == ""){
			
			$(this).find("option").not(".all").each(function(index) {
				
				var animateAll = $(this).val();
				var labelAll = $(this).attr("lang");
				//alert(labelAll);
				$("#mycarousel").find(labelAll).each(function(index) {
					if($(this).hasClass("gris")){
						$(this).animate({"backgroundColor":"#fafafa"})
					}else{
						$(this).animate({"backgroundColor":"#ffffff"})
					}		
				});
				
				
				
				$("#mycarousel").find(labelAll).animate({"color": "#000000"})
				$("#mycarousel").find(labelAll).find("span.episode").animate({"color": animateAll})
			});
//			all	
		}else if(label == "all"){
			$(this).find("option").not(".all").each(function(index) {
				
				var animateAll = $(this).val()
				var labelAll = $(this).attr("lang")
				
				$("#mycarousel").find(labelAll).animate({"backgroundColor": animateAll})
				$("#mycarousel").find(labelAll).animate({"color": "#ffffff"})
				
				$("#mycarousel").find(labelAll).find("span.episode").animate({"color": "#ffffff"})
			});
//			mes favoris
		}else if(label == "fav"){
			
				$('.gridInfo td').each(function(index) {
					
					var codeColor =$(this).attr('char');
					var	color=empty(codeColor)?'000000':$("#"+codeColor).val();
						
					if($(this).attr('lang') == 'fav'){

						var animateAll = $(this).val()
						var labelAll = $(this).attr("lang")
					
						$(this).animate({"backgroundColor": "#"+color})
						$(this).animate({"color": "#ffffff"})
						
						$(this).find("span.episode").animate({"color": "#ffffff"})
						//$(this).find("span.title").animate({"fontSize": "13px"})
					}else{
						
						if($(this).hasClass("gris")){
							$(this).animate({"backgroundColor":"#fafafa"})
						}else{
							$(this).animate({"backgroundColor":"#ffffff"})
						}		
						
						$(this).animate({"color": "#000000"})
						$(this).find("span.episode").animate({"color": "#"+color})
					
					}
				});
//		other	
		}else{
			var colorSpan
			var bgColor
			$("#mycarousel").find("td").not(label).find("span.episode").each(function(){
				colorSpan = '';
				bgColor = ''
				if($(this).parent().parent().hasClass("green")){
					colorSpan = colorGreen;
					bgColor = colorGreen;
				} else if($(this).parent().parent().hasClass("aqua")){
					colorSpan = colorAqua;
					bgColor = colorAqua;
				} else if($(this).parent().parent().hasClass("gold")){
					colorSpan = colorGold;
					bgColor = colorGold;
				} else if($(this).parent().parent().hasClass("purple")){
					colorSpan = colorPurple;
					bgColor = colorPurple;
				} else if($(this).parent().parent().hasClass("pink")){
					colorSpan = colorPink;
					bgColor = colorPink;
				} else {
					colorSpan = "#000000"
					bgColor = "#ffffff"
				}
				$(this).animate({"color": colorSpan})
			
			})
			$("#mycarousel").find(label).animate({"color": "#ffffff"})
			$("#mycarousel").find(label).find("span.episode").animate({"color": "#ffffff"})
			$("#mycarousel").find(label).animate({"backgroundColor": bgColorSelect})
			$("#mycarousel").find("td").not(label).each(function(index) {
				if($(this).hasClass("gris")){
					$(this).animate({"backgroundColor":"#fafafa"})
				}else{
					$(this).animate({"backgroundColor":"#ffffff"})
				}		
			});
			$("#mycarousel").find("td").not(label).animate({"color":"#000000"})
			
		}	
		
	});

});