var wmtt = null;
var x = null;
var y = null;
var browserHeight = null;
var browserWidth = null;
var dragobjekt = null;
var dragx = 0;
var dragy = 0;
var myToolTip = null;
var myToolTipPos = null;
var active = null;



function showWMTT(id) 
{
	
	wmtt = document.getElementById(id);	
		
	var elementHeight = parseInt(wmtt.style.height);
	var elementWidth = parseInt(wmtt.style.width);
	
		
	if ( (y + elementHeight ) > (525 + ((browserHeight-525) /2 )) )
	{		
		wmtt.style.top 	= (y - elementHeight) + "px";			
	}
	else
	{ //wenn genug platz ist		
		wmtt.style.top 	= (y + 14) + "px";		
	}
	
	if ( (x + elementWidth ) > (900 + ((browserWidth-900) /2 ))  )
	{
		wmtt.style.left = (x - elementWidth) + "px";		
	}
	else
	{ //wenn genug platz ist
		wmtt.style.left = (x + 14) + "px";			
	}		
	
	wmtt.style.display = "block";			
	
}


function preloadImage(id)
{
	var d = document.getElementById(id);														
    picture = new Image();
	picture.src = "layouts/common/images/outfitfeature/"+id+".jpg";
	d.replaceChild(picture,d.childNodes[1]);	
	
}

function showOutfitfeatureWMTT(id)
{		
	var d = document.getElementById(id);														
    picture = d.childNodes[1];
    
    if (picture.width > 120)
    {
    	d.style.width=picture.width+"px";
    }
    else
    {
    	d.style.width="110px";
    }
	
	d.style.height=(picture.height+22)+"px";
	showWMTT(id);
	
}

function loadAndShow(id,roccmId,withForerunner)
{	
	var d_raw = document.getElementById('iframe');	
	d = d_raw.cloneNode(true);
	
	if (withForerunner != null && withForerunner == 'y')
	{	
		d.src = "manager/configurate/outfitContent.html?roccmId="+roccmId+"&withForerunner=y";	
	}
	else
	{
		d.src = "manager/configurate/outfitContent.html?roccmId="+roccmId;
	}	
	
	d.style.display = "block";
	document.getElementById(id).replaceChild(d,document.getElementById(id).childNodes[1]);
		
	showWMTT(id);
}

function loadAndCompare(id,carmake,model)
{	
	var d = document.getElementById('compareIFrame');	
	
		
	d.src = "manager/configurate/outfitComparator.html?carmake=" + carmake + "&model=" + model;
	d.style.display = "block";
	document.getElementById(id).replaceChild(d,document.getElementById(id).childNodes[1]);	
		
	wmtt = document.getElementById(id);
	
	if (wmtt.className.lastIndexOf("comparator") == -1)
	{
		wmtt.className 	= wmtt.className + " comparator";	
	}
	
	wmtt.style.display = "block";
	
}

function loadAndConfigure()
{	
	var d = document.getElementById('confIFrame');
		
		
	d.src = "manager/configurate/modelForm.html";
	d.style.display = "block";
	document.getElementById('config1').replaceChild(d,document.getElementById('config1').childNodes[1]);	
		
	showLightWindow('config1',600,780);
}

function loadAndShowMap(id, url)
{	
	var d_raw = document.getElementById('iframe');	
	d = d_raw.cloneNode(true);
	d.src = url;
	
	d.style.display = "block";
	document.getElementById(id).replaceChild(d,document.getElementById(id).childNodes[1]);
		
	wmtt = document.getElementById(id);
	
	wmtt.style.top 	= "30px";			
	wmtt.style.left = "100px";			
	wmtt.style.display = "block";	
		
}

function loadAndShowHistory(id, url)
{	
	var d_raw = document.getElementById('iframeHistory');	
	d = d_raw.cloneNode(true);
	d.src = url;
	
	d.style.display = "block";
	document.getElementById(id).replaceChild(d,document.getElementById(id).childNodes[1]);
		
	wmtt = document.getElementById(id);
	
	wmtt.style.top 	= "30px";			
	wmtt.style.left = "100px";			
	wmtt.style.display = "block";	
		
}


