//(Librairie JQuery 1.2.6)
var helper_size=120;
var drag_widget=100;
var drag_left=105;
var drag_middle=245;
var drag_right=160;

var bg_helper_size="helper_size.gif";
var bg_drag_widget="drag_widget.gif";
var bg_drag_left="drag_left.gif";
var bg_drag_middle="drag_middle.gif";
var bg_drag_right="drag_right.gif";

var dialog_width=800;
var dialog_height=550;


$(document).ready(
	function(){
		//Dialog
		$("#gestioninterface").click(function(){
			$("#text_video").hide();
			$("#pub").hide();
			$("#manage").show();
			$("#manage").dialog({
					resizable:false,
					modal:true,
					overlay:{
						opacity:0.5,
						background:"black"
					},
					width:dialog_width,
					height:dialog_height,
					hide:true,
					close:function(){
						$("#text_video").show();
						$("#pub").show();
					}
			});
		});
		
		//Actions (Enregistrer, quitter, rafraichir, ...)
		$("input#rafraichir").click(function(){
			window.location.replace($('#url').attr('value'));
		});
		
		$("input#quitter").click(function(){
			$("#manage").dialog("close");
		});
		
		
		//Sortable
		$("#myWidget,#drop_left,#drop_middle,#drop_right").sortable({
			connectWith: ["#myWidget","#drop_left","#drop_middle","#drop_right"],
			opacity: 0.7,
			/*handle: "div",*/
			appendTo:("#myWidget"),
			start:function(e,ui){
				var color=$(ui.helper).css('background-color');
				
				$(ui.helper).css("width",helper_size+"px");
				$(ui.helper).css("background","url("+http_url+"fiche/web/images/"+bg_helper_size+") " + color);
			}
		});
		
		
		
		//Droppable
		$("#myWidget,#drop_left,#drop_middle,#drop_right").droppable({
			accept: ".widget",
			
			drop:function(e,ui){
				var width=drag_widget;
				var color=$(ui.draggable).css('background-color');
				
				//Enregistrer la taille à appliquer à l'élément
				switch($(this).attr("id")){
					case "myWidget":
						width=drag_widget;
						background=bg_drag_widget;
					break;
					case "drop_left":
						width=drag_left;
						background=bg_drag_left;
					break;
					case "drop_middle":
						width=drag_middle;
						background=bg_drag_middle;
					break;
					case "drop_right":
						width=drag_right;
						background=bg_drag_right;
					break;
				}
				//Mettre à jour la taille
				$(ui.draggable).css('width',width+'px');
				$(ui.draggable).css("background","url("+http_url+"fiche/web/images/"+background+") " + color);
				//$(ui.draggable).css("backgroundColor","#ffffff");
				
			}
			
			//placeholder: "droppable-hover"
		});
		
		
		//ColorPicker
			
			//COULEURS DE FOND
			//---------------------------
			$('#edit_header_widget').click(function(){
				edit_header_widget();
			});
			
			$('#edit_background_widget').click(function(){
				edit_background_widget();
			});
			
			$('#exemple_top').click(function(){
				edit_header_widget();
			});
			
			$('#exemple_middle').click(function(){
				edit_background_widget();
			});
			
			$('#exemple_bottom').click(function(){
				edit_background_widget();
			});
			
			
			//Changement à la main
			$("#i_couleur_fond_header").change(function(){
				$('#exemple_top').css('backgroundColor',this.value);
			});
		
			$("#i_couleur_texte_header").change(function(){
				$('#exemple_top').css('color',this.value);
			});
		
			$("#i_couleur_fond_contenu").change(function(){
				$('#exemple_middle').css('backgroundColor',this.value);
			});
		
			$("#i_couleur_texte_contenu").change(function(){
				$('#exemple_middle').css('color',this.value);
			});
		
			$("#i_couleur_fond_titre").change(function(){
				$('#exemple_titre').css('backgroundColor',this.value);
				$('.skinSampleImg').css('backgroundColor',this.value);
				$('#defaultBanImgSample').css('backgroundColor',this.value);
			});
		
			$("#i_couleur_texte_titre").change(function(){
				$('#exemple_titre').css('color',this.value);
			});
			
			
			function edit_header_widget(){
				$('#picker').show();
				$('#exemple_top').css('border','1px dotted red');
				$('#exemple_middle').css('border','0');
				$('#text_picker').text('Titre : couleur de fond');
				
				$.farbtastic('#picker').linkTo(
					function(color){
						$('#exemple_top').css('backgroundColor',color);
						$('#i_couleur_fond_header').attr('value',color);
					}
				);
			}
			
			function edit_background_widget(){
				$('#picker').show();
				$('#exemple_middle').css('border','1px dotted red');
				$('#exemple_top').css('border','0');
				$('#text_picker').text('Contenu : couleur de fond');
				
				$.farbtastic('#picker').linkTo(
					function(color){
						$('#exemple_middle').css('backgroundColor',color);
						$('#exemple_bottom').css('backgroundColor',color);
						$('#i_couleur_fond_contenu').attr('value',color);
					}
				);
			}
			
			
			//COULEURS DES TEXTES
			//---------------------------------
			$('#edit_text_header').click(function(){
				$('#picker').show();
				$('#exemple_top').css('border','1px dotted red');
				$('#exemple_middle').css('border','0');
				$('#text_picker').text('Titre : couleur du texte');
				
				$.farbtastic('#picker').linkTo(
					function(color){
						$('#exemple_top').css('color',color);
						$('#i_couleur_texte_header').attr('value',color);
					}
				);
			});
			
			$('#edit_text_widget').click(function(){
				$('#picker').show();
				$('#exemple_middle').css('border','1px dotted red');
				$('#exemple_top').css('border','0');
				$('#text_picker').text('Contenu : couleur du texte');
				
				$.farbtastic('#picker').linkTo(
					function(color){
						$('#exemple_middle').css('color',color);
						$('#exemple_bottom').css('color',color);
						$('#i_couleur_texte_contenu').attr('value',color);
					}
				);
			});
		
		
		//Polices
		$('#edit_police_header').change(function(){
			$('#exemple_top').css('border','1px dotted red');
			$('#exemple_middle').css('border','0');
			$('#text_picker').text('');
			$('#picker').hide();
			
			$('#exemple_top').css('fontFamily',this.value);
			$('#i_police_header').attr('value',this.value);
		});
		
		$('#edit_police_contenu').change(function(){
			$('#exemple_middle').css('border','1px dotted red');
			$('#exemple_top').css('border','0');
			$('#text_picker').text('');
			$('#picker').hide();

			$('#exemple_middle').css('fontFamily',this.value);
			$('#exemple_bottom').css('fontFamily',this.value);
			$('#i_police_contenu').attr('value',this.value);
		});
		
		
		//Bannière
		$("#edit_texte_banniere").click(function(){
			$('#banniere_text_picker').text('Bannière : couleur du texte');
			$.farbtastic('#banniere_picker').linkTo(
				function(color){
					$('#exemple_titre-artiste').css('color',color);
					$('#exemple_titre-style').css('color',color);
					$('#i_couleur_texte_titre').attr('value',color);
				}
			);
		});
	
		$("#exemple_titre, #edit_fond_banniere").click(function(){
			$('#banniere_text_picker').text('Bannière : couleur de fond');
			$.farbtastic('#banniere_picker').linkTo(
				function(color){
					$('#exemple_titre').css('backgroundColor',color);
					$('#i_couleur_fond_titre').attr('value',color);
					$('.skinSampleImg').css('backgroundColor',color);
				}
			);
		});
	
		$('#edit_police_titre').click(function(){
			$('#exemple_titre').css('fontFamily',this.value);
			$('#i_police_titre').attr('value',this.value);
		});
		
		
		//Enregistrement
		$("input#enregistrer").click(function(){
			$.get(http_url+"ajax/artiste/boxes/?c=left&"+$('#drop_left').sortable('serialize'));
			$.get(http_url+"ajax/artiste/boxes/?c=middle&"+$('#drop_middle').sortable('serialize'));
			$.get(http_url+"ajax/artiste/boxes/?c=right&"+$('#drop_right').sortable('serialize'));
			$.get(http_url+"ajax/artiste/boxes/?c=trash&"+$('#myWidget').sortable('serialize'));
		
			window.alert('L\'organisation de votre page a été enregistrée.' + "\n" + 'Cliquez sur "Rafraichir la page" pour voir les modifications.');
			/*$("div#resultarea").html(
				"left : " + $('#drop_left').sortable('serialize')+"<br />"+
				"middle : " + $('#drop_middle').sortable('serialize')+"<br />"+
				"right : " + $('#drop_right').sortable('serialize')
			);*/
		});
		
		
		$("input#enregistrer_couleurs").click(function(){
			$('.top').css('backgroundColor',$('#i_couleur_fond_header').attr('value'));
			$('.widget').css('backgroundColor',$('#i_couleur_fond_header').attr('value'));
			$('.middle').css('backgroundColor',$('#i_couleur_fond_contenu').attr('value'));
			$('.middle a').css('backgroundColor',$('#i_couleur_fond_contenu').attr('value'));
			$('.bottom').css('backgroundColor',$('#i_couleur_fond_contenu').attr('value'));
			$('#pub').css('backgroundColor',$('#i_couleur_fond_contenu').attr('value'));
			$('#infos').css('backgroundColor',$('#i_couleur_fond_contenu').attr('value'));
			
			$('.top').css('color',$('#i_couleur_texte_header').attr('value'));
			$('.top a').css('color',$('#i_couleur_texte_header').attr('value'));
			$('.widget').css('color',$('#i_couleur_texte_header').attr('value'));
			$('.middle').css('color',$('#i_couleur_texte_contenu').attr('value'));
			$('.middle a').css('color',$('#i_couleur_texte_contenu').attr('value'));
			$('.bottom').css('color',$('#i_couleur_texte_contenu').attr('value'));
			$('#infos').css('color',$('#i_couleur_texte_contenu').attr('value'));
			$('#infos #hits a').css('color',$('#i_couleur_texte_contenu').attr('value'));
			$('.s_video').css('color',$('#i_couleur_texte_contenu').attr('value'));
			$('.s_com').css('color',$('#i_couleur_texte_contenu').attr('value'));

			$('.top').css('fontFamily',$('#i_police_header').attr('value'));
			$('.top a').css('fontFamily',$('#i_police_header').attr('value'));
			$('.widget').css('fontFamily',$('#i_police_header').attr('value'));
			$('.middle').css('fontFamily',$('#i_police_contenu').attr('value'));
			$('.middle a').css('fontFamily',$('#i_police_contenu').attr('value'));
			$('.bottom').css('fontFamily',$('#i_police_contenu').attr('value'));
			$('#infos').css('fontFamily',$('#i_police_contenu').attr('value'));
			$('#infos #hits a').css('fontFamily',$('#i_police_contenu').attr('value'));
			$('.s_video').css('fontFamily',$('#i_police_contenu').attr('value'));
			$('.s_com').css('fontFamily',$('#i_police_contenu').attr('value'));
			
			
			$.post(http_url+"ajax/artiste/design/", { c_fond_header: $('#i_couleur_fond_header').attr('value'), c_texte_header: $('#i_couleur_texte_header').attr('value'), c_fond_contenu: $('#i_couleur_fond_contenu').attr('value'), c_texte_contenu: $('#i_couleur_texte_contenu').attr('value'), typo_header: $('#i_police_header').attr('value'), typo_contenu: $('#i_police_contenu').attr('value') } );
			//$.post(http_url+"fiche/edit/POCHETTE-SURPRISE", { name: "John", time: "2pm" } );
		});
		
		
		$("input#enregistrer_titre").click(function(){
			//entête
			$('#titre-fiche').css('backgroundColor',$('#i_couleur_fond_titre').attr('value'));
			$('#titre-fiche').css('color',$('#i_couleur_texte_titre').attr('value'));
			$('#titre-fiche').css('fontFamily',$('#i_police_titre').attr('value'));
			
			$('#titre-fiche').css("background-image","url("+skins_rep_url+$('#skin').attr('value')+"/bloc-haut.png)");
			$('div#nav a img').css("background-color",$('#i_couleur_fond_titre').attr('value'));
			
			$('#launch').css("background-color",$('#i_couleur_fond_titre').attr('value'));
			//alert($('#launch').css("background-color"));
			
			//player
			var reg=new RegExp("(#)");
			var playerBackcolor=$('#i_couleur_fond_titre').attr('value').replace(reg,"0x");
			var playerFrontcolor=$('#i_couleur_texte_titre').attr('value').replace(reg,"0x");
			var playerLightcolor=$('#i_couleur_texte_header').attr('value').replace(reg,"0x");
			var playerScreecolor=$('#i_couleur_fond_contenu').attr('value').replace(reg,"0x");
			setPlayer(playerBackcolor,playerFrontcolor,playerLightcolor,playerScreecolor)

			//corps
			$('#left .top').css("background-image","url("+skins_rep_url+$('#skin').attr('value')+"/bloc-petit-haut.png)");
			$('#left .middle').css("background-image","url("+skins_rep_url+$('#skin').attr('value')+"/bloc-petit-milieu.png)");
			$('#left .bottom').css("background-image","url("+skins_rep_url+$('#skin').attr('value')+"/bloc-petit-bas.png)");
			
			$('#middle .top').css("background-image","url("+skins_rep_url+$('#skin').attr('value')+"/bloc-large-haut.png)");
			$('#middle .middle').css("background-image","url("+skins_rep_url+$('#skin').attr('value')+"/bloc-large-milieu.png)");
			$('#middle .bottom').css("background-image","url("+skins_rep_url+$('#skin').attr('value')+"/bloc-large-bas.png)");
			
			$('#right .top').css("background-image","url("+skins_rep_url+$('#skin').attr('value')+"/bloc-moyen-haut.png)");
			$('#right .middle').css("background-image","url("+skins_rep_url+$('#skin').attr('value')+"/bloc-moyen-milieu.png)");
			$('#right .bottom').css("background-image","url("+skins_rep_url+$('#skin').attr('value')+"/bloc-moyen-bas.png)");
			
			$.post(
				http_url+"ajax/artiste/design/",{
					c_fond_banniere: $('#i_couleur_fond_titre').attr('value'),
					c_texte_banniere: $('#i_couleur_texte_titre').attr('value'),
					typo_banniere: $('#i_police_titre').attr('value'),
					skin: $('#skin').attr('value')
				}
			);
			/*
			$('#launch').html('<img src="'+http_url+'fiche/web/images/launcher/launcher-'+$('.launcher_player[@checked]').attr('value')+'.gif" alt="Player" title="Player" />');
			
			$.post(http_url+"ajax/artiste/design/", { launcher_player:$('.launcher_player[@checked]').attr('value'), c_fond_banniere: $('#i_couleur_fond_titre').attr('value'), c_texte_banniere: $('#i_couleur_texte_titre').attr('value'), typo_banniere: $('#i_police_titre').attr('value') } );
			*/
		});
		
		$("input#enregistrer_skin").click(function(){
			$.post(http_url+"ajax/artiste/design/", {skin:$('#skin').attr('value'), bordsarrondis:$('.arrondis[@checked]').attr('value')});
		});
		
		
		//Tabs
		$("#manage").tabs();
	}
);


