/* 
YMCA Camp Coniston Staff Montage Script
Modified 100518
*/

function highpic(picnum){

var perpic = document.getElementById ('perpic');
var pername = document.getElementById ('pername');
var perhome = document.getElementById ('perhome');
var peryears = document.getElementById ('peryears');
var percabin = document.getElementById ('percabin');
var perdetail = document.getElementById ('perdetail');

perpic.src = '../staff2010/stafflg'+picnum+'.jpg'

perpic.alt = person[picnum]
pername.innerHTML = person[picnum]

//pername.innerHTML = picnum+'<br/>'+person[picnum]

perhome.innerHTML = personhome[picnum]+"<hr />"

peryears.innerHTML = "<img class='vertcent' src='../staff2010/camper.gif' height=14></img>  "+personyears[picnum]
percabin.innerHTML = "<img class='vertcent' src='../staff2010/cabin.gif' height=14></img>  "+personrole[picnum]
perdetail.innerHTML = "<hr />"+personnotes[picnum]


//if (personemail[picnum] == '')

//	peremail.innerHTML = 'Hometown: '+personhome[picnum]

//else

//	peremail.innerHTML = 'Email: <a href="mailto:'+personemail[picnum]+'">'+personemail[picnum]+'</a>'

}



// Write out table

//document.write ("Summer Staff 2008!")
document.write ("<table class='montage' style='width: 640;'>")

var picnum = 1001

var picnamebase = "staffsm"

var picname = ""



// do 3 rows of 16

for (var m_row = 1; m_row < 4; m_row++)

{

	document.write ("<tr class='montage'>")

	for (var m_col = 1; m_col < 17; m_col++)

	{

		picname = picnamebase+picnum+".jpg"

		document.write ("<td  class='montage' style='padding: 0px;' onMouseOver=highpic(", picnum,")><img alt='", person[picnum], "' src='../staff2010/", picname, "' height=40 width=40></img></td>")

		picnum++

	}

	document.write ("</tr>")

}



// do middle 7 rows by 3 then large image then 3

for (var m_row = 1; m_row < 7; m_row++)

{

	document.write ("<tr class='montage'>")

	for (var m_col = 1; m_col < 4; m_col++)

	{

		picname = picnamebase+picnum+".jpg"

		document.write ("<td  class='montage' style='padding: 0px;' onMouseOver=highpic(", picnum,")><img alt='", person[picnum], "' src='../staff2010/", picname, "' height=40 width=40></img></td>")

		picnum++

	}

	if (m_row == 1)

	{

		document.write ("<td class='piccell' rowspan=6 colspan=6><img id='perpic' src='../staff2010/porch.jpg' height=240 width=240></img></td>")

		document.write ("<td class='infocell' rowspan=6 colspan=4>")

		document.write ("<div id='pername' class='namefmt'>Move your mouse over a picture!</div>")

		document.write ("<div id='perhome' class='hometownfmt'></div>")

		document.write ("<div id='peryears' class='yearsfmt'>Pictures might take some time to load...</div>")

		document.write ("<div id='percabin' class='cabinfmt'>Please be patient...</div>")

		document.write ("<div id='perdetail' class='detailfmt'></div>")

		document.write ("</td>")

	}

	for (var m_col = 1; m_col < 4; m_col++)

	{

		picname = picnamebase+picnum+".jpg"

		document.write ("<td  class='montage' style='padding: 0px;' onMouseOver=highpic(", picnum,")><img alt='", person[picnum], "' src='../staff2010/", picname, "' height=40 width=40></img></td>")

		picnum++

	}

	document.write ("</tr>")

}



// do last 3 rows of 16

for (var m_row = 1; m_row < 10; m_row++)

{

	document.write ("<tr class='montage'>")

	for (var m_col = 1; m_col < 17; m_col++)

	{

		if (picnum <= maxstaff)

		{

			picname = picnamebase+picnum+".jpg"

			document.write ("<td  class='montage' style='padding: 0px;' onMouseOver=highpic(", picnum,")><img alt='", person[picnum], "' src='../staff2010/", picname, "' height=40 width=40></img></td>")

			picnum++

		}

	}

	document.write ("</tr>")

}



// finish table

document.write ("</table>")


/*
End of script
*/