var NS4 = (navigator.appName == "Netscape" && document.getElementById == undefined);
var NS6 = (!document.all && document.getElementById);
var layerRef;
var layerVis;
var layerLeft;

if (NS4 || NS6)
{
	if (NS4)
	{
		layerRef = "document.layers[";
		layerLeft = "].left";
		layerVis = "].visibility";
	} else
	{
		layerRef = "document.getElementById(";	
		layerLeft = ").style.left";
		layerVis = ").style.visibility";		
	}
}else
{
	layerRef = "document.all[";
	layerLeft = "].style.pixelLeft";	
	layerVis = "].style.visibility";	
	
}

var animeImage;
var mainImage;
var indent = 1;
var minWidth = 1;
var maxWidth = 3;
var minSpace = 0;
var maxSpace = 2;

function showMenu(name)
{
	var layers = ["paving", "gate", "facing"];
	for (var i=0; i<layers.length; i++)
	{
		var visible = (name == layers[i]) ? "visible" : "hidden";
		eval(layerRef + '"' + layers[i] + 'Layer"' + layerVis + ' = "' + visible + '"');
		eval(layerRef + '"' + layers[i] + 'BgLayer"' + layerVis + ' = "' + visible + '"');
	}
}

function changeImage(name1, src1, name2, src2, animeImage, forward)
{
	document[name1].src = src1;
	document[name2].src = src2;	
	indent 		= (forward) ? 1 : -1;
	this.animeImage	= animeImage;
	this.mainImage	= name1;
	this.forward	= forward;
	nextStep();
}

function nextStep()
{
	if (this.animeImage != '')
	{
		var width = document[this.animeImage].width + indent;
		width = Math.min(width, maxWidth);
		width = Math.max(width, minWidth);	
		document[this.animeImage].width = width;
		if (width > minWidth && width < maxWidth)
		{
			setTimeout(nextStep, 50);
		}
	} else
	{
		var space = document[this.mainImage].hspace + indent;
		space  = Math.min(space , maxSpace);
		space  = Math.max(space , minSpace);	
		document[this.mainImage].hspace = space ;
		if (space > minSpace && space < maxSpace)
		{
			setTimeout(nextStep, 50);
		}

	}
}