document.onselectstart=new Function ("return false");

isIE7 = navigator.appVersion;

boxWidth = 720 - 32;
boxHeight = 550;

dragging = false;

openMenus = new Array();

/* Coordinates relative to top left of window for inital mousedown event of drag */
startEventX = 0;
startEventY = 0;

/* Positions relative to div of top left of background image */
backgroundX = -700;
backgroundY = -350;

/* Positions relative to div of top left of background image at start of drag */
startBackgroundX = -700;
startBackgroundY = -350;


lowerRightHTML = new Array();
lowerLeftHTML = new Array();
circles = new Array();
images = new Array();


/*used to show the current number for which information is being displayed (cancelled on mousedown)*/
if(isIE() && ((isIE7.indexOf("MSIE 6") > -1) || (isIE7.indexOf("MSIE 5") > -1)))
{
	/*for IE 5 or 6, create a circleDiv, whose class uses a special filter to make the png image transparency work*/
	var highlightedCircle = document.createElement("div");
	highlightedCircle.className = "circleDiv";
	document.getElementById("tourDiv").appendChild(highlightedCircle);
}
else
{
	/*for all other browsers and IE7 (or above), add the transparent png image as normal*/
	var highlightedCircle = document.createElement("img");
	highlightedCircle.src = "/virtualTour/highlight.png";
	highlightedCircle.className = "circleImage";
	document.getElementById("tourDiv").appendChild(highlightedCircle);
}

/*used when hovering over a number on the menu*/
if(isIE() && ((isIE7.indexOf("MSIE 6") > -1) || (isIE7.indexOf("MSIE 5") > -1)))
{
	var menuOverCircle = document.createElement("div");
	menuOverCircle.className = "circleDiv";
	document.getElementById("tourDiv").appendChild(menuOverCircle);
}
else
{
	var menuOverCircle = document.createElement("img");
	menuOverCircle.src = "/virtualTour/highlight.png";
	menuOverCircle.className = "circleImage";
	document.getElementById("tourDiv").appendChild(menuOverCircle);
}

/*used when hovering over a number on the map*/
if(isIE() && ((isIE7.indexOf("MSIE 6") > -1) || (isIE7.indexOf("MSIE 5") > -1)))
{
	var mouseOverCircle = document.createElement("div");
	mouseOverCircle.className = "circleDiv";
	document.getElementById("tourDiv").appendChild(mouseOverCircle);
}
else
{
	var mouseOverCircle = document.createElement("img");
	mouseOverCircle.src = "/virtualTour/highlight.png";
	mouseOverCircle.className = "circleImage";
	mouseOverCircle.id = "mouseOverCircle";
	document.getElementById("tourDiv").appendChild(mouseOverCircle);
}

var debugDiv = document.getElementById("debugDiv");
debugDiv.style.left = "750px";
debugDiv.style.height = "100px";
debugDiv.style.border = "1px solid black";
debugDiv.style.display = "none";


