var browser;
var mouseX, mouseY;

// detect browser
with(navigator)
{
	browser = (userAgent.indexOf("MSIE") != -1) ? "MSIE" : "NN";
}

document.onmousemove = mouseMove;
if (browser == "NN") document.captureEvents(Event.MOUSEMOVE);

function mouseMove(e) 
{

    mouseX = (browser == "NN") ? e.pageX : event.clientX + document.documentElement.scrollLeft;
	mouseY = (browser == "NN") ? e.pageY : event.clientY + document.documentElement.scrollTop;
}

/*
*	util class for a common tooltip
*
*	@param	string element prefix
*	@param	string element suffix
*/	
function CommonTooltip( strID )
{
	this.strID      = strID;
	this.intWidth   = 399;
	this.strHeader  = "";
	this.strBody    = "";
	this.intPosX 	= 0;
	this.intOffsetX = 0;
	this.intOffsetY = 15;
	this.arrContent = new Array();
	this.strTheme   = "";

	/*
	*
	*/
	this.addContent = function( strHeader, strBody )
	{
		this.arrContent.push( new Array( strHeader, strBody ) );
	}
	
	/*
	*
	*/
	this.resetContent = function()
	{
		this.arrContent = new Array();
	}	
	
	/*
	*
	*/
	this.setHeader = function( strHeader )
	{
		this.strHeader = strHeader;
		this.arrContent[0] = new Array( strHeader, this.strBody );
	}
	
	/*
	*
	*/
	this.addHeader = function( strHeader )
	{
		this.addContent( strHeader, "" );
	}	
	
	/*
	*
	*/
	this.setBody = function( strBody )
	{
		this.strBody = strBody;
		this.arrContent[0] = new Array( this.strHeader, strBody );
	}
	
	/*
	*
	*/
	this.addBody = function( strBody )
	{
		this.addContent( "", strBody );
	}		
	
	/*
	*
	*/
	this.setWidth = function( intWidth )
	{
		this.intWidth = intWidth;
	}
	
	/*
	*
	*/
	this.setOffsetX = function( intOffsetX )
	{
		this.intOffsetX = intOffsetX;
	}
	
	/*
	*
	*/
	this.setPosX = function( intPosX )
	{
		this.intPosX = intPosX;
		this.intOffsetX = 0;
	}
	
	/* setPosY does not make sense, for this position always depends on the scroll position */
	
	/*
	*
	*/
	this.setOffsetY = function( intOffsetY )
	{
		this.intOffsetY = intOffsetY;
	}
	
	/*
	*
	*/
	this.setTheme = function( strTheme )
	{
		this.strTheme = strTheme;
	}	
	
	this.generateContent = function()
	{
		var tt = "";
		
		// iterate over contents
		for( i=0 ; i<this.arrContent.length ; i++ )
		{
			blnNoHeader = false;
		
			if( this.arrContent[i][0] != "" )
			{
				tt += '<div class="header">' + this.arrContent[i][0] + '<\/div>';
			}
			else
			{
				blnNoHeader = true;
			}
			
			if( this.arrContent[i][0] != "" && this.arrContent[i][1] != "" )
			{
				tt += '<div class="dashedLine" style="width: ' + (this.intWidth-10) + 'px;"><\/div>';
			}			
			
			if( this.arrContent[i][1] != "" )
			{
				tt += '<div class="body">' + this.arrContent[i][1] + '<\/div>';
			}
			
			// add line to divide content (if not last entry)
			if( i != (this.arrContent.length-1) )
			{
				tt += '<div class="content_divider" style="width: ' + (this.intWidth-2) + 'px;"><\/div>';
			}			
		}		
	
		return tt;
	}
	
	/*
	*
	*/	
	this.render = function()
	{
		if( document.getElementById( this.strID ) )
		{
			document.getElementById( this.strID + "_content" ).innerHTML = this.generateContent(); 
		}
		else
		{
			var tt = "";
			tt += '<div id="' + this.strID + '" class="common_tooltip" style="width: ' + this.intWidth +  'px;">'
			if( this.strTheme != "" ) tt += '<div class="tt_' + this.strTheme + '">';		 	
		 	tt += '<div class="corner top_left"><\/div>';
			tt += '<div class="line top" style="width: ' + (this.intWidth-12) + 'px;"><\/div>';
			tt += '<div class="corner top_right"><\/div>';
			tt += '<div id="' + this.strID + '_content" class="tt_content" style="width: ' + (this.intWidth-2) + 'px;">';
	
			tt += this.generateContent();
		
			tt += '<\/div>';
			tt += '<div class="corner bottom_left"><\/div>';
			tt += '<div class="line bottom" style="width: ' + (this.intWidth-12) + 'px;"><\/div>';
			tt += '<div class="corner bottom_right"><\/div>';
			if( this.strTheme != "" ) tt += '<\/div>';			
			tt += '<\/div>';
			
			document.write(tt);
		}
	}	

	/*
	*
	*/		
	this.show = function() 
	{
		element = document.getElementById(this.strID);
		
		// hunter fix: container with pos relative starts 141px below window (=poxY)
		topContainerHeight = 141;

		posX = mouseX + this.intOffsetX;
		posY = mouseY + this.intOffsetY - topContainerHeight;
		
		// if there is no mouse position, skip
		if (isNaN(posX) || isNaN(posY)) return;
		
		tooltipHeight = element.offsetHeight;
		
		switch (browser)
		{
			case "MSIE":
				windowHeight = document.documentElement.clientHeight;
				scrollY 	 = document.documentElement.scrollTop;
                
                windowWidth  = document.documentElement.clientWidth;
				break;
			case "NN":
			default:
				windowHeight = window.innerHeight;
				scrollY 	 = window.pageYOffset;
                
                windowWidth  = window.innerWidth;
				break;
		}
		
		// value for comparing: position (depending on scrolled height) + height of tooltip + puffer
		compare = posY - scrollY + tooltipHeight + 10;
		
		// set posTop
		if ( compare > windowHeight )
		{// would break out on bottom
			if ( (posY - scrollY - tooltipHeight) < 0 )
			{// would also break out on top => center to link
				posTop = posY - (tooltipHeight/2);
			}
			else
			{// set position above link (negotiate offset value)
				posTop = posY - tooltipHeight - (2*this.intOffsetY);
			}
		}
		else
		{// set position under link
			posTop = posY;
		}
        

                // add horizontal window offset to x-position
                centerContentWidth = 980;
                if(windowWidth > centerContentWidth) {
                    horizontalOffset = (windowWidth - centerContentWidth)/2;
                    posX = posX - horizontalOffset;
                }

		// set posLeft
		if (this.intPosX > 0)
		{// set certain position for left border (ignore mouse position)
			posLeft = this.intPosX;
		}
		else if (this.intPosX < 0)
		{// set certain position for right border (ignore mouse position)
			posLeft = (-1)*this.intPosX - this.intWidth;
		}
		else
		{// no certain position => depending on mouse position
			posLeft = posX;
		}
		
		// show and set position
		element.style.visibility='visible';
		element.style.left = posLeft + "px";
		element.style.top  = posTop + "px";
	}
	
	/*
	*
	*/		
	this.hide = function() 
	{
		document.getElementById(this.strID).style.visibility='hidden';
	}

	this.toggle= function()
	{
		if (document.getElementById(this.strID).style.visibility == 'hidden' || document.getElementById(this.strID).style.visibility == '')
		{
			this.show();
		}
		else
		{
			this.hide();
		}
	}
	
// end of class
}


