var Step1Form = new Class({
	
	initialize : function(form, urlPage){
	
		this.form = form;
		this.urlPage = urlPage;
		this.errors = this.form.getElements('p.error');
		this.divControls = $('controls');	
		this.initRequest();	
		
		this.apercuFP = $('fairepart-miniature');
		
		if ($('evenement')){
			xpression = new RegExp("/media/public/img/creer/apercu-(.+).png");
	    	res = xpression.exec(this.apercuFP.get('src'));
	    	if (res && res[1]){
	    		this.apercuFP.set('src',this.apercuFP.get('src').replace(res[1],$('evenement').getSelected().get('value')));
	    	}
			$('evenement').addEvent('change',function(e){
				xpression = new RegExp("/media/public/img/creer/apercu-(.+).png");
		    	res = xpression.exec(this.apercuFP.get('src'));
		    	if (res && res[1]){
		    		this.apercuFP.set('src',this.apercuFP.get('src').replace(res[1],$('evenement').getSelected().get('value')));
		    	}
			}.bind(this));
		}
		
		this.form.addEvent('submit', function(e){
			e.stop();
			this.form.send();
		}.bind(this));	
		
		if ($("evenement")){
			$('showPerso2').addEvent('click',function(e){
				e.stop();
				this.linkDivers();
			}.bind(this));
			
			
			this.objetDivers = $("evenement");
			this.selectDivers(true);
			this.objetDivers.addEvent('change', function(e){
				this.linkDivers();
				this.selectDivers();
			}.bind(this));
		}
	},
	
	selectDivers : function(start){
		
		switch(this.objetDivers.value){
			case "annonce-grossesse" : 
				this.showMsg();
				this.maskLinkPerso2();
				if (!start){
					this.printTwoPerson();
				}
				break;
			case "anniversaire-de-mariage" : 
				this.maskMsg();
				this.maskLinkPerso2();
				if (!start){
					this.printTwoPerson();
				}
				break;
			case "fiancailles" : 
				this.maskMsg();
				this.maskLinkPerso2();
				if (!start){
					this.printTwoPerson(); 
				}
				break;
			default : 
				this.maskMsg();
				this.showLinkPerso2();
				if ($("inputPrenom2").value != ""){
					this.printTwoPerson();
					$('showPerso2').set('text','Retirer la personne');
				} else {
					this.printOnePerson();
					$('showPerso2').set('text','Ajouter une personne');
				}
				break;
		}
	},
	
	linkDivers : function(){
		if ($('perso2').hasClass('dNone')){
			$('showPerso2').set('text','Retirer la personne');
			this.printTwoPerson();
		} else {
			$('showPerso2').set('text','Ajouter une personne');
			this.printOnePerson();
		}
	},
	
	maskMsg : function(){
		$('msgAnnonce').addClass('dNone');
	},
	
	showMsg : function(){
		$('msgAnnonce').removeClass('dNone');
	},
	
	maskLinkPerso2 : function(){
		$('showPerso2').addClass('dNone');
	},
	showLinkPerso2 : function(){
		$('showPerso2').removeClass('dNone');
	},
	
	printOnePerson : function(){
		$('perso2').addClass('dNone');
	},
	
	printTwoPerson : function(){
		$('perso2').removeClass('dNone');
	},
	
	sendForm : function(slide1, slide2, nextArrow, prevArrow){
		this.slide1 = slide1;
		this.slide2 = slide2;
		this.nextArrow = nextArrow;
		this.prevArrow = prevArrow;
		this.form.send();
	},
	
	initRequest : function(){
		this.form.set('send', {
			onRequest : function(){
				this.hideErrors();
			}.bind(this),
			
			onFailure : function(response){
				var errors = JSON.decode(response.responseText);
				this.setErrors(errors);
			}.bind(this),
			
			onSuccess : function(response){
				
				var toModify = JSON.decode(response);
				this.formSent(toModify["resp"], toModify["pers"], toModify["style"]);
				nextSlide(this.slide1,this.slide2,this.nextArrow,this.prevArrow);	
				this.slide1 = "";
				this.slide2 = "";
				
			}.bind(this)
			
		});
	},
	
	hideErrors : function(){
		this.errors.each(function(p){
			p.innerHTML = "";
		});
	},
	
	setErrors : function(errors){
		$each(errors, function(item, index){
			if ($(index+'-error')){
				if ($(index))
					$(index).highlight('#f9a000');
				$(index+'-error').innerHTML = item;
			} else {
				$('global-error').innerHTML = item;
			}
		});
	},
	
	formSent : function(urlPhoto, personne, style){
		this.hideErrors();
		
		// DEBUG REPRISE
		if(currentStepClass && currentStepClass<=2){
			for(champ in style){
				var f = champ.charAt(0).toUpperCase();
	    		inputChamp = f + champ.substr(1, champ.length-1);
	    		if($('input'+inputChamp)){
					applyStyle($('input'+inputChamp),style[champ],$('input'+inputChamp).getParent().getParent().getParent() );
	    		}
			}
		}
		
		if ($('inputTitre')){
			$('inputTitre').value = personne;
		}
		if (urlPhoto != "-1"){
			updateApercu(urlPhoto);		
		}
	}
	
	
	
});
Step1Form.implement(new Events);