function skinSwitch(nom){
	document.getElementById('skin').value=nom;
	$('#exemple_titre').css("background-image","url("+skins_rep_url+nom+"/bloc-haut.png)");
	$('#exemple_top').css("background-image","url("+skins_rep_url+nom+"/bloc-moyen-haut.png)");
	$('#exemple_middle').css("background-image","url("+skins_rep_url+nom+"/bloc-moyen-milieu.png)");
	$('#exemple_bottom').css("background-image","url("+skins_rep_url+nom+"/bloc-moyen-bas.png)");
	
	$('.skinSampleImg').css("border-style","none");
	$('#skinSample'+nom).css("border","#FFFFFF 1px solid");
}

function titresCommeBanniere(){
	confirmation=confirm("Souhaitez vous utiliser pour vos titres la même couleur de fond, la même police et la même couleur de texte que pour la bannière ?");
	if(confirmation){
		$('#i_couleur_fond_header').attr('value',$('#i_couleur_fond_titre').attr('value'));
		$('#exemple_top').css('backgroundColor',$('#i_couleur_fond_titre').attr('value'));
		
		$('#i_couleur_texte_header').attr('value',$('#i_couleur_texte_titre').attr('value'));
		$('#exemple_top').css('color',$('#i_couleur_texte_titre').attr('value'));
		
		$('#edit_police_header').attr('value',$('#edit_police_titre').attr('value'));
		$('#i_police_header').attr('value',$('#edit_police_titre').attr('value'));
		$('#exemple_top').css('font-family',$('#edit_police_titre').attr('value'));
	}
}