//	Section 1: The arrays that describe the web site.
//	This is the area to maintain when ever a page is added or removed.
//	There are 4 arrays:
//	-	mottoTable	-	A list of the mottos for the logo/motto line.
//	-	webPages	-	The list of web pages in the site that are 
//						connected to the navigation bars.
//	-	nav1Table	-	The list of links in the first navigation bar.
//	-	nav2Table	-	The list of links in the second navigation bars.
//
//	To add a page:
//	1-	add it to the webPages if it is accessed through the navigation bar.
//	2-	add to nav1Table if and only if the page adds a new nav1 tab.
//	3-	add to nav2Table if the page adds a new nav2 tab.
//	
//	To remove a page:
//	1-	remove it from the webPages.
//	2-	modify the nav1Table if the page is linked there.
//	3-	modify the nav2Table if the page is linked there.
//

// The mottoTable is an array of elements [ motto image name, motto alt text ]
var mottoTable = new Array();
mottoTable[mottoTable.length] = new Array( "motto1.jpg", "What is the big idea?");
mottoTable[mottoTable.length] = new Array( "motto2.jpg", "Says who?" );
mottoTable[mottoTable.length] = new Array( "motto3.jpg", "What cheese?" );
//mottoTable[mottoTable.length] = new Array( "motto4.jpg", "I have two kinds of snot"); 

// The webPages is an array of [ document title, page file name, nav1 tab title ]
var webPages = new Array();
webPages[ webPages.length ] = new Array( "index",		"index.html",		"Home" );
webPages[ webPages.length ] = new Array( "Movies",		"movies.html",		"Movies" );
webPages[ webPages.length ] = new Array( "Pictures", 	"pictures.html", 	"Pictures" );
webPages[ webPages.length ] = new Array( "Games",		"games.html",		"Games" );
webPages[ webPages.length ] = new Array( "La Jolla", 	"lajolla.html", 	"Pictures" );
webPages[ webPages.length ] = new Array( "Family Tree", "familytree.html", 	"Pictures" );
webPages[ webPages.length ] = new Array( "Download Games", "downloadgames.html", "Games" );
webPages[ webPages.length ] = new Array( "Recent Pictures", "recentpictures.html", "Pictures" );
webPages[ webPages.length ] = new Array( "C D B!", "cdb.html", "Pictures" );
webPages[ webPages.length ] = new Array( "OS X Screen Savers", "screensavers.html", "OS X" );


// The nav1Table is an array of [ nav1 tab title, link file name ]
var nav1Table = new Array();
nav1Table[ nav1Table.length ] = new Array( "Home" 		, "index.html" );
nav1Table[ nav1Table.length ] = new Array( "Movies"		, "movies.html" );
nav1Table[ nav1Table.length ] = new Array( "Pictures"		, "pictures.html" );
nav1Table[ nav1Table.length ] = new Array( "Games"		, "games.html" );
nav1Table[ nav1Table.length ] = new Array( "OS X"		, "screensavers.html" );

// The nav2Table is an array of [ nav1 tab title, [ nav2 tab title, link file name ] ]
var nav2Table = new Array();
nav2Table[ nav2Table.length ] = new Array( "Home" );
nav2Table[ nav2Table.length ] = new Array( "Movies" );
nav2Table[ nav2Table.length ] = new Array( "Pictures", 
										new Array( "La Jolla", "lajolla.html"), 
										new Array("Family Tree", "familytree.html"),
										new Array("Recent Pictures", "recentpictures.html"),
										new Array("C D B!", "cdb.html")
									);
nav2Table[ nav2Table.length ] = new Array( "Games",
										new Array( "Downloads", "downloadgames.html" )
									);
nav2Table[ nav2Table.length ] = new Array( "OS X" );