var FontSelectorForm = new Class({
	
	initialize : function(divFontFamily, urlPage, champName){
		this.urlPage = urlPage;
		this.champName = champName;
		this.divFontFamily = divFontFamily;
		this.divSelector = this.divFontFamily.getElement('.fontSelector');
		if ($('footer')){
			$('footer').grab(this.divSelector,'top');
		}
		else{
			$('nobs').grab(this.divSelector,'top');
		}
		this.aSelector = this.divFontFamily.getElement('.changeValue');	
		//this.aSelector.getElement("span").set("text","toto");
		this.aSelector.addEvent('click',function(e){
			e.stop();
			this.rePosition();
			this.divSelector.toggleClass('dNone');
		}.bind(this));
		this.divSelector.getElements('a').each(function (aLink){
			aLink.addEvent('click',function (e){
				e.stop();	
				this.divSelector.getElements('a').each(function (aLink){
					aLink.removeClass('current');
				});
				aLink.addClass('current');
				
				xpression = new RegExp("font-(.*)");
		    	res = xpression.exec(aLink.id);
		    	if (res && res[1]){
		    		new Request({  
						 method: 'post',  
						 url: this.urlPage + this.champName + "/",  
						 data: { 'fontFamily' : res[1],'style':'ok'},  
						 onRequest: function() {  },  
						 onComplete: function(response) { 
						 	var textNew = aLink.get("text");
							if (textNew.length > 11){
								textNew = textNew.substr(0,9)+"...";
							}
							//alert(textNew);
							this.aSelector.getElement("span").set("text",textNew);
							
							if (response != "-1"){
								updateApercu(response);
							}	
							this.divSelector.addClass('dNone');
						 }.bind(this)  
		     		}).send();
		    	}
			}.bind(this));
		}.bind(this));
		
	},
	
	rePosition : function(){
		var nobs = $('nobs');
		if(nobs){
			var coords = this.aSelector.getCoordinates(nobs);
		}else{
			var coords = this.aSelector.getCoordinates();
		}
		this.divSelector.setStyles({
			'left': coords.left,
			'top': coords.top + coords.height + 3
		});
		
	}
	
});
FontSelectorForm.implement(new Events);

var TextChamps = new Class({
	Implements: Events, 
	initialize : function(divControls, inputChamp, urlPage, champName){
		
	//LA	
	this.arrFontSizes = ['10px','12px','14px','16px','18px','20px','24px','28px','36px','42px','48px','54px']; 
		
		this.inputChamp = inputChamp;
		this.linkSizeUp = divControls.getElement(".sizeUp");
		this.linkSizeDown = divControls.getElement(".sizeDown");
		this.linkFontBold = divControls.getElement(".fontBold");
		this.linkFontItalic = divControls.getElement(".fontItalic");
		this.linkAlignLeft = divControls.getElement(".alignLeft");
		this.linkAlignCenter = divControls.getElement(".alignCenter");
		this.linkAlignRight = divControls.getElement(".alignRight");
		
		this.divColor = divControls.getElement('.fontColor').getElement('div.textSelectorValue');
		this.linkColor = divControls.getElement('.fontColor').getElement('a');
		var bgColor = this.divColor.style.backgroundColor;
		if (this.linkColor){
			var r = new MooRainbowLight(this.linkColor, {
				id : this.inputChamp.id+"moo",
				color : bgColor.rgbToHex().toUpperCase(),
				onComplete: function(color) {
					this.divColor.setStyle('background-color',"rgb("+color+")");
					this.inputChamp.setStyle("color","rgb("+color+")");
					new Request({  
						 method: 'post',  
						 url: urlPage+champName+"/",  
						 data: { 'fontColor' : color.join(','),'style':'ok'  },  
						 onRequest: function() {  },  
						 onComplete: function(response) { 
							if (response != "-1"){
								updateApercu(response);
							}	
						 }  
		     		}).send();
					
					
				}.bind(this)
			});
		}
		
		var weight, style;
		var cpt;
		this.linkSizeUp.addEvent('click', function(e){
			e.stop();
			var actualFontSize = this.inputChamp.getStyle('font-size');
			
			if (actualFontSize == this.arrFontSizes[(this.arrFontSizes.length-1)]){
				return;
			}
			
			for (i=0; i<this.arrFontSizes.length; i++){
				if (this.arrFontSizes[i] == actualFontSize){
					cpt = i;
					break;
				}
			}
			if (cpt<(this.arrFontSizes.length-1)) cpt++; 	
			this.inputChamp.setStyle('font-size',this.arrFontSizes[cpt]);
			
			new Request({  
				 method: 'post',  
				 url: urlPage+champName+"/",  
				 data: { 'fontSize' : this.arrFontSizes[cpt],'style':'ok'  },  
				 onRequest: function() {  },  
				 onComplete: function(response) { 
					if (response != "-1"){
						updateApercu(response);
					}	
				 }  
     		}).send();
			
		}.bind(this));
		
		this.linkSizeDown.addEvent('click', function(e){
			e.stop();
			var actualFontSize = this.inputChamp.getStyle('font-size');
			if (actualFontSize == this.arrFontSizes[0]){
				return;
			}
			
			for (i=0; i<this.arrFontSizes.length; i++){
				if (this.arrFontSizes[i] == actualFontSize){
					cpt = i;
					break;
				}
			}
			if (cpt>0) cpt--; 	
			this.inputChamp.setStyle('font-size',this.arrFontSizes[cpt]);
			
			new Request({  
				 method: 'post',  
				 url: urlPage+champName+"/",  
				 data: { 'fontSize' : this.arrFontSizes[cpt],'style':'ok'  },  
				 onRequest: function() {  },  
				 onComplete: function(response) { 
					if (response != "-1"){
						updateApercu(response);
					}	
				 }  
     		}).send();
			
		}.bind(this));
		
		this.linkFontBold.addEvent('click', function(e){
			e.stop();
			if (this.linkFontBold.hasClass("enabled")){
				this.linkFontBold.addClass("disabled");
				this.linkFontBold.removeClass("enabled");
				var enabled = false;
			} else {
				this.linkFontBold.addClass("enabled");
				this.linkFontBold.removeClass("disabled");
				var enabled = true;
			}
			if (enabled){
				if (this.linkFontItalic.hasClass('enabled')){
					weight = "bold"; 
					style = "italic";
					fontWeight = "bi";	
				} else {
					weight = "bold"; 
					style = "normal";
					fontWeight = "bd";
				}
			} else {
				if (this.linkFontItalic.hasClass('enabled')){
					weight = "normal"; 
					style = "italic";
					fontWeight = "it";	
				} else {
					weight = "normal"; 
					style = "normal";
					fontWeight = "no";
				}
			}
			this.inputChamp.setStyle("font-weight",weight);
			this.inputChamp.setStyle("font-style",style);
			
			new Request({  
				 method: 'post',  
				 url: urlPage+champName+"/",  
				 data: { 'fontWeight' : fontWeight,'style':'ok'  },  
				 onRequest: function() {  },  
				 onComplete: function(response) { 
					if (response != "-1"){
						updateApercu(response);
					}	
				 }  
     		}).send();
			
		}.bind(this));
		
		this.linkFontItalic.addEvent('click', function(e){
			e.stop();
			if (this.linkFontItalic.hasClass('enabled')){
				this.linkFontItalic.addClass("disabled");
				this.linkFontItalic.removeClass("enabled");
				var enabled = false;
			} else {
				this.linkFontItalic.addClass("enabled");
				this.linkFontItalic.removeClass("disabled");
				var enabled = true;
			}
			if (enabled){
				if (this.linkFontBold.hasClass('enabled')){
					weight = "bold"; 
					style = "italic";
					fontWeight = "bi";	
				} else {
					weight = "normal"; 
					style = "italic";
					fontWeight = "it";	
				}
			} else {
				if (this.linkFontBold.hasClass('enabled')){
					weight = "bold"; 
					style = "normal";
					fontWeight = "bd";
				} else {
					weight = "normal"; 
					style = "normal";
					fontWeight = "no";
				}
			}
			this.inputChamp.setStyle("font-weight",weight);
			this.inputChamp.setStyle("font-style",style);
			
			new Request({  
				 method: 'post',  
				 url: urlPage+champName+"/",  
				 data: { 'fontWeight' : fontWeight ,'style':'ok' },  
				 onRequest: function() {  },  
				 onComplete: function(response) { 
					if (response != "-1"){
						updateApercu(response);
					}	
				 }  
     		}).send();
			
		}.bind(this));
		
		
		
		this.linkAlignLeft.addEvent('click', function(e){
			e.stop();
			if (!this.linkAlignLeft.hasClass('enabled')){
				this.linkAlignLeft.addClass("enabled");
				this.linkAlignCenter.removeClass("enabled");
				this.linkAlignRight.removeClass("enabled");
			} 
			this.inputChamp.setStyle("text-align","left");
			
			new Request({  
				 method: 'post',  
				 url: urlPage+champName+"/",  
				 data: { 'alignment' : "left",'style':'ok'  },  
				 onRequest: function() {  },  
				 onComplete: function(response) { 
					if (response != "-1"){
						updateApercu(response);
					}	
				 }  
     		}).send();
			
		}.bind(this));
		
		this.linkAlignRight.addEvent('click', function(e){
			e.stop();
			if (!this.linkAlignRight.hasClass('enabled')){
				this.linkAlignRight.addClass("enabled");
				this.linkAlignCenter.removeClass("enabled");
				this.linkAlignLeft.removeClass("enabled");
			} 
			this.inputChamp.setStyle("text-align","right");
			
			new Request({  
				 method: 'post',  
				 url: urlPage+champName+"/",  
				 data: { 'alignment' : "right",'style':'ok'  },  
				 onRequest: function() {  },  
				 onComplete: function(response) { 
					if (response != "-1"){
						updateApercu(response);
					}	
				 }  
     		}).send();
			
		}.bind(this));
		
		this.linkAlignCenter.addEvent('click', function(e){
			e.stop();
			if (!this.linkAlignCenter.hasClass("enabled")){
				this.linkAlignCenter.addClass("enabled");
				this.linkAlignRight.removeClass("enabled");
				this.linkAlignLeft.removeClass("enabled");
			} 
			this.inputChamp.setStyle("text-align","center");
			
			new Request({  
				 method: 'post',  
				 url: urlPage+champName+"/",  
				 data: { 'alignment' : "center",'style':'ok'  },  
				 onRequest: function() {  },  
				 onComplete: function(response) { 
					if (response != "-1"){
						updateApercu(response);
					}	
				 }  
     		}).send();
			
		}.bind(this));
	}
		
});


