function generic_addEventListener(object, event, fun) {
	if (!object.addEventListener && object.attachEvent)
		object.attachEvent('on' + event, fun)
	else
		object.addEventListener(event, fun, false)
}

function generic_preventDefaultEvent(e){
	if (!e) // IE
		e = window.event;
	if (e.preventDefault)
		 e.preventDefault();
	else // IE
		e.returnValue = false;
}

function generic_getTarget(e){
	var target = window.event ? window.event.srcElement : e ? e.target : null;
	while(target.nodeType!=1){
		target=target.parentNode;
	}
	return target;
}

// -----------------------------------------
// -----------------------------------------


function getLabelSibling(input){
	label = input;
	while(label.nodeType!=1 || label.className != "required"){
		label = label.previousSibling;
	}
	return label;
}

function getParentLabel(input){
	label = input;
	while(label.nodeType!=1 || label.nodeName != "LABEL"){
		label = label.parentNode;
	}
	return label;
}

function checkRadio(radios, parentField){
	civErr = false;
	for(k=0; k<radios.length && !civErr; k++)
		civErr = radios[k].checked;
	parentField.style.color = "";
	if(!civErr){
		parentField.style.color = "red";
		return false;
	} else return true;
}

function validateForm1(){
	//Validation Empty Field
	req_field = ["prenom", "nom", "email", "mdp", "mdp2", "address_temp", "zipcode_temp", "town_temp"];
	firstfield	= null;
	for(i=0; i< req_field.length; i++){
		input = document.getElementById(req_field[i]);
		label = getLabelSibling(input);
		label.style.color = "";
		if("" == input.value){
			firstfield = firstfield ? firstfield : input;
			label.style.color = "red";
		}
	}

	//Civilite Validation ( radio elt )
	civRadios = document.getElementsByName("civ");
	civParent = getLabelSibling(civRadios[0]);
	if(!checkRadio(civRadios, civParent) && !firstfield)
		firstfield = civParent;
	var alerte = document.getElementById('alert');
	//Missing field ?
	if (null != firstfield) {
		alerte.style.display = 'inline';
		alerte.innerHTML = "Merci de remplir tous les champs obligatoires";
		alert("Merci de remplir les champs obligatoires.");
		firstfield.focus();
		return false;
	} else {
		alerte.style.display = 'none';
	}
	var mail = document.getElementById('mailalert');
	var pass = document.getElementById('passalert');
	var pass2 = document.getElementById('pass2alert');
	//Email Validation
	emailField = document.getElementById('email');
	if(!emailField.value.match(/\b[A-Z0-9._%+-]+@[A-Z0-9.-]+\.[A-Z]{2,4}\b/i)){
		label = getLabelSibling(emailField);
		label.style.color = "red";
		alert("Le mail n'est pas au bon format !");
		mail.style.display = 'inline';
		mail.innerHTML = "Le mail n'est pas au bon format !";
		emailField.focus();
		return false;
	} else{
		mail.style.display = 'none';
	}

	//Passwords Validation
	mdp1 = document.getElementById('mdp');
	mdp2 = document.getElementById('mdp2');
	if(mdp1.value != mdp2.value){
		getLabelSibling(mdp1).style.color = "red";
		getLabelSibling(mdp2).style.color = "red";
		mdp1.value = "";
		mdp2.value = "";
		alert("Les mots de passe ne sont pas identiques !");
		pass.style.display = 'inline';
		pass.innerHTML = "Les mots de passe ne sont pas identiques !";
		pass2.style.display = 'inline';
		pass2.innerHTML = "Les mots de passe ne sont pas identiques !";
		mdp1.focus();
		return false;
	} else{
		pass.style.display = 'none';
		pass2.style.display = 'none';

	}

	var cpAlert = document.getElementById('cpalert');
	//cp Validation
	cpField = document.getElementById('zipcode_temp');
	if(isNaN(cpField.value) || cpField.value.length < 5){
		label = getLabelSibling(cpField);
		label.style.color = "red";
		alert("Le code postal n'est pas au bon format !");
		cpAlert.style.display = 'inline';
		cpAlert.innerHTML = "Le code postal n'est pas au bon format !";
		cpField.focus();
		return false;
	} else{
		cpAlert.style.display = 'none';
	}

	return true;
}

