Colourways.Form = new Class({

    element: null,

    validator: null,
	
	advice: null,

    /**
     * Wraps around a HTML Form element and adds validation and advise.
     * @param {Form} element
     */
    initialize: function(element) {
		this.element = element;
		this.validator = new FormValidator(element, {
			onElementPass: this.valid.bind(this),
			onElementFail: this.invalid.bind(this),
			serial: false,
			ignoreHidden: true,
			ignoreDisabled: true
		});
		
		// Check for any validators, if so, add the advice
		var elements = this.element.getElements("input").extend(this.element.getElements("textarea"));
		elements = elements.filter(function(item) {
			for (var key in FormValidator.validators) {
				if (item.hasClass(key)) {
					return true;
				}
			}
			return false;
		});
	},
	
	valid: function(element) {
		if (element.message) {
			element.message.nix();
			element.message = null;
		}
	},
	
	invalid: function(element, validators) {
		if (!element.message) {
			element.message = new Element("div", {
				"class": "validationMessage"
			});
			element.message.setStyle("display", "none");
			element.message.inject(element.getParent());
		}
		element.message.innerHTML = "";
		for (var i = 0; i < validators.length; i++) {
			var validator = FormValidator.validators[validators[i]];
			element.message.innerHTML += "<p>" + validator.getError() + "</p>"
		}
		element.message.reveal();
	}
});

window.addEvent("load" , function() {
	var forms = $$("form");
	for (var i = 0; i < forms.length; i++) {
		new Colourways.Form(forms[i]);
	}
});