var SliderCreate;
var SliderForRatio = null;

var sideinfo;
var arrInfo;

var currentStepClass;


window.addEvent('domready', function() {
	
	var urlPage = window.location.href;
	if (window.location.href.match("editeur")){
		urlPage = urlPage.replace(/editeur(\/)?/,"");
	}
	if (window.location.href.match("espace")){
		var urlMiniature = "/fairepart/generer/miniature/espace/";	
	} else {
		var urlMiniature = "/fairepart/generer/miniature/";	
	}
	
	var divCreation = $('creation');
	if (!divCreation) return;
	
	if($('buttonFinal')){
		$('buttonFinal').removeEvents();
		$('buttonFinal').addEvent('click', function(e){
			e.stop();
			var cgu_fp = $('cgu_fairepart');
			
			if(cgu_fp && cgu_fp.checked){
				// go !
				$('cgu_fairepart_errors').innerHTML = "";
				if($('buttonFinal').hasClass('nopost')){
					window.location.href = $('buttonFinal').get('href');
				} else {
					$('formValidFinale').submit();
				}
			}else{
				// erreur : 
				$('cgu-div').setStyle('height', '70px');
				$('cgu_fairepart_errors').innerHTML = "L'acceptation des CGU de Carnet de France est obligatoire."
			}
			
		});
	}
	
	currentStepClass = divCreation.className.charAt(4);
	
	arrInfo = {
		'c1' : $('info-step1').innerHTML,
		'c2' : $('info-step2').innerHTML,
		'c3' : $('info-step3').innerHTML,
		'c4' : $('info-step4').innerHTML,
		'c5' : $('info-step5').innerHTML
	};
	
	sideinfo = $('step-info');
	sideinfo.innerHTML = arrInfo['c1'];
	
	for(bloppy = 1; bloppy<6; bloppy++){
		$('info-step'+bloppy).innerHTML = '';
	}
	
	var nextArrow = divCreation.getElement('.slidenext');
	var prevArrow = divCreation.getElement('.slideprev');
	
	
	SliderCreate = new Fx.Tween($('slides'),{
		'link' : 'cancel',
		'duration' : 500
	});
	
	
	if(currentStepClass>1){
		if(currentStepClass==5){
			currentStepClass = 4;
		}
		updateApercu(urlMiniature);
		
		newLeft = '-'+(currentStepClass-1)*568+'px';
		SliderCreate.set('left', newLeft);
		prevArrow.removeClass('disabled');	
		if (currentStepClass==5){
			nextArrow.addClass('disabled');	
		}
		$('c1').removeClass('current');
		$('c'+currentStepClass).addClass('current');
			
		sideinfo.innerHTML = arrInfo['c'+currentStepClass];
		
		if(currentStepClass>=3 &&  currentStepClass<=3){
		$('step-help2').addClass('dNone');
		}else{
			$('step-help2').removeClass('dNone');
		}
		
	}else{
		prevArrow.addClass('disabled');	
	}
	
	var urlPage = window.location.href;
	if (window.location.href.match("editeur")){
		urlPage = urlPage.replace(/editeur(\/)?/,"");
	}
	if(urlPage.lastIndexOf("#") > 0){
		urlPage = urlPage.substring(0,urlPage.lastIndexOf("#"));
	}
	
	var step = "";
	var divControls = $('controls');
	var step1 = new Step1Form($('step1form'), urlPage);
	var stepPrec = "";
	var apercuFP = $('fairepart-miniature');
	
	$('controls').getElements('a').each(function(control){
		var controlElt = control;
		controlElt.addEvent('click', function(e){
			e.stop();
			if(!controlElt.hasClass('current')){
				if ($('controls').getElement('a.current').id=="c1"){
					step1.sendForm($('controls').getElement('a.current').id, controlElt.id,nextArrow,prevArrow);
				} else {
					nextSlide($('controls').getElement('a.current').id, controlElt.id,nextArrow,prevArrow);
				}
			}
		});	
	});
	
	var reg1=new RegExp("naissance");
	if (urlPage.match(reg1)) {
		
		$('enfant2').getElement("a").addEvent("click", function(e){
			e.stop();
			$('enfant2').getElements('div').each(function (divInter){
				divInter.removeClass('dNone');
			});
			
			$('enfant2').getElement("a").addClass('dNone');
			$('enfant3').removeClass("dNone");
			
		});
		
		$('enfant3').getElement("a").addEvent("click", function(e){
			e.stop();
			$('enfant3').getElements('div').each(function (divInter){
				divInter.removeClass('dNone');
			});
			$('enfant3').getElement("a").addClass('dNone');
			
		});
		
		
//		$('inputDate').addEvent('blur',function (e){
//			var strDate = $('inputDate').value;
//			var arrDate = strDate.split('/');
//			if (strDate != ""){
//				if (arrDate.length >= 3){
//					var dateNaissance = new Date(arrDate[2],arrDate[1]-1,arrDate[0]);
//					var dateNow = new Date();
//					var difference = (dateNaissance.getTime()-dateNow.getTime());
//					var days = Math.floor(difference/86400000) + 1;
//					if (days > 0){
//						$('inputDate-warning').innerHTML = 'Attention la date de naissance ne peut pas être postérieure à la date d\'aujourd\'hui !';	
//					} else {
//						$('inputDate-warning').innerHTML = '';
//					}
//				} else {
//					var arrDate = strDate.split('-');
//					if (arrDate.length >= 3){
//						var dateNaissance = new Date(arrDate[2],arrDate[1]-1,arrDate[0]);
//						var dateNow = new Date();
//						var difference = (dateNaissance.getTime()-dateNow.getTime());
//						var days = Math.floor(difference/86400000) + 1;
//						if (days > 0){
//							$('inputDate-warning').innerHTML = 'Attention la date de naissance ne peut pas être postérieure à la date d\'aujourd\'hui !';
//						} else {
//							$('inputDate-warning').innerHTML = '';
//						}
//					} else {
//						$('inputDate-warning').innerHTML = '';
//					}
//				}	
//			} else {
//				$('inputDate-warning').innerHTML = '';
//			}
//			
//		});
			 
	}
	
	
	$('s2').getElements('a').each(function(linkTheme){
		xpression = new RegExp("theme-(.*)");
    	res = xpression.exec(linkTheme.id);
    	var idTheme = "";
    	if (res && res[1]){
    		idTheme = res[1];
			linkTheme.addEvent('click',function(e){
				e.stop();
				  new Request({  
		             method: 'post',  
		             url: urlPage+"theme/",  
		             data: { 'idTheme' : idTheme},  
		             onRequest: function() {  },  
		             onComplete: function(response) { 
		             	var toModify = JSON.decode(response);
						if (toModify["resp"] != "-1"){
							updateApercu(toModify["resp"]);
						}	
						style = toModify["style"];
						for(champ in style){
							var f = champ.charAt(0).toUpperCase();
				    		inputChamp = f + champ.substr(1, champ.length-1);
				    		if($('input'+inputChamp)){
				    			tempObj = $('input'+inputChamp);
				    			applyStyle(tempObj,style[champ],tempObj.getParent().getParent().getParent() );	
				    		}
						}
					 }  
	         	}).send();  	
			});
    	}
	});
	
	$('s3').getElements('div.divText').each(function(divText){
		//alert(divText.id);
		var divShowText = divText.getElement('.showText');
		var divEditText = divText.getElement('.editText');
		var divValueText = divText.getElement('.valueText');
		//var divActionText = divText.getElement('.actionText');
		var divCenter = divText.getElement('.divCenter');
		var labelTop =  divText.getElement('label');
		
		var inputChamp = divValueText.getElement('input');
		if (!inputChamp){
			var inputChamp = divValueText.getElement('textarea');
		} 
		
		divShowText.getElement('a').addEvent('click',function(e){
			e.stop();
			if(!divShowText.hasClass('dNone')){
				divShowText.addClass('dNone');
				divEditText.removeClass('dNone');
				divCenter.removeClass('dNone');
			}else{
				divShowText.removeClass('dNone');
				divEditText.addClass('dNone');
				divCenter.addClass('dNone');
			}
		});
		labelTop.addEvent('click',function(e){
			e.stop();
			if(!divShowText.hasClass('dNone')){
				divShowText.addClass('dNone');
				divEditText.removeClass('dNone');
				divCenter.removeClass('dNone');
			}else{
				divShowText.removeClass('dNone');
				divEditText.addClass('dNone');
				divCenter.addClass('dNone');
			}
		});
		
		if(inputChamp.value != ""){
			divShowText.addClass('dNone');
			divEditText.removeClass('dNone');
			divCenter.removeClass('dNone');
		}
		
		xpression = new RegExp("input(.*)");
    	//res = xpression.exec(inputChamp.name);
    	res = xpression.exec(inputChamp.id);
    	if (res && res[1]){
			var champName = res[1];
    		champName = champName.toLowerCase();
    		//function(divControls, inputChamp, urlPage, champName){
    		
	    	//var optionsCamp = new TextChamps(divActionText, inputChamp, urlPage, champName);
	    	var optionsCamp = new TextChamps(divEditText, inputChamp, urlPage, champName);
	    	var fontSelectorForm = new FontSelectorForm(divEditText.getElement('.fontFamily'),urlPage,champName);
			inputChamp.addEvent('blur',function(e){
				e.stop();
				new Request({  
					 method: 'post',  
					 url: urlPage+champName+"/",  
					 data: { 'input' : inputChamp.value },  
					 onRequest: function() {  },  
					 onComplete: function(response) { 
						if (response != "-1"){
							updateApercu(response);
						}	
					 }  
	     		}).send();
		    	
			});
    	}
	});
	
	
	$('s4').getElements('a.symbole').each(function(linkSymbole){
		xpression = new RegExp("symbole-(.*)");
    	res = xpression.exec(linkSymbole.id);
    	var idSymbole = "";
    	if (res && res[1]){
    		idSymbole = res[1];
			linkSymbole.addEvent('click',function(e){
				e.stop();
			  	new Request({  
		             method: 'post',  
		             url: urlPage+"symbole/",  
		             data: { 'idSymbole' : idSymbole},  
		             onRequest: function() {  },  
		             onComplete: function(response) { 
						if (response != "-1"){
							updateApercu(response);
						}	
					 }  
	         	}).send();  	
			});
    	} else {
    		linkSymbole.addEvent('click',function(e){
				e.stop();
			  	new Request({  
		             method: 'post',  
		             url: urlPage+"symbole/",  
		             data: { 'idSymbole' : 0},  
		             onRequest: function() {  },  
		             onComplete: function(response) { 
						if (response != "-1"){
							updateApercu(response);
						}	
					 }  
	         	}).send();  	
			});
    	}
	});
	
	$('s4').getElements('a.textButton').each(function(linkEffect){
    	if (linkEffect.hasClass('normal')){
    		linkEffect.addEvent('click',function(e){
				e.stop();  
				new Request({  
		             method: 'post',  
		             url: urlPage+"effect/",  
		             data: { 'effect' : 'no'},  
		             onRequest: function() {
		             	linkEffect.addClass("enabled");
		             	$('s4').getElement('a.sepia').removeClass("enabled");
		             	$('s4').getElement('a.blackwhite').removeClass("enabled");
		             	$('s4').getElement('a.negatif').removeClass("enabled");
	                 },  
		             onComplete: function(response) { 
						if (response != "-1"){
							updateApercu(response);
						}	
					 }  
	         	}).send();  			
    		});
    	}
    	
    	if (linkEffect.hasClass('sepia')){
    		linkEffect.addEvent('click',function(e){
				e.stop();  
				new Request({  
		             method: 'post',  
		             url: urlPage+"effect/",  
		             data: { 'effect' : 'sepia'},  
		             onRequest: function() { 
		             	linkEffect.addClass("enabled");
		             	$('s4').getElement('a.normal').removeClass("enabled");
		             	$('s4').getElement('a.blackwhite').removeClass("enabled");
		             	$('s4').getElement('a.negatif').removeClass("enabled");
		             	
		              },  
		             onComplete: function(response) { 
						if (response != "-1"){
							updateApercu(response);
						}	
					 }  
	         	}).send();  			
    		});
    	}
    	
    	if (linkEffect.hasClass('blackwhite')){
    		linkEffect.addEvent('click',function(e){
				e.stop();  
				new Request({  
		             method: 'post',  
		             url: urlPage+"effect/",  
		             data: { 'effect' : 'grayscale'},  
		             onRequest: function() { 
		             	linkEffect.addClass("enabled");
		             	$('s4').getElement('a.normal').removeClass("enabled");
		             	$('s4').getElement('a.sepia').removeClass("enabled");
		             	$('s4').getElement('a.negatif').removeClass("enabled");
		             	
		              },  
		             onComplete: function(response) { 
						if (response != "-1"){
							updateApercu(response);
						}	
					 }  
	         	}).send();  			
    		});
    		
    	}
    	
    	if (linkEffect.hasClass('negatif')){
    		linkEffect.addEvent('click',function(e){
				e.stop();  
				new Request({  
		             method: 'post',  
		             url: urlPage+"effect/",  
		             data: { 'effect' : 'negative'},  
		             onRequest: function() {
		             	
		             	linkEffect.addClass("enabled");
		             	$('s4').getElement('a.normal').removeClass("enabled");
		             	$('s4').getElement('a.sepia').removeClass("enabled");
		             	$('s4').getElement('a.blackwhite').removeClass("enabled");
		             	
		               },  
		             onComplete: function(response) { 
						if (response != "-1"){
							updateApercu(response);
						}	
					 }  
	         	}).send();  			
    		});
    	}
    	
    	if (linkEffect.hasClass('rotLeft')){
    		linkEffect.addEvent('click',function(e){
				e.stop();  
				new Request({  
		             method: 'post',  
		             url: urlPage+"rotation/",  
		             data: { 'rotation' : 'left'},  
		             onRequest: function() {  },  
		             onComplete: function(response) { 
						if (response != "-1"){
							updateApercu(response);
						}	
					 }  
	         	}).send();  			
    		});
    	}
    	
    	if (linkEffect.hasClass('rotRight')){
    		linkEffect.addEvent('click',function(e){
				e.stop();  
				new Request({  
		             method: 'post',  
		             url: urlPage+"rotation/",  
		             data: { 'rotation' : 'right'},  
		             onRequest: function() {  },  
		             onComplete: function(response) { 
						if (response != "-1"){
							updateApercu(response);
						}	
					 }  
	         	}).send();  			
    		});
    	}
    	
    	if (linkEffect.hasClass('moveUp')){
    		linkEffect.addEvent('click',function(e){
				e.stop();  
				new Request({  
		             method: 'post',  
		             url: urlPage+"position/",  
		             data: { 'position' : 'up'},  
		             onRequest: function() {  },  
		             onComplete: function(response) {
		             	var toModify = JSON.decode(response);
						if (toModify["resp"] != "-1"){
							updateApercu(toModify["resp"]);
						}	
						if (toModify["up"]){
							linkEffect.addClass("enabled");
							linkEffect.removeClass("disabled");
						} else {
							linkEffect.addClass("disabled");
							linkEffect.removeClass("enabled");
						}
						if (toModify["down"]){
							$('s4').getElement('a.moveDown').addClass("enabled");
							$('s4').getElement('a.moveDown').removeClass("disabled");
						} else {
							$('s4').getElement('a.moveDown').addClass("disabled");
							$('s4').getElement('a.moveDown').removeClass("enabled");
						}
					 }  
	         	}).send();  			
    		});
    	}
    	
    	if (linkEffect.hasClass('moveDown')){
    		linkEffect.addEvent('click',function(e){
				e.stop();  
				new Request({  
		             method: 'post',  
		             url: urlPage+"position/",  
		             data: { 'position' : 'down'},  
		             onRequest: function() {  },  
		             onComplete: function(response) { 
						var toModify = JSON.decode(response);
						if (toModify["resp"] != "-1"){
							updateApercu(toModify["resp"]);
						}	
						if (toModify["down"]){
							linkEffect.addClass("enabled");
							linkEffect.removeClass("disabled");
						} else {
							linkEffect.addClass("disabled");
							linkEffect.removeClass("enabled");
						}
						if (toModify["up"]){
							$('s4').getElement('a.moveUp').addClass("enabled");
							$('s4').getElement('a.moveUp').removeClass("disabled");
						} else {
							$('s4').getElement('a.moveUp').addClass("disabled");
							$('s4').getElement('a.moveUp').removeClass("enabled");
						}
					 }  
	         	}).send();  			
    		});
    	}
    	 
	});
	
	var ville = $("inputVille");
	var pays = $("inputPays");
	
	if (ville && pays){
		var autocompleterRecherche = new Autocompleter.Request.JSON(ville, '/villes/autocomplete10/', {
			'indicatorClass': 'autocompleter-loading','filterSubset' : true,'maxChoices':10
		});
		// Our instance for the element with id "demo-word"
		if (pays.value != "FR"){
			$('helperVille').innerHTML = $('contentHelperVilleAutre').innerHTML;
			ville.removeEvents();
		} else {
			$('helperVille').innerHTML = $('contentHelperVilleFR').innerHTML;
		}
		pays.addEvent('change',function(){
			if (pays.value == "FR"){
				$('helperVille').innerHTML = $('contentHelperVilleFR').innerHTML;
				autocompleterRecherche = new Autocompleter.Request.JSON(ville, '/villes/autocomplete10/', {
					'indicatorClass': 'autocompleter-loading','filterSubset' : true,'maxChoices':10
				});
			} else {
				$('helperVille').innerHTML = $('contentHelperVilleAutre').innerHTML;
				ville.removeEvents();
			}
		});
	}
	
	$('s4').getElement('.deleteLink').addEvent('click', function (e){
			e.stop();
			var xpression = new RegExp("delete-(.*)");
	    	res = xpression.exec($('s4').getElement('.deleteLink').id);
	    	if (res && res[1]){
	    		$('s4').getElement('.effects').addClass("dNone");
				new Request({  
		         method: 'post',  
		         url: urlPage+"deletefile/",  
		         data: { 'idPhoto' : res[1]},  
		         onRequest: function() {  },  
		         onComplete: function(response) { 
		         	$('titles42').innerHTML = "Ajouter une photo";
		         	if (response != "-1"){
						updateApercu(response);
		         	}
					$('photo-apercu').src = "/media/public/img/blank.gif";
					$('photo-apercu').height = 10;
					$('deleteLabel').addClass("dNone");
					$('s4').getElement('.deleteLink').addClass("dNone");
				 }  
		 		}).send(); 
	    	}
		
	});
	
	if (!$('photo-apercu').hasClass('dNone')){
		initSliderz(urlPage);
	}
	
	nextArrow.addEvent("click",function(e){
		e.stop();
		hideSelectors();
		step = divControls.getElement(".current").id;
		
		switch(step){
			case "c1" : 
				step1.sendForm("c1","c2",nextArrow,prevArrow);
			break;
			case "c2" :
				nextSlide("c2","c3",nextArrow,prevArrow); 
			break;
			case "c3" : 
				nextSlide("c3","c4",nextArrow,prevArrow); 
			break;
			case "c4" : 
				nextSlide("c4","c5",nextArrow,prevArrow); 
			break;
		}
		
	});
	//prevArrow.addClass('disabled');
	prevArrow.addEvent("click",function(e){
		e.stop();
		
		step = divControls.getElement(".current").id;
		if (step != "c1"){
			xpression = new RegExp("c(.*)");
	    	res = xpression.exec(step);
	    	if (res && res[1]){
	    		stepPrec = res[1] - 1;
				prevSlide(step, 'c'+stepPrec, nextArrow,prevArrow);
	    	}
		}
	});
	
	var lightboxFP = $('fairepart-apercu');
	var lightboxFPFx = new Fx.Tween(lightboxFP, {'link' : 'cancel'});
	lightboxFPFx.set('opacity', '0');
	$('fairepart-apercu').addEvent('click',function(e){
		e.stop();
		lightboxFPFx.start('opacity', '0');	
	});
	
	$$('.tooltipFP').each(function(tooltipGeoLink){
		var content = tooltipGeoLink.get('title').split('::');  
		tooltipGeoLink.store('tip:title', content[0]);  
		tooltipGeoLink.store('tip:text', '');  
	});
	
	var tipz2 = new Tips('.tooltipFP',{  
         className: 'tooltipGeo', 
         hideDelay: 0,  
         showDelay: 0,
         fixed: true,
         offsets : {'x': -60, 'y': -40}
     });  
     tipz2.addEvent('show', function(tip){
     		//tip.fade('0.8');
     		tip.setStyle('opacity', '0.8');
     });
     
	// HACK DEBUG TOOLTIPSFP  && .divSelector
	$$('.divText').each(function(divText){
		divText.addEvent('mouseleave', function(e){
	     	hideFPTips();
	     });
	     if(divText.getElement('input')){
	     	divText.getElement('input').addEvent('mouseenter', function(e){
		     	hideFPTips();
		     });
		     divText.getElement('input').addEvent('focus', function(e){
		     	hideSelectors();
		     });
	     }else if(divText.getElement('textarea')){
	     	divText.getElement('textarea').addEvent('mouseenter', function(e){
		     	hideFPTips();
		     });
		     divText.getElement('textarea').addEvent('focus', function(e){
		     	hideSelectors();
		     });
	     }
	});
    $('sliderflow').addEvent('mouseleave', function(e){
     	hideFPTips();
     	//hideSelectors();
     });
	
    var smoothy = new SmoothScroll({links:'.smooth',duration:500});
    
	$('fairepart-miniature').addEvent('click',function(e){
		
		//e.stop();
		var nobs = $('nobs');
		if(nobs){
			var coords = $('creation').getCoordinates(nobs);
		}else{
			var coords = $('creation').getCoordinates();
		}
		var newSrc = $('fairepart-miniature').src.replace('miniature','apercu');
		lightboxFP.innerHTML = '';
		
		var newA = new Element('a', {
			'href' : '#',
			'class' : 'close'
		}).inject($('fairepart-apercu'));
		
		var newImg = new Element('img', {
			'src' : newSrc,
			'class' : 'cBoth'
		}).inject(lightboxFP);
		
		lightboxFP.setStyles({
			'left': coords.left,
			'top': coords.top,
			'display': 'block',
			'position': 'absolute'
		});
		lightboxFPFx.start('opacity', '1');
	});
	
	
	$('apercuButton2').addEvent('click',function(e){
		e.stop();
		var nobs = $('nobs');
		if(nobs){
			var coords = $('creation').getCoordinates(nobs);
		}else{
			var coords = $('creation').getCoordinates();
		}
		var newSrc = $('fairepart-miniature').src.replace('miniature','apercu');
		lightboxFP.innerHTML = '';
		
		var newA = new Element('a', {
			'href' : '#',
			'class' : 'close'
		}).inject($('fairepart-apercu'));
		
		var newImg = new Element('img', {
			'src' : newSrc,
			'class' : 'cBoth'
		}).inject(lightboxFP);
		
		lightboxFP.setStyles({
			'left': coords.left,
			'top': coords.top,
			'display': 'block',
			'position': 'absolute'
		});
		lightboxFPFx.start('opacity', '1');
	});
	
	
	$('fairepart-apercufinal').addEvent('click',function(e){
		e.stop();
		//if ($('fairepart-apercu').getStyle('display') == 'none'){
			e.stop();
			var nobs = $('nobs');
			if(nobs){
				var coords = $('creation').getCoordinates(nobs);
			}else{
				var coords = $('creation').getCoordinates();
			}
			var newSrc = $('fairepart-miniature').src.replace('miniature','apercu');
			lightboxFP.innerHTML = '';
			
			var newA = new Element('a', {
				'href' : '#',
				'class' : 'close'
			}).inject($('fairepart-apercu'));
			
			var newImg = new Element('img', {
				'src' : newSrc,
				'class' : 'cBoth'
			}).inject(lightboxFP);
			
			lightboxFP.setStyles({
				'left': coords.left,
				'top': coords.top,
				'display': 'block',
				'position': 'absolute'
			});
			lightboxFPFx.start('opacity', '1');
		//}
	});
	if(!$('nobs')){
			var scrollApercu = $('apercuButton2');
			var scrollBase = $('controls').getPosition().y;
			
			var scrollMax = $('slider').getSize().y - 200;
			var scrollFx = new Fx.Tween(scrollApercu, {'link' : 'cancel'});
			var autoscroll = (function(){
				
				curScroll = Window.getScroll().y
				tmpValue = curScroll - scrollBase;
				if(tmpValue<0){
					tmpValue = 0;
				}
				if(tmpValue>scrollMax){
					tmpValue = scrollMax;
				}
				newValue = 30 + tmpValue;
				scrollFx.start('margin-bottom', newValue);		
			}).periodical(1000);
	}	

	
});

