var MyUtils = {
	replace: function(element, type){
		var replace = new Element('input', {name: element.name,type:type, value: element.value });
		element = $(element);
		element.up().replaceChild(replace, element);
		
		return $(replace);
	}
}
Element.addMethods(MyUtils);

var Textbox = Class.create();
Object.extend(
	Object.extend(Textbox.prototype, Abstract.prototype),{
		initialize: function(target, options) {
			var form = $(target);
			this.target = form.getInputs( options.type , options.field)[0];
			this.text  = options.text;
			this.field = options.field;
			this.events = {
				change: this.change.bind(this)
			}
			this.addObservers();
		},
		addObservers: function() {
			this.target.observe('focus', this.events.change);
			this.target.observe('blur', this.events.change);
		},
		change: function(e) {
			var element = Event.element(e);
			if(e.type == 'focus' && $F(element) == this.text){
				if( this.field == "password" ){
				    element.stopObserving('blur', this.events.change);
					element = element.replace('password');
				    element.observe('blur', this.events.change);
				    element.focus();
				}
				element.clear();
			}
			if(e.type == 'blur' && $F(element) == ""){
				if(this.field == "password" ){
				    element.stopObserving('focus', this.events.change);
					element = element.replace('text');
				    element.observe('focus', this.events.change);
				}
				element.value = this.text;
			}
		}
	}
);
addLoadEvent(function(){
	if(typeof Textbox == "function"){
		gebruikersnaam = new Textbox(
			'cv_update',{
				field: 'name',
				text: 'gebruikersnaam...',
				type: 'text'
				}
			);
		wachtwoord = new Textbox(
			'cv_update',{
				field: 'password',
				text: 'wachtwoord...',
				type: 'text'
				}
			);

	}
});