/*function showSpecialPosForIE(id) 
{
	if (document.all) 
	{
		wmtt = document.getElementById(id);	
		wmtt.style.left = "450px";		
		wmtt.style.top = "300px";		
		wmtt.style.display = "block";	
	}
	else
	{	
		showWMTT(id);
	}			
	
}*/


function updateWMTT(e) 
{	
	var contentArea = document.getElementById('contentArea');
	if (contentArea.className == "contentArea" && centering != 'no')
	{
	
		if (document.all) 
		{
			browserHeight = document.documentElement.clientHeight;
			browserWidth = document.documentElement.clientWidth;	
			
			var overlay = document.getElementById('overlay');
			if (overlay != null && overlay != '')
			{
				overlay.style.position = 'absolute';
				// so w?rde es reichen
				overlay.style.top = ((browserHeight/2 - 594/2) * (-1))+"px";
				overlay.style.left = ((browserWidth/2 - 999/2) * (-1))+"px";
				overlay.style.height = (browserHeight+2) +"px";
				overlay.style.width = browserWidth +"px";
			}
			
		}
		else
		{
			browserHeight = window.innerHeight;
			browserWidth = window.innerWidth;	
			
			var overlay = document.getElementById('overlay');
			if (overlay != null && overlay != '')
			{
				overlay.style.position = 'absolute';
				// so w?rde es reichen
				overlay.style.top = ((browserHeight/2 - 594/2) * (-1))+"px";
				overlay.style.left = ((browserWidth/2 - 1000/2) * (-1))+"px";
				overlay.style.height = (browserHeight+2) +"px";
				overlay.style.width = browserWidth +"px";
			}
		}
		
		if (document.all) 
		{
			x = window.event.x - ((browserWidth - 1000) / 2) ;
			y = window.event.y - ((browserHeight - 596) / 2) ;
		}
		else
		{
			x = e.clientX - ((browserWidth - 1000) / 2) ;
			y = e.clientY - ((browserHeight - 596) / 2) ;	
		}
		
		
		
		if(dragobjekt != null) 
		{
	    	dragobjekt.style.left = (x - dragx) + "px";
	    	dragobjekt.style.top = (y - dragy) + "px";
	    }
	    
	    // update tooltip pos
	    if (myToolTip != null)
	    {
	    	updateTooltipPos();    	
	    }
	}
	else
	{
		if (document.all) 
		{
			browserHeight = document.documentElement.clientHeight;
			browserWidth = document.documentElement.clientWidth;	
			
			var overlay = document.getElementById('overlay');
			if (overlay != null && overlay != '')
			{
				overlay.style.position = 'absolute';
				// so w?rde es reichen
				overlay.style.top = "0px";
				overlay.style.left = "0px";
				overlay.style.height = (browserHeight) +"px";
				overlay.style.width = browserWidth +"px";
			}
			
		}
		else
		{
			browserHeight = window.innerHeight;
			browserWidth = window.innerWidth;	
			
			var overlay = document.getElementById('overlay');
			if (overlay != null && overlay != '')
			{
				overlay.style.position = 'absolute';
				// so w?rde es reichen
				overlay.style.top = "0px";
				overlay.style.left = "0px";
				overlay.style.height = (browserHeight) +"px";
				overlay.style.width = browserWidth +"px";
			}
		}
		
		if (document.all) 
		{
			x = window.event.x;
			y = window.event.y;
		}
		else
		{
			x = e.clientX;
			y = e.clientY;	
		}
		
		
		
		if(dragobjekt != null) 
		{
	    	dragobjekt.style.left = (x - dragx) + "px";
	    	dragobjekt.style.top = (y - dragy) + "px";
	    }
	    
	    // update tooltip pos
	    if (myToolTip != null)
	    {
	    	updateTooltipPos();    	
	    }
		
	}
}
	
function hideWMTT(id) 
{
	wmtt = document.getElementById(id);
	wmtt.style.display = "none";
}


