var dwAvailabilityChecker = new Class({

	//implements
	Implements: [Options],

	//options
	options: {
		trigger: 'keyup',
		offset: { x:0, y:0 },
		element: '',
		minLength: 5,
		availableClass: 'available',
		takenClass: 'taken',
		availableImage: '',
		takenImage: '',
		url: 'ajax-username-check.php'
	},
	
	//initialization
	initialize: function(options) {
		//set options
		this.options = $merge(this.options, options);
		
		//validate it
		this.validate();
	},
	
	//a method that does whatever you want
	validate: function() {
			// IE
		 if (typeof document.attachEvent != 'undefined') {
			 var attachEventUser = function() {
				this.checkUser();
			}.bind(this);
			 
			 this.options.element.attachEvent("onkeyup", attachEventUser);
		 } else {
			 // FF
			 this.options.element.addEventListener(this.options.trigger,function() {
				this.checkUser();
			}.bind(this), false);
		 }
	},
	
	checkUser: function () {
		if(this.options.element.value.length >= this.options.minLength) {
			var othis = this;
			var data = othis.options.element.id + "=" + othis.options.element.value;
			var ajax = new Ajax(
				othis.options.url,
				{
					method: 'get',						
					data: {
					username: othis.options.element.value
					},
					onRequest: function() {
					//remove existing classes
					othis.options.element.removeClass(othis.options.availableClass).removeClass(othis.options.takenClass);
					},
					onComplete: function(response) {
						//add class
						othis.options.element.addClass(response == 1 ? othis.options.availableClass : othis.options.takenClass);
						othis.injectImage(response == 1 ? othis.options.availableImage : othis.options.takenImage);
					}
				}
			).send(othis.options.url, data);
		}
	},
		
	//adds the image
	injectImage: function(image) {
		
		//figure out its position
		var pos = this.options.element.getCoordinates();
		
		var img = new Element('img',{
			src: image,
			styles: {
				'z-index': 100000,
				'position': 'absolute',
				'top': pos.top + this.options.offset.y,
				'left': pos.left + pos.width + this.options.offset.x
			}
		}).inject(document.body);
		
		
	}
	
});
