if(typeof(mylo) == "undefined") var mylo = {};
if(!mylo.ux) mylo.ux = {};
mylo.ux.forms={};
mylo.ux.forms.hints = new Class({
	initialize: function() {
		var elms = $ES(".hint");
		mylo.ux.forms.hints.bindTo(elms);
		for(var i=0;i<elms.length;i++)
			this.fixForms(elms[i].form);
	},
	fixForms:function(form) {
		var form = $(form);
		if(form.hasClass("hasHints")) return;
		
		form.addEvent("submit",function() {
			var hintFields = $(this).getElementsBySelector(".hint");
			for(var i=0;i<hintFields.length;i++)
				if(hintFields[i].getValue() == hintFields[i].title) {
						hintFields[i].value = "";
				}
		});
	}
});
mylo.ux.forms.hints.bindTo = function(elms) {
	if($type(elms) == "object") {
		var elms = new Array(this);
	}
	for(var i=0;i<elms.length;i++) {
		var obj = $(elms[i]);
		if(obj.getProperty("title") != "" && (obj.getValue() == "" || obj.value == "" || obj.getValue() == obj.getProperty("title"))) {
				obj.setStyle("color","#aaaaaa");
				obj.value = obj.title;
				obj.addEvent("focus",function() {
					if(this.value == this.title) { 
						this.setStyle("color","");
						this.removeClass("active");
						this.value = "";
					}
				});
				obj.addEvent("blur",mylo.ux.forms.hints.bindTo.bindWithEvent(obj));
				
				obj.addClass("active");
		}
	}
};

/* mylo.ux.forms */
window.addEvent("domready",function() {
	new mylo.ux.forms.hints();
});