if (document.images)
	{
		pic1on = new Image(50, 23);
		pic1on.src = "homeClick.gif";

		pic1off = new Image(50, 23);
		pic1off.src = "home.gif";

		pic2on = new Image(100, 23);
		pic2on.src = "infoClick.gif";

		pic2off = new Image(100, 23);
		pic2off.src = "info.gif";

		pic3on = new Image(100, 23);
		pic3on.src = "menuClick.gif";

		pic3off = new Image(100, 23);
		pic3off.src = "menu.gif";

		pic4on = new Image(120, 23);
		pic4on.src = "photosClick.gif";

		pic4off = new Image(120, 23);
		pic4off.src = "photos.gif";

		pic5on = new Image(160, 23);
		pic5on.src = "reservationsClick.gif";

		pic5off = new Image(160, 23);
		pic5off.src = "reservations.gif";

		pic6on = new Image(120, 23);
		pic6on.src = "aboutClick.gif";

		pic6off = new Image(120, 23);
		pic6off.src = "about.gif";
	}
	
	// change the image when mouse goes over
	function mouseOver(imageName)
	{
		if (document.images)
		{
			imgOn = eval(imageName + "on.src");
			document[imageName].src = imgOn;
		}
	}

	// revert back the image when mouse goes out
	function mouseOut(imageName)
	{
		if (document.images)
		{
			imgOff = eval(imageName + "off.src");
			document[imageName].src = imgOff;
		}
	}

	function zoomIn()
	{
		temp = document.images['map'].src;
		t = temp.substring(temp.lastIndexOf("/") + 1);

		if (t == 'map1.gif')
		{
			document.images['map'].src = 'map2.gif';
			document.getElementById("message").innerHTML="";
		}

		else if (t == 'map2.gif')
		{
			document.images['map'].src = 'map3.gif';
			document.getElementById("message").innerHTML="";
		}
		else
		{
			document.getElementById("message").innerHTML="You have reached the maximum zoom in level";
		}	
	}

	function zoomOut()
	{
		temp = document.images['map'].src;
		t = temp.substring(temp.lastIndexOf("/") + 1);

		if (t == 'map3.gif')
		{
			document.images['map'].src = 'map2.gif';
			document.getElementById("message").innerHTML="";
		}

		else if (t == 'map2.gif')
		{
			document.images['map'].src = 'map1.gif';
			document.getElementById("message").innerHTML="";
		}
		else
		{
			document.getElementById("message").innerHTML="You have reached the maximum zoom out level";
		}
	}

	// change the picture to correspond to the thumbnail
	function changePicture(picture)
	{
		document.picture.src = picture;
	}

	// change color of the text 
	function changeColorOn(name)
	{
		var darkRed = "#581100";
		// get a reference to the text
		var pTag = window.document.getElementById(name);
		// change the color of the text accordingly
		pTag.style.color= darkRed;
	}

	// revert back the color of the text
	function changeColorOff(name)
	{
		var darkGreen = "#002803";
		// get a reference to the text
		var pTag = window.document.getElementById(name);
		// change the color of the text accordingly
		pTag.style.color= darkGreen;
	}

	// display the options at the top
	function displayOptions()
	{
		var string = "<div class='options'>";
		string += "<table class='options' cellspacing='0'>";
		string += "<tr>";
		string += "<td><a href='goldenthai_home.html'  onMouseOver=\"mouseOver('pic1')\" onMouseOut=\"mouseOut('pic1')\"><img src='home.gif' name='pic1'></a></td>";
		string += "<td><a href='goldenthai_about.html'  onMouseOver=\"mouseOver('pic6')\" onMouseOut=\"mouseOut('pic6')\"><img src='about.gif' name='pic6'></a></td>";
		string += "<td><a href='goldenthai_appetizers.html'  onMouseOver=\"mouseOver('pic3')\" onMouseOut=\"mouseOut('pic3')\"><img src='menu.gif' name='pic3'></a></td>";
		string += "<td><a href='goldenthai_photos.html'  onMouseOver=\"mouseOver('pic4')\" onMouseOut=\"mouseOut('pic4')\"><img src='photos.gif' name='pic4'></a></td>";
		string += "<td><a href='goldenthai_reservations.html'  onMouseOver=\"mouseOver('pic5')\" onMouseOut=\"mouseOut('pic5')\"><img src='reservations.gif' name='pic5'></a></td>";
		string += "<td><a href='goldenthai_info.html'  onMouseOver=\"mouseOver('pic2')\" onMouseOut=\"mouseOut('pic2')\"><img src='info.gif' name='pic2'></a></td>";
		string += "<tr>";
		string += "</table>";
		string += "</div>";
		document.write(string);
	}

	// display the restuarants informatin at the bottom
	function displayBottomInfo()
	{
		var string = "<table class='bottomInfo'>";
		string += "<tr>";
		string += "<td> 105 Church St. </td>";
		string += "<td> Phone: 416.868.6668 </td>";
//		string += "<td> Fax: 416.868.0453 </td>";
		string += "<tr>";
		string += "</table>";
		document.write(string);
	}

	// display the menu options in the menu section
	function displayMenuOptions()
	{
		var string = "<h1 class='title'>  Menu </h1>";
		string += "<table cellspacing='2'>";
		string += "<tr>";
		string += "<td> <a href='goldenthai_appetizers.html' id='appetizers' ONMOUSEOVER=\"changeColorOn('appetizers')\" ONMOUSEOUT=\"changeColorOff('appetizers')\"> Appetizer </a> <a class='separators'>|</a></td> ";
		string += "<td> <a href='goldenthai_soups.html' id='soups' ONMOUSEOVER=\"changeColorOn('soups')\" ONMOUSEOUT=\"changeColorOff('soups')\"> Soup & Salad </a><a class='separators'>|</a></td> ";
		string += "<td> <a href='goldenthai_noodles.html' id='noodles' ONMOUSEOVER=\"changeColorOn('noodles')\" ONMOUSEOUT=\"changeColorOff('noodles')\"> Noodle & Rice </a><a class='separators'>|</a></td> ";
		string += "<td> <a href='goldenthai_mains.html' id='mains' ONMOUSEOVER=\"changeColorOn('mains')\" ONMOUSEOUT=\"changeColorOff('mains')\"> Mains </a><a class='separators'>|</a></td> ";
		string += "<td> <a href='goldenthai_desserts.html' id='desserts' ONMOUSEOVER=\"changeColorOn('desserts')\" ONMOUSEOUT=\"changeColorOff('desserts')\"> Dessert </a><a class='separators'>|</a></td> ";
		string += "<td> <a href='goldenthai_classics.html' id='classics' ONMOUSEOVER=\"changeColorOn('classics')\" ONMOUSEOUT=\"changeColorOff('classics')\"> Dinner Suggestion </a></td>";
		string += "<tr>";
		string += "</table>";
		document.write(string);
	}

	function displayWebmaster()
	{
		var string = " <p class='webmaster'> Designed by <a href='mailto:ben.cho@rogers.com' ";
		string += "id='webmaster' ONMOUSEOVER=\"changeColorOn('webmaster')\" ONMOUSEOUT=\"changeColorOff('webmaster')\"> Ben Cho</a></p>";
		document.write(string);
	}