/*replaces all the occurrences of the first string in the given string with the second string*/
function replaceAll(stringToChange, findString, replaceString)
{	
	while(stringToChange.indexOf(findString) > -1)
	{
		stringToChange = stringToChange.replace(findString, """);
	}
	while(stringToChange.indexOf(""") > -1)
	{
		stringToChange = stringToChange.replace(""", replaceString);
	}
	return stringToChange;
}


function createLowerRightHTML(targetNumber, defaultImage, divLabel, links, navigation)
{	
	/*replaces any ' characters in the div label with the required \' string*/
	divLabel = replaceAll(divLabel, "'", "\'");
	
	var imageMovieString = "";
	if(defaultImage.indexOf(".mov") > -1)
	{
		imageMovieString = ("<iframe width=\"312\" height=\"265\" scrolling=\"no\" src=\"../virtualTour/quicktimeFrame.html?image=" + defaultImage + "\" id=\"quicktimeFrame\" name=\"quicktimeFrame\" frameBorder=\"0\" background-color=\"white\" style=\"margin: 5px;\"></iframe>");
	}
	else
	{
		imageMovieString = ("<img id=\"lowerRightHTMLImage\" src=\"" + defaultImage + "\"/>");
	}
	
	var titleDiv = "";
	if(divLabel.length > 60)
	{
		titleDiv = "<br/><div id=\"titleDiv" + targetNumber + "\" class=\"titleLong\">";
	}
	else
	{
		titleDiv = "<br/><div id=\"titleDiv" + targetNumber + "\" class=\"title\">";
	}
	
	/*adds any links to the title under the image/movie*/
	
	var array = false;
	var linksArray = links.split(',');
	if(linksArray.length > 1)
	{
		array = true;
	}

	/*for multiple links (comma separated) opens multiple windows/tabs*/
	if(array)
	{
		titleDiv += "<a title=\"NB: this will open in multiple new windows\" onmouseover=\"window.document.body.style.cursor = 'pointer'; this.style.color = '#0000ff';\" " +
					"onmouseout=\"window.document.body.style.cursor = 'default'; this.style.color = '#0066cc';\" onclick=\"";
		for(var index=0; index<linksArray.length; index++)
		{
			titleDiv += "window.open('" + linksArray[index] + "');";
		}
		titleDiv += "\">" + divLabel + "</a></div>"; 
	}
	else if(links != "")
	{
		titleDiv += "<a title=\"NB: this will open in a new window\" href=\"" + links + "\" target=\"_new\">" + divLabel + "</a></div>";
	}
	else
	{
		titleDiv += divLabel + "</div>";
	}
	
	
	if(navigation)
	{				
		var pageNumbers = "";
		var pageContents = "";
		var imageMovies = images[targetNumber];
		
		for(var i=0; i<imageMovies.length; i++)
		{
			var currentImageMovie = imageMovies[i];
			var pageClass;
			var display;
			var style = "";
			if(i == 0)
			{
				pageClass = "imageMoviePageNumber firstPage";
				style = "style=\"font-weight: bold\"";
				display = "block";
			}
			else
			{
				pageClass = "imageMoviePageNumber";
				display = "none";
			}
			
			var imageMovieString = "";
			if(currentImageMovie.indexOf(".mov") > -1)
			{
				imageMovieString = ("<iframe width=\"312\" height=\"265\" scrolling=\"no\" src=\"/virtualTour/quicktimeFrame.html?image=" + currentImageMovie + "\" id=\"quicktimeFrame\" name=\"quicktimeFrame\" frameBorder=\"0\" background-color=\"white\" style=\"margin: 5px;\"></iframe>");
			}
			else
			{
				imageMovieString = ("<img id=\"lowerRightHTMLImage\" src=\"" + currentImageMovie + "\"/>");
			}
	
			pageNumbers += ("<li class=\"" + pageClass + "\" " + style + " onmouseover=\"navigationMouseOver(event)\" onmouseout=\"navigationMouseOut(event)\" onclick=\"lowerRightNavigation(" + targetNumber + "," + (i+1) + ")\">" + (i+1) + "</li>");
			pageContents += ("<div id=\"page" + (i+1) + "\" style=\"display: " + display + "\">" + imageMovieString + "</div>");
		}
		
		return("<div class=\"imageMovieNavigation\" style=\"float: right\"><ul id=\"imageMoviePageNumbers" + targetNumber + "\">" + pageNumbers + "</ul></div><div id=\"lowerRight" + targetNumber + "\">" + pageContents + titleDiv + "</div>");
	}
	else
	{
		return imageMovieString + titleDiv;	
	}
}


function createLowerLeftHTML(targetNumber, pages)
{
	/*checks to see if the parameter passed is an array*/
	var array = false;
	if(typeof(pages) == 'object') 
	{  
		if(pages instanceof Array)
		{
			array = true;
		}
	}
	
	if(array)
	{		
		var pageNumbers = "";
		var pageContents = "";

		for(var i=0; i<pages.length; i++)
		{
			var currentPage = pages[i];
			/*replaces all occurrences of the ' character with the escaped \' version*/
			currentPage = replaceAll(currentPage, "'", "\'");
			var pageClass;
			var display;
			var style = "";
			if(i == 0)
			{
				pageClass = "pageNumber firstPage";
				style = "style=\"font-weight: bold\"";
				display = "block";
			}
			else
			{
				pageClass = "pageNumber";
				display = "none";
			}
			pageNumbers += ("<li class=\"" + pageClass + "\" " + style + " onmouseover=\"navigationMouseOver(event)\" onmouseout=\"navigationMouseOut(event)\" onclick=\"pageNavigation(" + targetNumber + "," + (i+1) + ")\">" + (i+1) + "</li>");
			pageContents += ("<div id=\"page" + (i+1) + "\" style=\"display: " + display + "\">" + currentPage + "</div>");
		}
		
		return("<div style=\"float: right\"><ul id=\"pageNumbers" + targetNumber + "\">" + pageNumbers + "</ul></div><div id=\"lowerLeft" + targetNumber + "\">" + pageContents + "</div>");
	}
	else
	{
		/*replaces all occurrences of the ' character with the escaped \' version*/
		pages = replaceAll(pages, "'", "\'");
		return (pages);
	}
}


function navigationMouseOver(event)
{
	var menuItem;
	if(window.event)
	{
		menuItem = event.srcElement;
	}
	else
	{
		menuItem = event.target;
	}
	
	window.document.body.style.cursor = "pointer";	
	
	if(isIE7.indexOf("WebKit") > -1)
	{
		menuItem.style.color = "red";
		setTimeout("removeNavigationHighlights()",200);
	}
	else
	{
		menuItem.style.color = "red";
	}
}


function removeNavigationHighlights()
{
	var lowerRight = document.getElementById("lowerRight");
	var lowerRightDivs = lowerRight.getElementsByTagName("div");
	for(var i=0; i<lowerRightDivs.length; i++)
	{
		if(lowerRightDivs[i].style.color == "red")
		{
			lowerRightDivs[i].style.color = "black";
		}
	}
}


function navigationMouseOut(event)
{
	var menuItem;
	if(window.event)
	{
		menuItem = event.srcElement;
	}
	else
	{
		menuItem = event.target;
	}
	
	window.document.body.style.cursor = "default";	
	menuItem.style.color = "black";
}


function getDivPosition(divID)
{
	div = document.getElementById(divID);

	if(div.offsetParent) 
	{
		divPositionX = div.offsetLeft;
		divPositionY = div.offsetTop;
		
		while(div = div.offsetParent) 
		{
			divPositionX += div.offsetLeft;
			divPositionY += div.offsetTop;
		}
	}
	
	return [divPositionX, divPositionY];
}


/*on mouse down...*/
function startDrag(e) 
{	
	document.getElementById("helpDiv").style.display = "none";
	
	var clickedItem;
	
	if(window.event)
	{
		clickedItem = event.srcElement;
	}
	else
	{
		clickedItem = e.target;
	}
	
	if((clickedItem.id != "tourDiv") && (clickedItem.id != "mouseOverCircle"))
	{
		return false;
	}
	
	highlightedCircle.style.display = "none";
	menuOverCircle.style.display = "none";
	mouseOverCircle.style.display = "none";

	var clientPositionX = isIE() ? event.clientX : e.clientX;
	var clientPositionY = isIE() ? event.clientY : e.clientY;

	var divPosition = getDivPosition("tourDiv");
	var scrollPosition = getScrollPosition();
	
	var imagePositionX = getImagePositionX(clientPositionX, divPosition[0]);
	var imagePositionY = getImagePositionY(clientPositionY, divPosition[1]);
	imagePositionX += scrollPosition[0];
	imagePositionY += scrollPosition[1];
	
	var overNumber = false;
	
	for(targetNumber in circles)
	{
		if(((imagePositionX >= circles[targetNumber][0]) && (imagePositionX <= circles[targetNumber][1])) && ((imagePositionY >= circles[targetNumber][2]) && (imagePositionY <= circles[targetNumber][3])))
		{
			mouseOverCircle.style.display = "none";
			panTo(imagePositionX, imagePositionY, targetNumber);
			overNumber = true;
			break;
		}
	}
	
	if(!overNumber)
	{
		dragging = true;

		startEventX = isIE() ? event.clientX : e.clientX;
		startEventY = isIE() ? event.clientY : e.clientY;

		hideLowerRight();
		hideLowerLeft();
	}
}


function endDrag(e) 
{
	dragging = false;
	
	if ( backgroundX > 0 ) 
	{
		backgroundX =  0;
	}
	if ( backgroundX < -2300 + boxWidth ) 
	{
		backgroundX = -2300 + boxWidth;
	}
	
	if ( backgroundY > 0 ) 
	{
		backgroundY = 0;
	}
	if ( backgroundY < -1309 + boxHeight ) 
	{
		backgroundY = -1309 + boxHeight;
	}
	
	startBackgroundX = backgroundX;
	startBackgroundY = backgroundY;
}


function mouseMove(e) 
{	
	mouseOverCircle.style.display = "none";

	/*mouse button is down*/
	if(dragging) 
	{
		var tourDiv = document.getElementById('tourDiv');
		
		if(tourDiv) 
		{
			offsetX = isIE() ? event.clientX : e.clientX;
			offsetY = isIE() ? event.clientY : e.clientY;
				
			backgroundX = startBackgroundX + ( offsetX - startEventX );
			backgroundY = startBackgroundY + ( offsetY - startEventY );

			positionInBackgroundCoords(backgroundX,backgroundY);
		}
	}
	/*mouse button is not down*/
	else
	{
		var tourDiv = document.getElementById('tourDiv');
		
		if(tourDiv)
		{
			var clientPositionX = isIE() ? event.clientX : e.clientX;
			var clientPositionY = isIE() ? event.clientY : e.clientY;

			var divPosition = getDivPosition("tourDiv");
			var scrollPosition = getScrollPosition();

			var imagePositionX = getImagePositionX(clientPositionX, divPosition[0]);
			var imagePositionY = getImagePositionY(clientPositionY, divPosition[1]);
			imagePositionX += scrollPosition[0];
			imagePositionY += scrollPosition[1];
			
			for(var targetNumber in circles)
			{
				if(((imagePositionX >= circles[targetNumber][0]) && (imagePositionX <= circles[targetNumber][1])) && ((imagePositionY >= circles[targetNumber][2]) && (imagePositionY <= circles[targetNumber][3])))
				{
					/*if the hightlighted circle is being displayed, send displaced=true to showMouseOverCircle*/
					if(highlightedCircle.style.display == "block")
					{
						showMouseOverCircle(targetNumber, true);
					}
					else
					{
						showMouseOverCircle(targetNumber, false);
					}
					break;
				}
			}
		}
	}
}


function panTo(imageX, imageY, targetNumber, event) 
{			
	highlightedCircle.style.display = "none";
	var parentMenu = "none";
	if(!isIE() && event)
	{
		parentMenu = (event.target).parentNode.id;
	}
			
	imageX += 120;
	imageY += 120;
	
	hideLowerRight;
	hideLowerLeft;
	
	if(isIE())
	{
		noBubble();
	}
	
	var startImageX = backgroundXFromImageX(backgroundX);
	var startImageY = backgroundYFromImageY(backgroundY);
	
	var distance = Math.sqrt( Math.pow(imageX-startImageX,2) + Math.pow(imageY-startImageY,2) );
	
	var numberSteps = distance/20;

 	panStep(startImageX,imageX,startImageY,imageY,0,numberSteps,targetNumber, parentMenu);
}


function panStep(startImageX,endImageX,startImageY,endImageY,i,numberSteps,targetNumber, parentMenu) 
{	
	/*as cancelling bubbling of events in firefox doesn't work, manually redisplay the parent menu here*/
	if((parentMenu != "none") && !isIE())
	{
		document.getElementById(parentMenu).style.display = "block";
	}
	
	/*stops any mouse or menu over circles from appearing during a pan*/
	mouseOverCircle.style.display = "none";
	menuOverCircle.style.display = "none";
	
	if(i < numberSteps) 
	{
		var currentImageX = i * ( endImageX - startImageX ) / numberSteps + startImageX;
		var currentImageY = i * ( endImageY - startImageY ) / numberSteps + startImageY;

		positionInImageCoords( currentImageX, currentImageY ); 

		i++;

		setTimeout('panStep('+startImageX+','+endImageX+','+startImageY+','+endImageY+','+i+','+numberSteps+','+targetNumber+',"'+parentMenu+'")',1);
	}
	else 
	{
		positionInImageCoords( endImageX, endImageY );
		showLowerRight(targetNumber);
		showLowerLeft(targetNumber);
		showHighlightedCircle(targetNumber);
	}
}


/* Used for moving on pan */
function positionInImageCoords(imageX,imageY) 
{
	backgroundX = backgroundXFromImageX(imageX);
	backgroundY = backgroundYFromImageY(imageY);
	
	startBackgroundX = backgroundX;
	startBackgroundY = backgroundY;
	
	positionInBackgroundCoords(backgroundX,backgroundY);
}


/* Actually moves background */
function positionInBackgroundCoords(backgroundX,backgroundY) 
{
	if ( backgroundX > 0 ) 
	{
		backgroundX =  0;
	}
	if ( backgroundX < -2300 + boxWidth ) 
	{
		backgroundX = -2300 + boxWidth;
	}
	
	if ( backgroundY > 0 ) 
	{
		backgroundY = 0;
	}
	if ( backgroundY < -1309 + boxHeight ) 
	{
		backgroundY = -1309 + boxHeight;
	}
	
	var tourDiv = document.getElementById('tourDiv');
	tourDiv.style.backgroundPosition = backgroundX + 'px ' + backgroundY + 'px'; 
}


function backgroundXFromImageX(imageX) 
{	
	return( -imageX + boxWidth / 2 );
	
}


function backgroundYFromImageY(imageY) 
{	
	return( -imageY + boxHeight / 2 );
	
}


function getImagePositionX(clientPositionX, divPositionX)
{
	return((clientPositionX - divPositionX) - backgroundX);
}


function getImagePositionY(clientPositionY, divPositionY)
{
	return((clientPositionY - divPositionY) - backgroundY);
}


function getScrollPosition()
{
	var scrollX = document.body.scrollLeft;
	var scrollY = document.body.scrollTop;
	
	if(scrollX == 0)
	{
		if(window.pageXOffset)
		{
			scrollX = window.pageXOffset;
		}
	    else
		{
    		scrollX = (document.body.parentElement) ? document.body.parentElement.scrollLeft : 0;
		}
	}	
	if(scrollY == 0)
	{
		if(window.pageYOffset)
		{
			scrollY = window.pageYOffset;
		}
	    else
		{
    		scrollY = (document.body.parentElement) ? document.body.parentElement.scrollTop : 0;
		}
	}
	return [scrollX, scrollY];
}


function showMouseOverCircle(targetNumber, displaced)
{
	mouseOverCircle.style.position = "relative";
	/*if the mouseover circle is being displaced as the highlighted circle is being displayed, move its position up 36px*/
	if(displaced)
	{
		mouseOverCircle.style.top = ((circles[targetNumber][2] + backgroundY) - 36) + "px";
	}
	else
	{
		mouseOverCircle.style.top = (circles[targetNumber][2] + backgroundY) + "px";
	}
	mouseOverCircle.style.left = (circles[targetNumber][0] + backgroundX) + "px";
	mouseOverCircle.style.display = "block";
}


function showHighlightedCircle(targetNumber)
{		
	if ( backgroundX > 0 ) 
	{
		backgroundX =  0;
	}
	if ( backgroundX < -2300 + boxWidth ) 
	{
		backgroundX = -2300 + boxWidth;
	}
	
	if ( backgroundY > 0 ) 
	{
		backgroundY = 0;
	}
	if ( backgroundY < -1309 + boxHeight ) 
	{
		backgroundY = -1309 + boxHeight;
	}
	
	highlightedCircle.style.position = "relative";
	highlightedCircle.style.left = (circles[targetNumber][0] + backgroundX) + "px";
	highlightedCircle.style.top = (circles[targetNumber][2] + backgroundY) + "px";
	highlightedCircle.style.display = "block";
	moved = false;
}


function showMenuOverCircle(targetNumber, displaced)
{	
	var xPosition = circles[targetNumber][0] + backgroundX;
	var yPosition = circles[targetNumber][2] + backgroundY;
	
	if((xPosition >= 0) && (xPosition <= boxWidth) && (yPosition >= 0) && (yPosition <= boxHeight))
	{
		menuOverCircle.style.position = "relative";
		/*if the menuover circle is being displaced as the highlighted circle is being displayed, move its position up 36px*/
		if(displaced)
		{
			menuOverCircle.style.top = (circles[targetNumber][2] + backgroundY - 36) + "px";
		}
		else
		{
			menuOverCircle.style.top = (circles[targetNumber][2] + backgroundY) + "px";
		}
		menuOverCircle.style.left = (circles[targetNumber][0] + backgroundX) + "px";
		menuOverCircle.style.display = "block";
	}
}


function showLowerRight(targetNumber) 
{
	var lowerRight = document.getElementById('lowerRight');
	lowerRight.innerHTML = lowerRightHTML[targetNumber];
	
	var currentDiv = null;
	var imageMovieDivs = lowerRight.getElementsByTagName("div");
	for(var i=0; i<imageMovieDivs.length; i++)
	{
		if(imageMovieDivs[i].style.display == "block")
		{
			currentDiv = imageMovieDivs[i];
			break;
		}
	}
	
	var singleImageMovie = false;
	
	if(currentDiv == null)
	{
		singleImageMovie = true;
		currentDiv = lowerRight;
	}

	var panoramaLabel = document.createElement("div");
	panoramaLabel.className = "panoramaLabel";
	panoramaLabel.style.float = "left";
	panoramaLabel.id = "panoramaLabel";
	var panoramaLabelText = document.createTextNode("click and drag on image to interact:");
	panoramaLabel.appendChild(panoramaLabelText);
	
	/*positions the lower right div correctly, depending on its contents and the browser being used*/
		
	/*movie boxes*/
	if((currentDiv.innerHTML).toUpperCase().indexOf("<IFRAME") > -1)
	{		
		/*without navigation*/
		if(singleImageMovie)
		{
			currentDiv.insertBefore(panoramaLabel, currentDiv.firstChild);
			lowerRight.className = "lowerRightSingleMovie";
		}
		/*with navigation*/
		else
		{
			lowerRight.className = "lowerRightMultiMovie";
			/*iframes with navigation are even longer*/
			/*this doesn't work - attaching the panorama label screws up the navigation*/
			//var newCurrentDiv = currentDiv.cloneNode(true);
			//newCurrentDiv.insertBefore(panoramaLabel, newCurrentDiv.firstChild);
		}
	}
	/*image boxes*/
	else
	{
		/*without navigation*/
		if(singleImageMovie)
		{
			if(isIE())
			{
				lowerRight.className = "lowerRightSingleImage";
			}
			else
			{
				lowerRight.className = "lowerRight";
			}
		}
		/*with navigation*/
		else
		{
			lowerRight.className = "lowerRightMultiImage";
		}
	}
	
	lowerRight.style.display = 'block';
}


function hideLowerRight() 
{
	var lowerRight = document.getElementById('lowerRight');
	lowerRight.style.display = 'none';
}


function showLowerLeft(targetNumber) 
{
	var lowerLeft = document.getElementById('lowerLeft');
	/*if(targetNumber == "18"){ alert(lowerLeftHTML[targetNumber]);}*/
	lowerLeft.innerHTML = lowerLeftHTML[targetNumber];
	/*if(targetNumber == "18"){ alert(lowerLeft.innerHTML); }*/

	lowerLeft.style.display = 'block';
}


function hideLowerLeft() 
{
	var lowerLeft = document.getElementById('lowerLeft');
	lowerLeft.style.display = 'none';
}


function toggleHelp()
{
	var helpDiv = document.getElementById("helpDiv");
	if(helpDiv.style.display == "block")
	{
		helpDiv.style.display = "none";
	}
	else
	{
		hideLowerLeft();
		hideLowerRight();
		helpDiv.style.display = "block";
	}
}


function noBubble(e) 
{	
	if (!e) var e = window.event;
	e.cancelBubble = true;
	if (e.stopPropagation) e.stopPropagation();
	
}


function mainMenuMouseover(submenuName)
{
	/*shows a cross or resize cursor, depending on whether the required submenu is currently showing or not*/
	var submenu = document.getElementById(submenuName);
	if(submenu.style.display == "block")
	{
		window.document.body.style.cursor = "n-resize";
	}
	else
	{
		window.document.body.style.cursor = "crosshair";
	}
	
	noBubble();
}


function mainMenuMouseout()
{
	window.document.body.style.cursor = "default";	
	noBubble();
}


function subMenuMouseover(event)
{
	window.document.body.style.cursor = "pointer";
	
	var menuItem;
	
	/*if(!e){ menuItem = window.event.srcElement; }
	else{ menuItem = e.target; }*/
	
	if(window.event)
	{
		menuItem = event.srcElement;
	}
	else
	{
		menuItem = event.target;
	}

	/*if the hightlighted circle is being displayed, send displaced=true to showMenuOverCircle*/
	if(highlightedCircle.style.display == "block")
	{
		showMenuOverCircle(menuItem.lang, true);
	}
	else
	{
		showMenuOverCircle(menuItem.lang, false);
	}
	
	if(isIE7.indexOf("WebKit") > -1)
	{
		menuItem.style.color = "red";
		setTimeout("removeMenuHighlights()",200);
	}
	else
	{
		menuItem.style.color = "red";
	}
	
	noBubble();
}


function removeMenuHighlights()
{
	menuItems = document.getElementsByTagName("li");
	for(var i=0; i<menuItems.length; i++)
	{
		if(menuItems[i].style.color == "red")
		{
			menuItems[i].style.color = "black";
		}
	}
}


function subMenuMouseout(event)
{
	window.document.body.style.cursor = "default";	
	
	var menuItem;
	
	/*if(!e){ menuItem = window.event.srcElement; }
	else{ menuItem = e.target; }*/
	
	if(window.event)
	{
		menuItem = event.srcElement;
	}
	else
	{
		menuItem = event.target;
	}

	menuItem.style.color = "black";
	menuOverCircle.style.display = "none";
	noBubble();
}


function toggleSubmenu(event, submenuName, submenuLevel)
{	
	var showing;

	var submenu = document.getElementById(submenuName);

	/*hides the given submenu, and changes the cursor to crosshair to immediately show it can be opened again
	  (without requiring another mouseover event to be fired)*/
	if(submenu.style.display == "block")
	{ 
		submenu.style.display = "none";
		window.document.body.style.cursor = "crosshair";
		showing = false;
	}
	/*displays the given submenu, and changes the cursor to resize to immediately show it can be closed*/
	else if(submenu.style.display == "none")
	{ 
		submenu.style.display = "block";
		window.document.body.style.cursor = "n-resize";
		showing = true;
	}
	submenu.parentNode.style.display = "block";
	
	/*hides any other menu at the same level which is currently open*/
	var openMenu = openMenus[submenuLevel];
	if(openMenu && (openMenu != submenu))
	{
		openMenu.style.display = "none";
	}
	
	openMenus[submenuLevel] = submenu;
		
	noBubble(event);
}


function pageNavigation(targetNumber, pageNumber)
{
	pageNumber = pageNumber - 1;
	
	/*gets all the page divs and pageNumber list items for the given target*/
	var pagesDiv = document.getElementById("lowerLeft" + targetNumber);
	var pages = pagesDiv.getElementsByTagName("div");
	var pageNumbersDiv = document.getElementById("pageNumbers" + targetNumber);
	var pageNumbers = pageNumbersDiv.getElementsByTagName("li");
	
	/*finds the page which is currently being displayed*/
	var currentPage = 0;
	for(var i=0; i<pages.length; i++)
	{
		if(pages[i].style.display == "block")
		{
			currentPage = i;
			break;
		}
	}
	
	/*if the page to be displayed is the current page, do nothing, else hide the current page,
	  display the required one and set the new page's pageNumber list item to be bold*/
	if(currentPage != pageNumber)
	{
		pages[currentPage].style.display = "none";
		pageNumbers[currentPage].style.fontWeight = "normal";
		pages[pageNumber].style.display = "block";
		pageNumbers[pageNumber].style.fontWeight = "bold";
	}
}

		
function lowerRightNavigation(targetNumber, imageMovieNumber)
{	
	imageMovieNumber = imageMovieNumber - 1;
	
	/*gets all the image/movie divs and pageNumber list items for the given target*/
	var imageMoviesDiv = document.getElementById("lowerRight" + targetNumber);
	var imageMovies = imageMoviesDiv.getElementsByTagName("div");
	var pageNumbersDiv = document.getElementById("imageMoviePageNumbers" + targetNumber);
	var pageNumbers = pageNumbersDiv.getElementsByTagName("li");
	
	/*finds the image/movie which is currently being displayed*/
	var currentImageMovie = 0;
	for(var i=0; i<imageMovies.length; i++)
	{
		if(imageMovies[i].style.display == "block")
		{
			currentImageMovie = i;
			break;
		}
	}
	
	/*if the image or movie to be displayed is the current one, do nothing, else hide the current one,
	  display the required one and set the new one's pageNumber list item to be bold*/
	if(currentImageMovie != imageMovieNumber)
	{
		imageMovies[currentImageMovie].style.display = "none";
		pageNumbers[currentImageMovie].style.fontWeight = "normal";
		imageMovies[imageMovieNumber].style.display = "block";
		pageNumbers[imageMovieNumber].style.fontWeight = "bold";
	}
		
	/*change the formatting depending on the type of the previous and new image/movie*/
	
	var oldType = "image";
	var newType = "image";
	var oldLowerRight = imageMovies[currentImageMovie].innerHTML.toUpperCase();
	var newLowerRight = imageMovies[imageMovieNumber].innerHTML.toUpperCase();
	
	var parentDiv = imageMoviesDiv.parentNode;

	if(oldLowerRight.indexOf("IFRAME") > -1)
	{
		oldType = "movie";
	}
	else
	{
		oldType = "image";
	}
	if(newLowerRight.indexOf("IFRAME") > -1)
	{
		newType = "movie";
	}
	else
	{
		newType = "image";
	}
	
	if(oldType == "image" && newType == "movie")
	{
		var panoramaLabel = document.createElement("div");
		panoramaLabel.className = "panoramaLabel";
		panoramaLabel.style.float = "left";
		panoramaLabel.id = "panoramaLabel";
		var panoramaLabelText = document.createTextNode("click and drag on image to interact:");
		panoramaLabel.appendChild(panoramaLabelText);
		parentDiv.insertBefore(panoramaLabel, imageMoviesDiv);

		parentDiv.className = "lowerRightMultiMovie";

	}
	else if (oldType == "movie" && newType == "image")
	{
		parentDiv.removeChild(document.getElementById("panoramaLabel"));
		
		parentDiv.className = "lowerRightMultiImage";
	}
}


/*substitutes all occurrences of html special characters*/
function removeSpecialCharacters(string)
{
	var newString = string;
	
	/*removes trailing whitespace from the beginning and end of the string*/
	while(newString.charAt(0) == " ")
	{
		newString = newString.substring(1);
	}
	while(newString.charAt(newString.length - 1) == " ")
	{
		newString = newString.substring(0, newString.length - 1);
	}
	
	while(newString.indexOf("%20") > -1)
	{
		newString = newString.replace("%20", " ");
	}
	
	return newString;
}


function isIE() 
{
    var ua = navigator.userAgent.toLowerCase();
    if (ua.indexOf("msie") != -1 && !(ua.indexOf("opera") != -1) && (ua.indexOf("webtv") == -1)) 
	{
        return true;
    } 
	else 
	{
        return false;
    }
}