function validateForm2(){
	firstfield	= null;
	arDateChildField = ['ddn_j', 'ddn_m', 'ddn_y'];

	num = parseInt(document.getElementById('nbEnfants').value);
	var alerte = document.getElementById('alert2');
	for(i=1; i<=num; i++){
		//Optins Menu Semaine Enfant
		radioFields = document.getElementsByName("optin_menu"+i);
		parentField = getLabelSibling(radioFields[0].parentNode.parentNode);
		if(!checkRadio(radioFields, parentField) && !firstfield)
			firstfield = parentField;

		//Sexe Field
		radioFields = document.getElementsByName("sexe_enfant"+i);
		parentField = getLabelSibling(radioFields[0]);
		if(!checkRadio(radioFields, parentField) && !firstfield)
			firstfield = parentField;

		//Date Fields
		document.getElementById(arDateChildField[0]+i).parentNode.style.color = "";
		for(j=0; j<arDateChildField.length; j++){
			input = document.getElementById(arDateChildField[j]+i);
			label = input.parentNode;
			if("" == input.value){
				firstfield = firstfield ? firstfield : input;
				label.style.color = "red";
			}
		}

		//Prenom
		input = document.getElementById('prenomEnf'+i);
		label = getParentLabel(input);
		label.style.color = "";
		if("" == input.value){
			firstfield = firstfield ? firstfield : input;
			label.style.color = "red";
		}
	}

	//Simple Optin Fields
	optinFields = ['optin_blediclub', 'optin_mail', 'optin_partenaire'];
	for(i=0; i<optinFields.length; i++){
		radioFields = document.getElementsByName(optinFields[i]);
		parentField = getLabelSibling(radioFields[0]);
		if(!checkRadio(radioFields, parentField) && !firstfield)
			firstfield = parentField;
	}

	//Adresse Field if Mail Optin
	if(document.getElementById('optin_mail_yes').checked){
		adr_fields = ['address', 'zipcode', 'town'];
		for(i=0; i<adr_fields.length; i++){
			input = document.getElementById(adr_fields[i]);
			label = getParentLabel(input);
			label.style.color = "";
			if("" == input.value){
				firstfield = firstfield ? firstfield : input;
				label.style.color = "red";
			}
		}
	}

	mentions = document.getElementById('mentions');
	mentions.parentNode.parentNode.style.color = '';
	if(!mentions.checked){
		mentions.parentNode.parentNode.style.color = 'red';
		firstfield = mentions;
	}

	if (null != firstfield) {
		alerte.style.display = 'inline';
		alerte.innerHTML = "Merci de remplir tous les champs obligatoires";
		alert("Merci de remplir les champs obligatoires.");
		firstfield.focus();
		return false;
	}else {
		alerte.style.display = 'none';
	}

	return true;
}


function createEnfantForm(domToDuplicate, lastChildNum){
	if(domToDuplicate != ''){
		html = domToDuplicate;
		html = html.replace(new RegExp('prenomEnf'+lastChildNum,"gi"), 'prenomEnf'+(parseInt(lastChildNum)+1));
		html = html.replace(new RegExp('ddn_j'+lastChildNum,"gi"), 'ddn_j'+(parseInt(lastChildNum)+1));
		html = html.replace(new RegExp('ddn_m'+lastChildNum,"gi"), 'ddn_m'+(parseInt(lastChildNum)+1));
		html = html.replace(new RegExp('ddn_y'+lastChildNum,"gi"), 'ddn_y'+(parseInt(lastChildNum)+1));
		html = html.replace(new RegExp('sexe_enfant'+lastChildNum,"gi"), 'sexe_enfant'+(parseInt(lastChildNum)+1));
		html = html.replace(new RegExp('style="color: red',"gi"), 'style="');
		div = document.createElement('div');
		div.className = 'enfant';
		div.id = 'enfant' + (parseInt(lastChildNum)+1);
		div.innerHTML = html;
		return div;
	} else return domToDuplicate;
}