//	Section 2: Functions to Draw the Logo and Motto Line of the table	
//	function logoBar():	Write to the document the logo bar description.
//						This will be written as the one element of a row in a table.
//	function randomMotto():	Write to the document an <img> tag for a random motto.
//	function randomInt(start,end): return a random int in the range [start,end).

function logoBar()
{
	document.write( "<table border='0' width='100%' cellspacing='0' cellpadding='0' align='center'>" );
	document.write( 	"<tr bgcolor='white'>" );
	document.write( 		"<td align='left'>" );
	document.write( 			"<img src='navbar/name.jpg' alt='William James' width='152' height='30' border='0' align='top'>" );
	document.write( 		"</td>" );
	document.write( 		"<td align='right'>" );
								randomMotto();
	document.write( 		"</td>" );
	document.write( 	"</tr>" );
	document.write( "</table>" );
}

function randomMotto()
{	
	var iMotto = randomInt( 0, mottoTable.length );
	document.write( "<img src='navbar/" );
	document.write( mottoTable[ iMotto ][0] );
	document.write("' alt='");
	document.write( mottoTable[ iMotto ][1] );
	document.write("' width='160' height='30' border='0' align='bottom'>" );
}

// return a random integer in the range [start,end)
function randomInt( start, end )
{
	return Math.floor(  start + (end-start) * Math.random() );
}

// Section 3: Functions to draw the navigation bars.
//	function drawNavBars():	write the navigation bars
//	function getWebPage(): find the entry in the webPage table for this document
//	function drawNav1Bar(webPage): draw the nav1 bar for this document
//	function drawNav2Bar(webPage): draw the nav2 bar for this document
//	function getNav2Titles(webPage): find the entry in the nav2Table for this document.

function drawNavBars()
{
// find the webPage for this document
	var thisPage = getWebPage();
// write the nav1Bar
	document.write("<tr bgcolor='white' align='top'>");
	document.write("<td>");
	drawNav1Bar( thisPage );
	document.write("</td>");
	document.write("</tr>");
// write the nav2 bar
	document.write("<tr bgcolor='#0000C0'>");
	document.write("<td>");
	drawNav2Bar( thisPage );
	document.write("</td>");
	document.write("</tr>");
}

function getWebPage()
{
	var i;
	for( i=0; i<webPages.length; i++ )
		if( webPages[i][0] == document.title )
			return webPages[i];
	return new Array("", "", "" );
}

// The nav1 bar is a table with tabs separated by shims
// The webPage is an array  [ document title, page file name, nav1 tab title ]
function drawNav1Bar( webPage )
{
	var imageName, fontColor, isLink;
	document.write("<table border='0' cellspacing='0' cellpadding='0' align='center'>");
	document.write("<tr>");
	document.write(	"<td background='shims/shim_white.gif' width='3' height='30'></td>");
	var i;
	for( i=0; i<nav1Table.length; i++ )
	{
		drawNav1Tab( nav1Table[i], webPage );
		document.write(	"<td background='shims/shim_white.gif' width='3' height='30'></td>");
	}
	document.write("</tr>");
	document.write("</table>");
}	

// write the <td>...</td> for the tab
// the tabTitle is [ nav1 tab title, link file name ]
// the webPage is [ document title, page file name, nav1 tab title ]
function drawNav1Tab( tabTitle, webPage )
{
// set the underlying image and overlaying font color
	var imageName = "navbar/tab.jpg";
	var fontColor = "#000000";
	if( tabTitle[0] == webPage[2] )
	{
		imageName = "navbar/tab_ov.jpg";
		fontColor = "#ffffff";
	}

// see if the tab is a link
	var isLink = true;
	if( tabTitle[1] == webPage[1] )
		isLink = false;
		
	document.write( "<td background = '" );
		document.write(		imageName );
		document.write(		"' width='110' height='30' align='center'>");
	if( isLink )
	{
			document.write(		"<A href = '");
			document.write(				tabTitle[1] );
			document.write(				"'");	
	}
	document.write( 	"<center><font size='4' color='" );
		document.write( 	fontColor );
		document.write(		"' face='chicago'>" );
	document.write( 		tabTitle[0] );
	document.write( 	"</font></Center>" );

	if( isLink )
	{
			document.write(		"</A>" );
	
	}
	document.write( "</td>" );
}