function dragstart(element) 
{
   //Wird aufgerufen, wenn ein Objekt bewegt werden soll.
	
  dragobjekt = document.getElementById(element);
  dragx = x - dragobjekt.offsetLeft;
  dragy = y - dragobjekt.offsetTop;  
  document.onselectstart = new Function("return false");
  
}



function dragstop() 
{
  //Wird aufgerufen, wenn ein Objekt nicht mehr bewegt werden soll.

  dragobjekt=null;
  document.onselectstart = new Function("return true");
}


function toggleDetail(id) 
{
	
	var element = document.getElementById(id);	
		
	if (element.style.display=="none") 
	{
		element.style.display = "block";
	}
	else
	{
		element.style.display = "none";
	}
	
}

function showAmountEmpty()
{
	var modelInfo = document.getElementById('modelInfo');
	var modelInfoEmpty = document.getElementById('modelInfoEmpty');
	modelInfoEmpty.style.display = "block";
	modelInfo.style.display = "none";
}

function showAmount()
{
	var modelInfo = document.getElementById('modelInfo');
	var modelInfoEmpty = document.getElementById('modelInfoEmpty');
	modelInfoEmpty.style.display = "none";
	modelInfo.style.display = "block";
}

/**
 * InfoBox #####################################################################
 * Erforderliches HTML-Element: <div id="infoBox">...</div>
 */
function FadeInfo() {

	var me = this;

	this.fadeInfoCurrentBlend = 0;
	this.fadeInfoBlender = null;
	this.fadeInfo = document.getElementById('fadeInfo');
	this.underMouse = false;
	this.formerInfo = null;
	this.inactiveBorderLeft = 220;
	this.inactiveBorderRight = 800;

	document.thefadeInfo = this;
	
	this.setInactiveBorder = function(l,r) {
		
		this.inactiveBorderLeft = l;
		this.inactiveBorderRight = r;		
	}

	this.blendIn = function() {
		if (!this.fadeInfo) return;
		this.fadeInfoCurrentBlend+=10;
		if (this.fadeInfo.style.display == 'none') this.fadeInfo.style.display = "block";
		if (this.fadeInfoCurrentBlend >= 100) {
			this.fadeInfoCurrentBlend = 100;
			setAlphaBlending(this.fadeInfo, this.fadeInfoCurrentBlend);
			clearTimeout(this.fadeInfoBlender);
			if (!this.underMouse) this.fadeInfoBlender = setTimeout("document.thefadeInfo.blendOut()", 10);
		} else {
			setAlphaBlending(this.fadeInfo, this.fadeInfoCurrentBlend);
			this.fadeInfoBlender = setTimeout("document.thefadeInfo.blendIn()", 10);
		}
	}

	this.blendOut = function() {
		if (!this.fadeInfo) return;
		this.fadeInfoCurrentBlend-=10;
		if (this.fadeInfoCurrentBlend <= 0) {
			this.fadeInfoCurrentBlend = 0;
			setAlphaBlending(this.fadeInfo, this.fadeInfoCurrentBlend);
			this.fadeInfo.style.display = "none";
		} else {
			setAlphaBlending(this.fadeInfo, this.fadeInfoCurrentBlend);
			this.fadeInfoBlender = setTimeout("document.thefadeInfo.blendOut()", 10);
		}
	}

	this.fadeInfo.onmouseover = function(e) {
		me.underMouse = true;
		clearTimeout(me.fadeInfoBlender);
		me.blendIn();		
	}

	this.fadeInfo.onmouseout = function(e) {
		me.underMouse = false;
		clearTimeout(me.fadeInfoBlender);
		me.fadeInfoBlender = setTimeout("document.thefadeInfo.blendOut()", 10);
		this.fadeInfoCurrentBlend = 0;
	}

	this.pushText = function(info) {
		var d = document.createElement('div');
		d.innerHTML = info;
		this.fadeInfo.replaceChild(d,this.fadeInfo.childNodes[0]);
		this.blendIn();
	}
	
	this.pushDiv = function(info,top,left) {
		var d = document.createElement('div');
		d.innerHTML = document.getElementById(info).innerHTML;				
		this.fadeInfo.replaceChild(d,this.fadeInfo.childNodes[0]);
		this.fadeInfo.style.top = top+ "px";
		this.fadeInfo.style.left = left+ "px";		
		this.blendIn();
	}
	
	this.pushDivOnMouse = function(info,row,image) {			
		
			var d = document.createElement('div');
			
			var scrollPositionX = document.getElementById('scrollPositionX').value;
						
			// fenster position
			var left = (findPos(image)[0] - scrollPositionX + 10);		
						
			//am rand kein fenster anzeigen
			if (left > this.inactiveBorderLeft && left < this.inactiveBorderRight)
			{ 
						
				d.innerHTML = document.getElementById(info).innerHTML;				
				this.fadeInfo.replaceChild(d,this.fadeInfo.childNodes[0]);
				if (row == 1)
				{
					// y position fest
					this.fadeInfo.style.top = "158px";
					this.fadeInfo.style.left = left+ "px";	
				}
				else if (row == 2)
				{
					this.fadeInfo.style.top = "312px";
					this.fadeInfo.style.left = left+ "px";
				}
				clearTimeout(this.fadeInfoBlender);				
				this.blendIn();			
			}
					
	}
	
	this.pushDiv = function(info) {
		var d = document.createElement('div');
		d.innerHTML = document.getElementById(info).innerHTML;				
		this.fadeInfo.replaceChild(d,this.fadeInfo.childNodes[0]);
			
		this.blendIn();
	}
	
	this.pushLightWindow = function(lightWindow) {		
		this.blendIn();
	}

	this.fadeInfo.style.display = "none";
}


