var activeLayer = null;
var timeoutID = 0;
var picUrl1;
var picUrl2;
var picUrl3;
var layerForImages;

function getAbsOffsetTop(tElement){
    var bodyElements = document.getElementsByTagName("body");
    var bodyElement = bodyElements[0];
    var curItem = tElement;
    var curParent = null;
    var absOffsetTop = 0;
    var curOffsetValue;
    do{
	    curParent = curItem.offsetParent;
	    curOffsetValue = curItem.offsetTop;
	    absOffsetTop += curOffsetValue;
	    curItem = curParent;
    }
    while(curParent != bodyElement);
    return absOffsetTop;
}

function getAbsOffsetLeft(tElement){
    var bodyElements = document.getElementsByTagName("body");
    var bodyElement = bodyElements[0];
    var curItem = tElement;
    var curParent = null;
    var absOffsetLeft = 0;
    var curOffsetValue;
    do{
	    curParent = curItem.offsetParent;
	    curOffsetValue = curItem.offsetLeft;
	    absOffsetLeft += curOffsetValue;
	    curItem = curParent;
    }
    while(curParent != bodyElement);
    return absOffsetLeft;
}

function ShowSecondLevelFor(layerid, aElement){	
	//alert("ShowSecondLevelFor - begin");
	//alert("layerid - " + layerid + " aElement - " + aElement);
	//alert("qq - " + aElement.nextSibling);
	var topOffset = getAbsOffsetTop(aElement);
	//alert("topOffset - " + topOffset);
	var leftOffset = getAbsOffsetLeft(aElement);
	//alert("leftOffset - " + leftOffset + " topOffset - " + topOffset);
	var layerToActive = document.getElementById(layerid);

	if(this.timeoutID){
		window.clearTimeout(timeoutID);
	}
	if(this.activeLayer){
		 HideLayer(this.activeLayer);
	}
	if(layerToActive){
		this.activeLayer = layerToActive;
	}else{
		//alert("layer " + layerid  + " not found");
		this.setImagesActive(layerid);
		return;    
	}
	this.activeLayer.style.top = topOffset + 20;
	//alert(leftOffset);
	//alert(this.activeLayer.offsetWidth);
	this.activeLayer.style.left = leftOffset - 50;
	this.activeLayer.style.visibility='visible';
	// Change Images
	this.setImagesActive(layerid);
	//alert("ShowSecondLevelFor - end");
}

function setImagesActive(layerid){
	return;
	var image;
	var td;
	image = document.getElementById('I_' + layerid + '_1');
	if(image){
	    this.picUrl1 = image.src;
	    image.src='./Images/menu_c_1.gif';
	}
	image = document.getElementById('I_' + layerid + '_3');
	this.picUrl3 = image.src;
	image.src='./Images/menu_c_3.gif';
	td = document.getElementById('T_' + layerid);
	this.picUrl2 = td.getAttribute('background');
	td.setAttribute('background','./Images/menu_c_2.gif');
	this.layerForImages = layerid;
}

function setImagesPrevious(){
	return;
	var image;
	var td;
	image = document.getElementById('I_' + this.layerForImages + '_1');
	if(image){
	    image.src = this.picUrl1;
	}
	image = document.getElementById('I_' + this.layerForImages + '_3');
	image.src = this.picUrl3;
	td = document.getElementById('T_' + this.layerForImages);
	td.setAttribute('background',this.picUrl2);
}

function onMouseOverLayer(layer){
	if(this.timeoutID)
		window.clearTimeout(this.timeoutID);
	else
		this.setImagesPrevious();
}

function onMouseOutLayer(layer){
	 HideSecondLevelFor();
}

function HideSecondLevelFor(){
	this.timeoutID = window.setTimeout("HideLayer(this.activeLayer)", 100);
}

function HideLayer(layerid){
	if(this.timeoutID)
		this.timeoutID = 0;
	if(layerid)
		layerid.style.visibility='hidden';
	// Change Images
	this.setImagesPrevious();
}