var tooltip={
	tooltipoffsets: [20, -30], // odleglosc x, y od kursora myszy
	fadeinspeed: 200, // czas zanikania w milisekundach

	positiontooltip:function($, $tooltip, e){
		var x=e.pageX+this.tooltipoffsets[0], y=e.pageY+this.tooltipoffsets[1]
		var tipw=$tooltip.outerWidth(), tiph=$tooltip.outerHeight(), 
		x=(x+tipw>$(document).scrollLeft()+$(window).width())? x-tipw-(tooltip.tooltipoffsets[0]*2) : x
		y=(y+tiph>$(document).scrollTop()+$(window).height())? $(document).scrollTop()+$(window).height()-tiph-10 : y
		$tooltip.css({left:x, top:y})
	},
	
	showbox:function($, $tooltip, e){
		$tooltip.fadeIn(this.fadeinspeed)
		this.positiontooltip($, $tooltip, e)
	},

	hidebox:function($, $tooltip){

		$tooltip.stop(false, true).hide()

	},

	init:function(targetselector, tipid){
		jQuery(document).ready(function($){
			var $targets=$(targetselector)
			var $tooltip=$('#'+tipid).appendTo(document.body)
			if ($targets.length==0)
				return
			var $alltips=$tooltip.find('div.atip')

			tooltip.hidebox($, $tooltip)
			$targets.bind('mouseenter', function(e){
				$alltips.hide().filter('#'+$(this).attr('class')).show()
				tooltip.showbox($, $tooltip, e)
			})
			$targets.bind('mouseleave', function(e){
				tooltip.hidebox($, $tooltip)
			})
			$targets.bind('mousemove', function(e){
				if (!tooltip.isdocked){
					tooltip.positiontooltip($, $tooltip, e)
				}
			})
			$tooltip.bind("mouseenter", function(){
				tooltip.hidebox($, $tooltip)
			})
			$tooltip.bind("click", function(e){
				e.stopPropagation()
			})
			$(this).bind("click", function(e){
				if (e.button==0){
					tooltip.isdocked=false
					tooltip.hidebox($, $tooltip)
				}
			})

		})
	}
}

tooltip.init("area.[class]", "tooltip")