//	function drawNav2Bar(webPage): draw the nav2 bar for this document
//	This should be something that fits within the <td></td> provided by the caller.
//	The format is a table containing 3 elements:
//	aligned left, a white shim to set the height
//	aligned center, a table containing any nav2 links
//	aligned right, a link to mail.
//
// The webPage is an array  [ document title, page file name, nav1 tab title ]
function drawNav2Bar( webPage )
{
	nav2Tabs = getNav2Titles( webPage );
	
	document.write("<table border='0' cellspacing='0' cellpadding='0' width='100%'>");
	document.write("<tr>");
	// white shim on left to set the height of the bar
		document.write("<td align='left'>");
			document.write("<img src='images/shim_white.gif' alt='' width='1' height='30' border='0' align='top'>");	
		document.write("</td>");
		
	// list of nav2 tabs/links.  If there are none, do nothing.
		document.write("<td align='center'>");

			if( nav2Tabs.length > 1 )
			{
				document.write( "<table border='0' cellspacing='0' cellpadding='0' align='center'>" );
				document.write(		"<tr>" );
				document.write(		"<td><img src='shims/shim_white.gif' alt='' width='3' height='20' border='0' valign='middle'></td>" );
				var i;
				for( i=1; i<nav2Tabs.length; i++ )
				{
					document.write(	"<td height='30' width=110>" );
					var isLink = true;
					if( nav2Tabs[i][1] == webPage[1] )
						isLink = false;
					if( isLink )
					{
						document.write(	"<A href='" );
							document.write( nav2Tabs[i][1] );
							document.write(		"'>" );
					}
					document.write(		"<center><font size='3' color='white' face='chicago'>" );
						document.write(	 nav2Tabs[i][0] );
						document.write(	"</font><center>" );
					if( isLink )
						document.write(	"</A>" );
					document.write(	"</td>" );
					document.write(	"<td><img src='shims/shim_white.gif' alt='' width='3' height='20' border='0' valign='middle'></td>" );
				}
				document.write(		"</tr>" );
				document.write( "</table>" );
			}
		document.write("</td>");
		
	// e-mail link on the right
		document.write("<td align='right'>");
			document.write("<A href='mailto:wjamessprint10@earthlink.net?subject=" + webPage[0] + "'>");
			document.write("<font size='2' color='white' face='chicago'>");
			document.write("e-mail me:  ");
			document.write("</font>");
			document.write("</A>");	
		document.write("</td>");
	document.write("</tr>");
	document.write("</table>");
}

//	function getNav2Titles(webPage): find the entry in the nav2Table for this document.
// The webPage is an array  [ document title, page file name, nav1 tab title ]
// The nav2Table is an array of [ nav1 tab title, [ nav2 tab title, link file name ] ]
function getNav2Titles( webPage )
{
	var tab1Title = webPage[2];
	var i;
	for( i=0; i<nav2Table.length; i++ )
		if( nav2Table[i][0] == tab1Title )
		{
			return nav2Table[i];
		}
	return new Array("");
}

function writeNav2Table()
{
// The nav2Table is an array of [ nav1 tab title, [ nav2 tab title, link file name ] ]
	document.write("<P> nav2Table has " + nav2Table.length + " elements.");
	var i;
	for(i=0; i<nav2Table.length; i++ )
	{
		document.write("<P>nav2Table[" + i + "] = {" + nav2Table[i][0] );
		var j;
		for( j=1; j<nav2Table[i].length; j++ )
		{
			document.write(", [ " + nav2Table[i][j][0] + ", " + nav2Table[i][j][1] + " ] ");
		}
		document.write("}");
	}
}