/*
*	pricedetails tooltip (inherits from common tooltip)
*
*	@param	string element prefix
*	@param	string element suffix
*/	
		
PricedetailsTooltip.prototype = new CommonTooltip();

function PricedetailsTooltip( strID )
{
	this.constructor( strID );		
	
	/*
	*
	*/
	this.addBody = function( strLabel, strValue  )
	{
		strBody = "<div style='float:left;'>" + strLabel + "<\/div><div style='float:right;'>" + strValue + "<\/div><div style='clear: both;'><\/div>";
		this.addContent( "", strBody );
	}	
	
	this.generateContent = function()
	{
		var tt = "";
		
		// iterate over contents
		for( i=0 ; i<this.arrContent.length ; i++ )
		{
			if( this.arrContent[i][0] != "" )
			{
				tt += '<div class="header">' + this.arrContent[i][0] + '<\/div>';
				tt += '<div class="dashedLine" style="width: ' + (this.intWidth-10) + 'px;"><\/div>';
			}
			
			if( this.arrContent[i][1] != "" )
			{
				tt += '<div class="body">' + this.arrContent[i][1] + '<\/div>';
			}
			
			// add line to divide content (if not last entry)
			if( (i!=0) && (i != (this.arrContent.length-1)) )
			{
				tt += '<div class="content_divider" style="margin-top:-1px; margin-bottom:-4px; width: ' + (this.intWidth-2) + 'px;"><\/div>';
			}			
		}		
	
		return tt;
	}			
	
// end of class
}