var lastIndex = 100;
/**
 * Adds new features to the elements
 */
Element.extend( {
	bringToTop : function() {
		lastIndex++;
		this.setStyle('z-index', lastIndex);
	},
	addMousePopup : function(popup) {
		popup.bindTo(this);
	}

});

var MousePopup = new Class( {
	initialize : function(xhtml, delay, styles) {
		this.popup_delay = delay;
		this.styles = styles;
		this.xhtml = xhtml;
		this.is_enabled = true;
		this.cur_x = 0;
		this.cur_y = 0;
	},
	setXHTML : function(xhtml) {
		this.xhtml = xhtml;
		if (MousePopup.active == this)
			$('popup_div').setHTML(this.xhtml);
	},
	handlerFocus : function(ev) {
		this.cur_x = ev.clientX;
		this.cur_y = ev.clientY;
		var position = this.calcTopLeft();
		$('popup_div').setStyles(position);
	},
	handlerMove : function(ev) {
		this.cur_x = ev.clientX;
		this.cur_y = ev.clientY;
		var position = this.calcTopLeft();
		$('popup_div').setStyles(position);
	},
	handlerOver : function(ev) {
		this.cur_x = ev.clientX;
		this.cur_y = ev.clientY;
		if (this.is_enabled) {
			this.delay_timer = this.showDiv.delay(this.popup_delay, this);
		}
	},
	handlerOut : function(ev) {
		$('popup_div').setStyle('visibility', 'hidden');
		MousePopup.active = null;
		$clear(this.delay_timer);
	},
	showDiv : function() {
		var popup_div = $('popup_div');
		popup_div.setHTML(this.xhtml);
		var basic_styles = {
			'position' :'absolute',
			'visibility' :'visible'
		};
		var position = this.calcTopLeft();
		var styles = $merge(basic_styles, position, this.styles);
		popup_div.style.cssText = '';
		popup_div.setStyles(styles);
		popup_div.bringToTop();
		MousePopup.active = this;
	},
	calcTopLeft : function() {
		var top;
		var left;
		var popup_size = $('popup_div').getCoordinates();
		var scrollLeft = window.getScrollLeft();
		var scrollTop = window.getScrollTop();
		var window_height = window.getHeight();
		var margin_bottom = window_height - this.cur_y;
		var window_width = window.getWidth();
		var margin_right = window_width - this.cur_x;
		if (margin_bottom > popup_size.height + 10) {
			top = this.cur_y + scrollTop + 10;
		} else if (margin_right < popup_size.width) {
			top = this.cur_y - popup_size.height - 10 + scrollTop;
		} else {
			top = window_height + scrollTop - popup_size.height;
		}
		if (margin_right > popup_size.width + 20) {
			left = this.cur_x + scrollLeft + 20;
		} else {
			left = window_width + scrollLeft - popup_size.width;
		}
		return {
			'top' :top + 'px',
			'left' :left + 'px'
		};
	},
	bindTo : function(el) {
		if (this.handlers === undefined) {
			this.handlers = {
				over :this.handlerOver.bind(this),
				move :this.handlerMove.bind(this),
				out :this.handlerOut.bind(this),
				focus :this.handlerFocus.bind(this)
			};
		}
		$(el).addEvent('mouseover', this.handlers.over);
		$(el).addEvent('mousemove', this.handlers.move);
		$(el).addEvent('mouseout', this.handlers.out);
		// $(el).addEvent('focus',this.handlers.focus);
},
disable : function() {
	this.is_enabled = false;
	$('popup_div').setStyle('visibility', 'hidden');
},
enable : function() {
	this.is_enabled = true;
},
unbind : function(el) {
	if (this.handlers === undefined) {
		return false;
	}
	$(el).removeEvent('mouseover', this.handlers.over);
	$(el).removeEvent('mousemove', this.handlers.move);
	$(el).removeEvent('mouseout', this.handlers.out);
	// $(el).removeEvent('focus',this.handlers.focus);
	this.handlerOut();
	return true;
},
kill : function() {
	MousePopup.active = null;
	$('popup_div').style.visibility = 'hidden';
}
});