function findPos(obj) {
	var curleft = curtop = 0;
	if (obj.offsetParent) {
		curleft = obj.offsetLeft;
		curtop = obj.offsetTop;		
		while (obj = obj.offsetParent) {
		/*
		* modified only for images in scrolling div
		*/
			if (obj.tagName != 'BODY' && obj.tagName != 'DIV')
			{				
				curleft += obj.offsetLeft;
				curtop += obj.offsetTop;
			}
		}
	}
	return [curleft,curtop];
}


/**
 * Legt das Alpha-Blending fuer ein HTML Objekt fest
 */
function setAlphaBlending(object, opacity) {
	if (navigator.appName.indexOf("Netscape")!=-1
	 &&parseInt(navigator.appVersion)>=5)
	   object.style.MozOpacity=opacity/100;
	else if (navigator.appName.indexOf("Microsoft")!= -1
	 &&parseInt(navigator.appVersion)>=4)
		if (object.style.filter.indexOf("alpha") == -1) {
			object.style.filter = "alpha(opacity = " + opacity + ")";
		} else {
			object.filters.alpha.opacity = opacity;
			object.filters.alpha.enabled = true;
		}
}

function showTooltip(source,text,pos)
{
	myToolTip = document.getElementById('tool-tip');
	myToolTip.innerHTML = text;
	if (pos)
	{
		myToolTipPos = pos;
	}
	else
	{
		myToolTipPos = 'right';
	}
	updateTooltipPos();	
	active = setTimeout("document.getElementById('tool-tip').style.display = 'block'", 400);	
	setTimeout("hideTooltip()",22000);
}

function updateTooltipPos()
{
	if (myToolTipPos=='right')
	{
		myToolTip.style.top 	= (y + 30) + "px";
		myToolTip.style.left 	= (x + 12) + "px";
	}
	else if (myToolTipPos=='righttop')
	{
		myToolTip.style.top 	= (y - 30) + "px";
		myToolTip.style.left 	= (x + 12) + "px";
	}
	else if (myToolTipPos=='lefttop')
	{
		myToolTip.style.top 	= (y - 60) + "px";
		myToolTip.style.left 	= (x - 155) + "px";
	}
	else
	{
		myToolTip.style.top 	= (y - 30) + "px";
		myToolTip.style.left 	= (x - 155) + "px";
	}
}

function hideTooltip()
{	
	if (myToolTip != null)
	{
		myToolTip.style.display = "none";
		myToolTip = null;
	}
	clearTimeout(active);
}