function validGlobal() {

	valid	= (validateForm1() && validateForm2());
	return valid;
}

function openOnglet1Load() {
	var onglet1 = document.getElementById('onglet1');
	var onglet2 = document.getElementById('onglet2');
	onglet1.style.display = "";
	onglet2.style.display = "none";
	document.getElementById('onglet1_button').firstChild.src = 'img/images/onglets-coordonnees-on.jpg';
	document.getElementById('onglet2_button').firstChild.src = 'img/images/onglets-avantages-off.jpg';
	document.getElementById('onglet3_button').firstChild.src = 'img/images/onglets-avantages-blediclub-on.jpg';
	document.getElementById('fieldset_bottom_page2').style.display = 'none';
	document.getElementById('topOnglet2').style.display = 'none';
	document.getElementById('fieldset_bottom').style.display = '';

}

function openOnglet1() {
	tagonglet1();
	openOnglet1Load();
//	document.getElementById('inscription').scrollIntoView();
}

function openOnglet2() {
	tagonglet2();
	var onglet1 = document.getElementById('onglet1');
	var onglet2 = document.getElementById('onglet2');
	onglet2.style.display = "";
	onglet1.style.display = "none";
	document.getElementById('onglet1_button').firstChild.src = 'img/images/onglets-coordonnees-off.jpg';
	document.getElementById('onglet2_button').firstChild.src = 'img/images/onglets-avantages-on.jpg';
	document.getElementById('onglet3_button').firstChild.src = 'img/images/onglets-avantages-blediclub-off.jpg';
	document.getElementById('fieldset_bottom').style.display = 'none';
	document.getElementById('fieldset_bottom_page2').style.display = '';
	document.getElementById('topOnglet2').style.display = '';
	document.getElementById('inscription').scrollIntoView();
}

function createRadioInput(id, fieldName, value){
	var name = navigator.appName;
	if (name == "Microsoft Internet Explorer")
	{
		input = document.createElement('<input type="radio" id="' + id + '" name="' + fieldName + '" value="' + value + '" class="radio">');
	}else {
	input = document.createElement('input');
	input.name = fieldName;
	input.setAttribute('id', id);
	input.setAttribute('value', value);
	input.setAttribute('type', 'radio');
	input.className = 'radio';
	}
	return input;
}

function createLabel(target, text){
	label = document.createElement('label');
	label.setAttribute('for', target);
	label.appendChild(document.createTextNode(text));
	return label;
}

function addEnfantOptin(lastChildNum){
	span = document.createElement('span');
	span.id = 'optin_child'+(lastChildNum+1);
	span.appendChild(document.createTextNode('Enfant '+(lastChildNum+1) + ': '));
	span.appendChild(createRadioInput('optin_menu'+(lastChildNum+1)+'_yes', 'optin_menu'+(lastChildNum+1), 1));
	span.appendChild(createLabel('optin_menu'+(lastChildNum+1)+'_yes', 'Oui'));
	span.appendChild(createRadioInput('optin_menu'+(lastChildNum+1)+'_no', 'optin_menu'+(lastChildNum+1), 0));
	span.appendChild(createLabel('optin_menu'+(lastChildNum+1)+'_no', 'Non'));
	document.getElementById('optins_menu').appendChild(span);
}

function removeEnfantOptin(lastChildNum){
	document.getElementById('optins_menu').removeChild(document.getElementById('optin_child'+lastChildNum));
}