function hideFPTips(){
	$$('.tooltipGeo').each(function(tip){
 		tip.setStyle('opacity', '0');
 	});
}

function hideSelectors(){
	$$('.colorPicker').each(function(div){
 		div.setStyle('display', 'none');
 	});
 	$$('.fontSelector').each(function(div){
 		div.addClass('dNone');
 	});
}

function applyStyle(elt, arrStyles, divControls){
	
	
	var weight, style;
	var linkFontBold = divControls.getElement(".fontBold");
	var linkFontItalic = divControls.getElement(".fontItalic");
	var linkAlignLeft = divControls.getElement(".alignLeft");
	var linkAlignCenter = divControls.getElement(".alignCenter");
	var linkAlignRight = divControls.getElement(".alignRight");
	
	linkAlignLeft.removeClass("enabled");
	linkAlignCenter.removeClass("enabled");
	linkAlignRight.removeClass("enabled");
	
	var divColor = divControls.getElement('.fontColor').getElement('div.textSelectorValue');
	divColor.setStyle('background-color','rgb('+arrStyles[2]+')');
	
	var colorr = divColor.style.backgroundColor;
	$(elt.name+"moo").getElements("a").each(function(elt){
		if (elt.style.backgroundColor == colorr){
			elt.addClass('selected');
		} else {
			elt.removeClass('selected');
		}
	});
	
	
	elt.setStyle("text-align",arrStyles[0]);
	switch(arrStyles[0]){
		case "left" : linkAlignLeft.addClass("enabled"); break;
		case "center" : linkAlignCenter.addClass("enabled"); break;
		case "right" : linkAlignRight.addClass("enabled"); break;
	}
	
	elt.setStyle("font-size",arrStyles[1]);
	elt.setStyle("color","rgb("+arrStyles[2]+")");
	
	linkFontBold.removeClass("disabled");
	linkFontItalic.removeClass("disabled");
	linkFontBold.removeClass("enabled");
	linkFontItalic.removeClass("enabled");
	
	switch(arrStyles[4]){
		case "bd" : weight = "bold"; style = "normal"; 
			linkFontBold.addClass("enabled"); 
			linkFontItalic.addClass("disabled");
		break;
		case "bi" : weight = "bold"; style = "italic"; linkFontBold.addClass("enabled"); linkFontItalic.addClass("enabled"); break;
		case "it" : weight = "normal"; style = "italic"; linkFontBold.addClass("disabled"); linkFontItalic.addClass("enabled"); break;
		case "no" : weight = "normal"; style = "normal"; linkFontBold.addClass("disabled"); linkFontItalic.addClass("disabled"); break;  
	}
	elt.setStyle("font-weight",weight);
	elt.setStyle("font-style",style);
	elt.setStyle("background-color","rgb("+arrStyles[5]+")");
}

