


REGEX_AUTO_FIELD  = /^[^_]+(_Req)?(_(Tel|Email|Url|Date))?$/;
REGEX_BLANK       = /^\s*$/;
REGEX_EMAIL       = /^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-]{2,})+\.)+([a-zA-Z0-9]{2,})+$/;
REGEX_TEL         = /^([0-9]*\-?\ ?\/?[0-9]*)$/;
REGEX_URL         = /^(http|ftp|https):\/\/[\w\-_]+(\.[\w\-_]+)+([\w\-\.,@?^=%&:/~\+#]*[\w\-\@?^=%&/~\+#])?/;
REGEX_DAY         = /^(0?[1-9]|[1-2][0-9]|3[01])$/;
REGEX_MONTH       = /^(0?[1-9]|1[0-2])$/;
REGEX_YEAR        = /^[0-9]{2,4}$/;
REGEX_TYPED_FIELD = /_(Tel|Email|Url|Date)$/;

var Protoform = Class.create({

initialize: function(form, options) {	  	
	this.options = {
      		ajax: true
    	}
		Object.extend(this.options, options || {});
	this.form      		= $(form);
	this.formProcess 	= this.checkForm.bindAsEventListener(this);
	this.form.observe("submit", this.formProcess );
	this.hoverFocus();
},

hoverFocus: function() { 
 	this.form.select('input', 'textarea').each(function(item) {
    	Event.observe(item,'focus',function() {
      		Element.addClassName(this,'hoverfocus');
    	}.bind(item));
    	Event.observe(item,'blur',function() {
      		Element.removeClassName(this,'hoverfocus');
    	}.bind(item));
	});
},
	
checkForm: function(event) { 
	Event.stop(event);
    var errors	= '';
    var faulty	= null;
	if ($('response')) { $('response').remove(); }
	this.form.getElements().each(function(formElements) {
		var value 			= $F(formElements);
		var typedfield 		= formElements.id.match(REGEX_TYPED_FIELD);
		var errormessage	= formElements.readAttribute('title');
		if (!formElements.id.match(REGEX_AUTO_FIELD)) {
            return;
		}    	
		if (formElements.id.match(/_Req/) && value.match(REGEX_BLANK)) {
            errors += '<li>' + errormessage + '</li>';
            faulty = faulty || formElements;
            return;
        }
		if (typedfield  && !value.match(REGEX_BLANK)) {
	    	var type = typedfield[1];		
	    	var error = this.checkField(value, type);
	    	if (error) {
				errors += '<li>' + errormessage + '</li>';
				faulty = faulty || formElements;
	    	}
		}
	}.bindAsEventListener(this));
	if (errors==0) {
		if (this.options.ajax){
			this.sendData(); 
			return;
		}
		else {
			this.form.submit();				
			return;
		}
	}
	if (!$('error')) {	
		this.form.insert({after:'<ul id=\"error\">' + errors + '</ul>'});
	} 
	else {
		$('error').replace('<ul id=\"error\">' + errors + '</ul>');	
	}
	faulty.focus();
},
	
checkField: function (value, type) {
	switch (type) {
		case 'Tel':
			var phone= value;
			if (!phone.match(REGEX_TEL)) { return true; }     
			break;
		case 'Email':
			var address= value;
			if (!address.match(REGEX_EMAIL)) { return true; }     
			break;
		case 'Url':
			var resource= value;
			if (!resource.match(REGEX_URL)) { return true; }
			break;
		case 'Date':
			var comps = value.split('/');
        	if (3 != comps.length || !comps[0].match(REGEX_DAY) || !comps[1].match(REGEX_MONTH) || !comps[2].match(REGEX_YEAR)) { return true; }
			break;
		default:
			return null;
	}

}.bind(this), 
	
sendData: function(event) {
	var url 	= this.form.readAttribute('action');
	var reqType	= this.form.readAttribute('method');
	var pars 	= this.form.serialize();
	var myAjax 	= new Ajax.Request( url, { method: reqType, parameters: pars, onCreate: this.showLoad.bind(this), onComplete: this.getResponse.bind(this) });
},
	
showLoad: function() {
	this.form.insert({after:'<p id="working"><img src="../images/loading.gif"></p>'});
	if ($('error')) { $('error').remove(); }
},
	
getResponse: function(transport) {
	$('working').remove();
	var newData = transport.responseText;
	this.form.insert({after:newData}).reset();
}	
  
}); 
