var messages = {
	generalError: "Certains champs sont manquants ou invalides.<br />Veuillez vérifier les points suivants et soumettre de nouveau.",
	textError:    "Veuillez entrer le champ",
	checkedError: "Veuillez sélectionner"
};


/*
 * Bind against first form and perfom validation; the form must follow the rule
 * that every fields must have a 'name' with a matching 'id', the element
 * referenced by this 'id' gets an 'error' class.
 */


function $(id) {
	return document.getElementById(id);
}
function hasClass(ele, cls) {
	if (ele) {
		return ele.className.match(new RegExp('(\\s|^)' + cls + '(\\s|$)'));
	}
}
function addClass(ele, cls) {
	if (ele) {
		if (!this.hasClass(ele, cls)) ele.className += " " + cls;
	}
}
function removeClass(ele, cls) {
	if (hasClass(ele, cls)) {
		var reg = new RegExp('(\\s|^)' + cls + '(\\s|$)');
		ele.className=ele.className.replace(reg, ' ');
	}
}

/**
 * "label" element associated with a given form element.
 * It first try to find a matching label, else the element with an id matching
 * the name attr.  The label text is taken from the title attr (allowing to
 * override too long or ugly text) or node text content.
 */
function findLabel(name) {
	var label;
	var labels = document.getElementsByTagName('label');
	
	for (var i = 0; i < labels.length; i++) {
		var fo = labels[i].getAttribute('for')  || labels[i].getAttribute('htmlFor');
		if (fo == name) {
			label = labels[i];
			break;
		}
	}
	if (!label) {
		label = document.getElementById(name);
	}
	return label;
}

/**
 * Error message for given form element.
 */
function errorMsg(e) {
	var msg = ( e.type == 'radio' || e.type == 'checkbox' ) ? messages.checkedError : messages.textError;
	var label = findLabel(e.name);
	label = label.title || label.innerHTML.replace(/\s*[?\*]*\s*[?:]\s*$/, '').toLowerCase();
	return msg + ' <a href="#' + e.name + '" onclick="$(\'' + e.id + '\').focus();return false;">' + label + '</a>.';
}
/**
 * Error message for given form element.
 */
function errorMsgPopup(e) {
	var msg = ( e.type == 'radio' || e.type == 'checkbox' ) ? messages.checkedError : messages.textError;
	var label = findLabel(e.name);
	label = label.title || label.innerHTML.replace(/\s*[?\*]*\s*[?:]\s*$/, '').toLowerCase();
	return msg + ' ' + label;
}

/**
 * True if the form element is valid.
 * This function is used to validate all fields;
 * basically every visible fields are required.
 */
function isValid(e) {
	if(hasClass(e, 'novalidation')){
		return true
	}
	
	if ( e.scrollWidth == 0 ) {
		return true;
	}
	if (e.type == 'text') {
		e.onblur = validate;
		if ((e.maxLength > 0 && e.maxLength < 5 && e.value.length != e.maxLength) || e.value.length < 2 || e.maxLength == 18 && e.value.length != e.maxLength) {
			return false;
		}
		if(hasClass(e, 'globetrotter')){
			if(e.value.indexOf("@") >= 0){
				return false;
			}
		}
	} else if (e.type == 'checkbox' || e.type == 'radio') {
		// elements have already a toogleExtra listener
		e.onclick = function(evt){
			validate.apply(this,[evt]);
		}; 

		var elems = e.form[e.name].length ? e.form[e.name] : [ e ];
		for (var i = 0; i < elems.length; i++) {
			if (elems[i].checked) {
				return true;
			}
		}
		return false;
	}
	// additional validation
	if (e.name.match(/courriel/) && !e.value.match(/^.+@.+\..+$/)) {
		return false;
	}
	if (e.name.match(/postal/) && !(e.value.match(/\w\d\w/i) || e.value.match(/\d\w\d/i) )) {
		return false;
	}
	if (e.name.match(/telephone/) && !e.value.match(/^\d+$/)) {
		return false;
	}
	
	return true;
}

/**
 * Validate all fields and display error message.
 * The validate function can be binded to form or form elements.
 */
function validate(form) {
	if ( typeof validate.errors == 'undefined' ) validate.errors = { };
	var elems = form.elements || [ form ];
	
	// validate all fields
	for (var i = 0; i < elems.length; i++) {
		validate.errors[ elems[i].name ] = isValid(elems[i]) ? null : errorMsg(elems[i]);
	}

	// format error messages and display them on page
	errorsList.innerHTML = '';

	for (var name in validate.errors) {
		var label = findLabel(name);
		if (validate.errors[name]) {
			addClass(label, 'error');
			errorsList.innerHTML += '<p class="no_color">' + validate.errors[name] + '</p>';
		} else {
			removeClass(label, 'error');
		}
	}
	errorsDiv.style.display = errorsList.innerHTML ? 'block' : 'none';
	if (form.elements) {
		// return bool for form to stop submit on errors (preventDefault and stopPropagation)
		return errorsList.innerHTML == '';
	}
}

/**
 * Validate all fields and display error message.
 * The validate function can be binded to form or form elements.
 */
function validatePopup(form) {
	if ( typeof validate.errors == 'undefined' ) validate.errors = { };
	var elems = form.elements || [ form ];
	
	// validate all fields
	for (var i = 0; i < elems.length; i++) {
		validate.errors[ elems[i].name ] = isValid(elems[i]) ? null : errorMsgPopup(elems[i]);
	}

	// format error messages and display them on page
	errorsList.innerHTML = '';

	for (var name in validate.errors) {
		if (validate.errors[name]) {
			alert(validate.errors[name]);
			return false;
		}
	}
	
	return true;
}


/*
 *
 */

addClass(document.body, 'has_js');
//document.formPrincipal.onsubmit = validate(document.formPrincipal);

// build up error element globals
var errorsDiv = document.createElement('div');
var errorsList = document.createElement('div');
errorsDiv.className = 'errors';
errorsDiv.style.display = 'none';
errorsDiv.innerHTML = '<p>' + messages.generalError + '</p>';
errorsDiv.appendChild(errorsList);
document.getElementById('buttons').insertBefore(errorsDiv, document.getElementById('buttons').firstChild);

// bind behavior on "extra" fields
/*var inputs = document.getElementsByTagName('input');
for (var i = 0; i < inputs.length; i++) {
	var e = inputs[i];
	if (!hasClass(e, 'extra')) {
		continue;
	}
	var elems = e.form[e.name].length && e.type == "radio" ? e.form[e.name] : [ e ];
	for (var j = 0; j < elems.length; j++) {
		elems[j].onclick = function (evt) {ToggleExtra.apply(this, [evt])};
	}
}

function ToggleExtra (evt) {
	var div = document.getElementById(this.name + '_extra');
	var ta = document.getElementById(this.name + '_x');
	if (div && ta) {
		div.style.display = ( hasClass(this, 'extra') && this.checked ) ? 'block' : 'none';
		( hasClass(this, 'extra') && this.checked && ta.type != 'textarea') ? addClass(ta, 'toValidate') : removeClass(ta, 'toValidate');
	}
}*/
