window.addEvent('domready', function() {
	//set forms (auto clear input and check)
	$$('form').each(function(e) {
		new jpForm(e, {valuesToConsiderNull: ['ENTER YOUR NAME', 'ENTER YOUR EMAIL ADDRESS', 'ENTER YOUR POSTCODE']});
	});
});

var jpForm = new Class({
	form: null,
	fields: [],
	options: {
		autoClear: true,
		valuesToConsiderNull: []
	},
	initialize: function(form, options) {
		this.form = $(form);
		if (!this.form) return;
		this.setOptions(options);
		
		//get all fields
		this.form.getElements('input').each(function(e) {
			this.fields.push(new jpField(e, this.options));
		}, this);
		
		//submit event
		this.form.addEvent('submit', function(evt) {this.fireEvent('submit', evt)}.bindWithEvent(this));
		this.addEvent('submit', function(evt) {this.submit(evt)}.bindWithEvent(this));
	},
	submit: function(evt) {
		//check fields
		var checked = true;
		for (var i = 0; i < this.fields.length; i++) {
			checked *= this.fields[i].check();
		}
		if (checked) {
			for (var i = 0; i < this.fields.length; i++) {
				this.fields[i].clearNullFields();
			}
		}
		else {
			new Event(evt).stop();
			var msgText = 'Please fill in all the required fields.';
			alert(msgText);
	//		var msg = new Element('div', {id: 'jpFrmMessage'}).appendText(msgText);
	//		msg.injectTop(frm);
	//		new Fx.Scroll(window, {wheelStops: false, duration: 100}).toElement(frm);
		}
	}
});
jpForm.implement(new Options, new Events);

var jpField = new Class({
	element: null,
	cleared: false,
	initialValue: '',
	options: {
		autoClear: true,
		valuesToConsiderNull: [], //those values will be considered null
		requiredClass: 'jpFrmRequired',
		errorClass: 'jpFrmError',
		emailClass: 'jpFrmEmail',
		numericClass: 'jpFrmNumeric'
	},
	initialize: function(element, options) {
		this.element = $(element);
		if (!this.element) return;
		this.setOptions(options);
		
		this.initialValue = this.element.value;
		
		var inputType = this.element.getAttribute('type');
		if (this.options.autoClear && (inputType == 'text' || inputType == 'password' || !inputType)) {
			this.element.addEvent('focus', function() {
				this.clearDefault();
			}.bind(this));
			this.element.addEvent('blur', function() {
				this.setToDefault();
			}.bind(this));
		}
	},
	getValue: function() {
		var value = this.element.value;
		var i = 0;
		while (i < this.options.valuesToConsiderNull.length) {
			if (value == this.options.valuesToConsiderNull[i]) {
				value = '';
				break;
			}
			i++;
		}
		return value;
	},
	clearNullFields: function() {
		this.element.value = this.getValue();
	},
	isRequired: function() {
		return this.element.hasClass(this.options.requiredClass);
	},
	check: function() {
		var checked = true;
		if (this.isRequired()) {
			switch (this.element.getAttribute('type')) {
				case 'text':
				case 'password':
				case 'textarea':
				case 'file':
				case null:
					checked = this.getValue() != '';
					if (checked) {
						if (this.element.hasClass(this.options.emailClass)) {
							checked = this.getValue().match(/.+\@.+\..+/) ? true : false;
						}
						else if (this.element.hasClass(this.options.numericClass)) {
							checked = this.getValue().match(/\d+/) ? true : false;
						}
					}
					break;
			}
		}
		
		if (!checked) {
			// highlight field
			this.element.addClass(this.options.errorClass);
		}
		else {
			this.element.removeClass(this.options.errorClass);
		}
		return checked;
	},
	clearDefault: function() {
		if (this.element && !this.cleared) {
			this.element.value = '';
		}
		this.cleared = true;
	},
	setToDefault: function () {
		if (this.element.value == '') {
			this.element.value = this.initialValue;
			this.cleared = false;
		}
	}
});
jpField.implement(new Options);