function updateApercu(src){
	$('fairepart-miniature').src = src+'?'+Math.random();
	$('apercuDiv').highlight('#941FA5');
}

function uploadFinish( idPhoto, imgWidth, imgHeight, response){
	var urlPage = window.location.href;
	if (window.location.href.match("editeur")){
		urlPage = urlPage.replace(/editeur(\/)?/,"");
	}
	if(urlPage.lastIndexOf("#") > 0){
		urlPage = urlPage.substring(0,urlPage.lastIndexOf("#"));
	} 
	var photoApercu = $('photo-apercu');
	photoApercu.src = '/media/faireparts/faireparts/photo/'+idPhoto+".jpg";
	var widthMax = 568;
	var heightMax = 200;
	
	if (imgWidth > widthMax){
		photoApercu.width = widthMax;
		photoApercu.height = imgHeight / (imgWidth / widthMax);
	} else {
		photoApercu.width = imgWidth;
	}
	
	if (imgHeight > heightMax){
		photoApercu.height = heightMax;
		photoApercu.width = imgWidth / (imgHeight / heightMax);
	} else {
		photoApercu.height = imgHeight;
	}
	
	$('titles42').innerHTML = "Retouchez votre photo";
	if ($('bloppu42')){
		$('bloppu42').innerHTML = "Retouchez votre photo et positionnez-la au sein de votre faire-part."
	}
	
	photoApercu.removeClass("dNone");
	$('s4').getElement('p.error').innerHTML = "";
	
	var deleteLink = $('s4').getElement('.deleteLink');
	deleteLink.removeClass("dNone");
	deleteLink.id = "delete-"+idPhoto;
	
	var deleleLabel = $('deleteLabel');
	deleleLabel.removeClass("dNone");
	
	new Request({  
         method: 'post',  
         url: urlPage+"updatefile/",  
         data: { 'idPhoto' : idPhoto},  
         onRequest: function() {  },  
         onComplete: function(response) { 
			updateApercu(response);
		 }  
 	}).send(); 
 	
 	$('s4').getElement('.effects').removeClass("dNone");
 	if (!SliderForRatio){
 		initSliderz(urlPage);
 	}
}