generic_addEventListener(window, 'load', function(e){

	var onglet1 = document.getElementById('onglet1');
	var onglet2 = document.getElementById('onglet2');

	initAutoComplete(
		document.getElementById('inscription'),
		document.getElementById('email'),
		document.getElementById('onglet2_link')
	);

//	onglet2.style.display = "none";
	openOnglet1Load();

	if(document.getElementById('optin_mail_yes').checked)
		document.getElementById('adress_optin_mail').style.display = "block";
	else document.getElementById('adress_optin_mail').style.display = "none";

	//Event Form Submit
	generic_addEventListener(document.getElementById('inscription'), 'submit', function(e){
		if(!validGlobal()) generic_preventDefaultEvent(e);
	});

	//Event Navigation Onglets
	generic_addEventListener(document.getElementById('onglet1_button'), 'click', function(e){
		openOnglet1();
	});
	generic_addEventListener(document.getElementById('onglet2_link'), 'click', function(e){
		var alerte = document.getElementById('alert');
		if(validateForm1())
		{
			alerte.style.display = 'none';
			openOnglet2();


		} else {

			alerte.style.display = 'inline';
			alerte.innerHTML = "Merci de remplir tous les champs obligatoires";

		}

	});
	generic_addEventListener(document.getElementById('onglet2_button'), 'click', function(e){

		if(validateForm1())
		{

			openOnglet2();


		}
	});
	generic_addEventListener(document.getElementById('onglet3_button'), 'click', function(e){
		openOnglet1();
	});

	//Event Add Children
	generic_addEventListener(document.getElementById('nbEnfants'), 'change', function(e){
		enfantsParentNode = document.getElementById('enfants');
		enfantsNodes = document.getElementById('enfants').childNodes;
		arEnfants = [];
		nbEnfant = 0;
		lastChild = '';

		for(i=0; i<enfantsNodes.length; i++){
			if(enfantsNodes[i].nodeType==1 && enfantsNodes[i].className == "enfant"){
				++nbEnfant;
				arEnfants[arEnfants.length] = enfantsNodes[i];
				lastChild = enfantsNodes[i].innerHTML;
			}
		}

		num = parseInt(document.getElementById('nbEnfants').value);
		if(num > nbEnfant){
			for(i=nbEnfant; i<num; i++){
				lastChild = createEnfantForm(lastChild, i);
				if(lastChild){
					enfantsParentNode.appendChild(lastChild);
					lastChild = lastChild.innerHTML;
					document.getElementById('prenomEnf'+(i+1)).value = '';
					document.getElementById('ddn_j'+(i+1)).value = '';
					document.getElementById('ddn_m'+(i+1)).value = '';
					document.getElementById('ddn_y'+(i+1)).value = '';
					document.getElementById('ddn_y'+(i+1)).value = '';
					addEnfantOptin(i);
				}
			}
		} else if(num < nbEnfant){
			for(i=num; i<nbEnfant; i++){
				enfantsParentNode.removeChild(arEnfants[i]);
				removeEnfantOptin(i+1);
			}
		}
	});

	//Event Display Mail Optin
	generic_addEventListener(document.getElementById('optin_mail_yes'), 'click', function(e){
		if(document.getElementById('pays').value != 1){
			alert('Désolé, vous ne pouvez souscrire aux Courriers Personnalisés car vous n’habitez pas en France métropolitaine.');
			document.getElementById('optin_mail_no').checked = "checked";
		} else document.getElementById('adress_optin_mail').style.display = "block";
	});

	generic_addEventListener(document.getElementById('optin_mail_no'), 'click', function(e){
		document.getElementById('adress_optin_mail').style.display = "none";
	});

	generic_addEventListener(document.getElementById('pays'), 'change', function(e){
		if(document.getElementById('pays').value != 1 && document.getElementById('optin_mail_yes').checked){
			openOnglet2();
			alert('Attention, vous ne pouvez souscrire aux Courriers Personnalisés car vous n’habitez pas en France métropolitaine.');
			document.getElementById('optin_mail_no').checked = "checked";
			document.getElementById('adress_optin_mail').style.display = "none";
			document.getElementById('adress_optin_mail').focus();
		}
	});

	//Events Sync Address Fields
	document.getElementById('pays_temp').value = 'France métropolitaine';
	adressFields = ['address_temp', 'zipcode_temp', 'town_temp', 'address', 'zipcode', 'town'];
	for(i=0; i<adressFields.length; i++){
		generic_addEventListener(document.getElementById(adressFields[i]), 'change', function(e){
			field = generic_getTarget(e);
			if(field.id.search('_temp') > 0)
				idRealField = field.id.replace('_temp', '');
			else idRealField = field.id + '_temp';
			document.getElementById(idRealField).value = field.value;
		});
	}
});