function initSliderz(urlPage){
	
	// Create the new slider instance
	var sliderRatio = $('s4').getElement('.sliderRatio');
	var cursRatio = $('s4').getElement('.cursRatio');
	var xpression = new RegExp("sliderz-(.*)");
	res = xpression.exec(sliderRatio.id);
	
 	SliderForRatio = new Slider(sliderRatio, cursRatio, {
		steps: 10,	// There are 35 steps
		range: [1,10],
		onComplete: function(value){
			new Request({  
		         method: 'post',  
		         url: urlPage+"ratio/",  
		         data: { 'ratio' : value},  
		         onRequest: function() {  },  
		         onComplete: function(response) { 
					if (response != "-1"){
						updateApercu(response);
		         	}
				 }  
	 		}).send(); 	
		}
	});
	
	if (res && res[1]){
		SliderForRatio.setWithoutEndEvent(res[1]);
	} 
	
}

function uploadError(error){
	$('s4').getElement('p.error').innerHTML = error;	
}

function nextSlide(slide1, slide2, nextArrow, prevArrow){
	
	// DEBUG IE
	hideSelectors();
	hideFPTips();
	
	
	if ($(slide2) && $(slide1)){
		
		prevArrow.removeClass('disabled');
		nextArrow.removeClass('disabled');
		
		sideinfo.highlight('#eee');		
		sideinfo.innerHTML = arrInfo[slide2];
		
		
		if(slide2=="c3" || slide2=="c4" || slide2=="c5" ){
		$('step-help2').addClass('dNone');
		}else{
			$('step-help2').removeClass('dNone');
		}
		
		if(slide2=="c3"){
			$('bubble').removeClass('dNone');
		}else{
			$('bubble').addClass('dNone');
		}
		
		if (slide2=="c1"){
			prevArrow.addClass('disabled');	
		}
		if (slide2=="c5"){
			nextArrow.addClass('disabled');	
		}
		
		if (slide2=="c5"){
			$('fairepart-apercufinal').src = $('fairepart-miniature').src.replace('miniature','apercufinal');
		}
		
		$(slide2).addClass('current');
		$(slide1).removeClass('current');
		var controlId = $(slide2).id.substring(1,2);
		newLeft = '-'+(controlId-1)*568+'px';
		SliderCreate.start('left', newLeft);
	}
}

function prevSlide(slide1, slide2, nextArrow, prevArrow){
	
	// DEBUG IE
	hideSelectors();
	hideFPTips();
	
	prevArrow.removeClass('disabled');
	nextArrow.removeClass('disabled');
	
	sideinfo.innerHTML = arrInfo[slide2];
	
	if (slide2=="c1"){
		prevArrow.addClass('disabled');	
	}
	if (slide2=="c5"){
		nextArrow.addClass('disabled');	
	}
	
	if(slide2=="c3" || slide2=="c4" || slide2=="c5" ){
		$('step-help2').addClass('dNone');
	}else{
		$('step-help2').removeClass('dNone');
	}
	
	if ($(slide2) && $(slide1)){
		$(slide2).addClass("current");
		$(slide1).removeClass("current");
		var controlId = $(slide2).id.substring(1,2);
		newLeft = '-'+(controlId-1)*568+'px';
		SliderCreate.start('left', newLeft);
	}
}