//==========================================================
// Common javascript functions
//==========================================================

//----------------------------------------------------------
// overall main frame page for content
//----------------------------------------------------------
	var main_page = "index.html"; 
	
	var themeID;	// Page Theme: (b)lue, (g)reen, (y)ellow, (r)ed
	var sectionID;	// Page Section - Home:0, History:1, Concerts:2, Members:3,
			// Auditions:4, Photo Gallery:5, Alumni:6, Contact Us:7

//----------------------------------------------------------
// Toolbar Sections: homE, hisTORY, conCERTS, memBERS, 
//    audITIONS, phoTO GALLERY, aluMNI, cOntACT US
//----------------------------------------------------------
	var sectionArr = new Array();
	sectionArr[0] = "hom";
	sectionArr[1] = "his";
	sectionArr[2] = "con";
	sectionArr[3] = "mem";
	sectionArr[4] = "aud";
	sectionArr[5] = "pho";
	sectionArr[6] = "alu";
	sectionArr[7] = "cnt";
	
//----------------------------------------------------------
// color array
//----------------------------------------------------------
	var fgArr = new Array();
	fgArr[0] = "#00c";
	fgArr[1] = "#0c0";
	fgArr[2] = "#990";
	fgArr[3] = "#c00";
	fgArr[4] = "#00c";
	fgArr[5] = "#0c0";
	fgArr[6] = "#990";
	fgArr[7] = "#c00";

//----------------------------------------------------------
// msg array
//----------------------------------------------------------
	var msgArr = new Array();
	msgArr[0] = " ";
	msgArr[1] = "Musical Heirs: Home";
	msgArr[2] = "Musical Heirs: History";
	msgArr[3] = "Musical Heirs: Concerts";
	msgArr[4] = "Musical Heirs: Members";
	msgArr[5] = "Musical Heirs: Auditions";
	msgArr[6] = "Musical Heirs: Photo Gallery";
	msgArr[7] = "Musical Heirs: Alumni";
	msgArr[8] = "Musical Heirs: Contact Us";

//----------------------------------------------------------
// target page array
//----------------------------------------------------------
	var targetPageArr = new Array();
	targetPageArr[0] = "home.html";
	targetPageArr[1] = "history.html";
	targetPageArr[2] = "concerts.html";
	targetPageArr[3] = "members.html";
	targetPageArr[4] = "auditions.html";
	targetPageArr[5] = "gallery.html";
	targetPageArr[6] = "alumni.html";
	targetPageArr[7] = "contact.html";

//----------------------------------------------------------
// toolbar help information array
//----------------------------------------------------------
	var infoArr = new Array();
	infoArr[0] = "Musical Heirs Home Page...";
	infoArr[1] = "More information about our beginnings, vision, and purpose...";
	infoArr[2] = "Information on our upcoming concerts and venues...";
	infoArr[3] = "A special section with information for members only and their parents...";
	infoArr[4] = "Information about auditioning for Musical Heirs...";
	infoArr[5] = "Come view our photo gallery of past events and friends of Musical Heirs!";
	infoArr[6] = "A special section for former members of Musical Heirs - our Alumni!";
	infoArr[7] = "Please feel free to contact us to schedule an event with MH, or to inquire about more info...";

//----------------------------------------------------------
// force page content into frames
//----------------------------------------------------------
	function verifyFrames(url)
	{
		if (top.location == self.location)
			top.location.href = url+main_page;
	}

//----------------------------------------------------------
// specify images to preload
//----------------------------------------------------------
	function doPreload()
	{
		preload('imgs/ani/mh_logo_ani_flash.gif','imgs/b/b_bg_760x760.gif','imgs/g/g_bg_760x760.gif','imgs/y/y_bg_760x760.gif','imgs/r/r_bg_760x760.gif');
	}

//----------------------------------------------------------
// preload images specified onload
//----------------------------------------------------------
	function preload() 
	{
		var doc=document; 
		if(doc.images)
		{ 
			if(!doc.arry) doc.arry=new Array();
			var i,j=doc.arry.length,arg=preload.arguments; 
			for(i=0; i<arg.length; i++)
			{
				if (arg[i].indexOf("#")!=0)
				{ 
					doc.arry[j]=new Image; 
					doc.arry[j++].src=arg[i];
				}
			}
		}
	}

//----------------------------------------------------------
// Swap Images in Toolbar on MouseOver & MouseOut
//----------------------------------------------------------
	function swap(id,imgState) {	
	  
	  if (id != sectionID)
	  {
		var src  = "imgs/" + themeID + "/" + themeID + "_tb_ani_" + sectionArr[id] + "_" + imgState + ".gif";
		document["tb"+sectionArr[id]].src = src;		
		
		if(imgState==0)
		{
			document.getElementById("menuinfo").style.display="none";
			document.getElementById("menuslant").style.display="none";
			window.status=" ";
		}
		else
		{
			document.getElementById("menuinfo").innerText=infoArr[id];
			document.getElementById("menuinfo").style.color=fgArr[sectionID];
			document.getElementById("menuinfo").style.display="inline";
			document.getElementById("menuslant").style.display="inline";
			window.status=msgArr[id+1];
		}
	  }
	  else
	  {
		if(imgState==0)
		{
			document.getElementById("menuinfo").style.display="none";
			document.getElementById("menuslant").style.display="none";
			window.status=" ";
		}
		else
		{
			document.getElementById("menuinfo").innerText=infoArr[id];
			document.getElementById("menuinfo").style.color=fgArr[sectionID];
			document.getElementById("menuslant").style.display="inline";
			document.getElementById("menuinfo").style.display="inline";
			window.status=msgArr[id+1];			
		}
	  }
	}
	
//-----------------------------------------
// Jump To target page
//-----------------------------------------
	function jumpToPage(n)
	{
		top.main.location.href=targetPageArr[n];
	}
	
//-----------------------------------------
// Preload Toolbar on window load
//-----------------------------------------
	function renderTB(id)
	{
		//---------------------------------
		// Preset Toolbar
		//---------------------------------
		var str;
		str = '<div id="toolbar" style="position:absolute;top:167;left:162;display:inline;z-index:1001;">';
		str += '<table cellpadding=0 cellspacing=0>';
		str += '	<tr valign="top">';
		str += '		<td align="left">';
		str += '			<img id="tbhom" name="tbhom" style="cursor:hand;" border="0" width="65" height="28"';
		str += '			onmouseover="swap(0,1);" onmouseout="swap(0,0);" onclick="jumpToPage(0);">';
		str += '		</td>';
		str += '		<td align="left">';
		str += '			<img id="tbhis" name="tbhis" style="cursor:hand;" border="0" width="64" height="28"';
		str += '			onmouseover="swap(1,1);" onmouseout="swap(1,0);" onclick="jumpToPage(1);">';
		str += '		</td>';
		str += '		<td align="left">';
		str += '			<img id="tbcon" name="tbcon" style="cursor:hand;" border="0" width="69" height="28"';
		str += '			onmouseover="swap(2,1);" onmouseout="swap(2,0);" onclick="jumpToPage(2);">';
		str += '		</td>';
		str += '		<td align="left">';
		str += '			<img id="tbmem" name="tbmem" style="cursor:hand;" border="0" width="71" height="28"';
		str += '			onmouseover="swap(3,1);" onmouseout="swap(3,0);" onclick="jumpToPage(3);">';
		str += '		</td>';
		str += '		<td align="left">';
		str += '			<img id="tbaud" name="tbaud" style="cursor:hand;" border="0" width="73" height="28"';
		str += '			onmouseover="swap(4,1);" onmouseout="swap(4,0);" onclick="jumpToPage(4);">';
		str += '		</td>';
		str += '		<td align="left">';
		str += '			<img id="tbpho" name="tbpho" style="cursor:hand;" border="0" width="94" height="28"';
		str += '			onmouseover="swap(5,1);" onmouseout="swap(5,0);" onclick="jumpToPage(5);">';
		str += '		</td>';
		str += '		<td align="left">';
		str += '			<img id="tbalu" name="tbalu" style="cursor:hand;" border="0" width="60" height="28"';
		str += '			onmouseover="swap(6,1);" onmouseout="swap(6,0);" onclick="jumpToPage(6);">';
		str += '		</td>';
		str += '		<td align="left">';
		str += '			<img id="tbcnt" name="tbcnt" style="cursor:hand;" border="0" width="78" height="28"';
		str += '			onmouseover="swap(7,1);" onmouseout="swap(7,0);" onclick="jumpToPage(7);">';
		str += '		</td>';
		str += '	</tr>';
		str += '</table>';
		str += '</div>';
		document.write(str);
		
		//---------------------------------
		// Preload toolbar information bar
		//---------------------------------
		str =  '<div id="menuinfo" ';
		str += 'style="position:absolute;top:194;left:212;width:450;height:20;z-index:1001;';
		str += 'display:none;padding-left:4px;';
		str += 'font-family:tahoma;font-size:11px;';
		//str += 'background-color:#fff;filter:alpha(opacity=55);';
		str += '">';
		str += '</div>';
		document.write(str);
		
		//---------------------------------
		// Preload toolbar slant image (+1, +15)
		//---------------------------------
		str =  '<div id="menuslant" style="position:absolute;top:195;left:227;z-index:1000;display:none;">';
		str += '<img id="imgslant" src="imgs/' + themeID + '/' + themeID + '_submenu_slant_492x22.gif" width="492" height="22" border="0">';
		str += '</div>';
		document.write(str);
		
		//---------------------------------
		// Assign images to Toolbar
		//---------------------------------
		var src;		
		for (i=0;i<sectionArr.length;i++)
		{
			if (i == id)
			{
				src = "imgs/" + themeID + "/" + themeID + "_tb_ani_" + sectionArr[i] + "_1.gif";
			}
			else
			{
				//src = "imgs/" + themeID + "/" + themeID + "_tb_ani_" + sectionArr[i] + "_0.gif"; // Animated Preloaded Toolbar
				src = "imgs/" + themeID + "/" + themeID + "_tb_sta_" + sectionArr[i] + "_00.gif"; // Static Preloaded Toolbar
			}

			document["tb"+sectionArr[i]].src = src;
		}		
	}	

//----------------------------------------------------------
// Renders the current date: Day, Month dd, yyyy
//----------------------------------------------------------
	function getCurrentDate()
	{
		// This array holds the "friendly" day names
		var day_names = new Array(7)
		day_names[0] = "Sunday"
		day_names[1] = "Monday"
		day_names[2] = "Tuesday"
		day_names[3] = "Wednesday"
		day_names[4] = "Thursday"
		day_names[5] = "Friday"
		day_names[6] = "Saturday"

		// This array holds the "friendly" month names
		var month_names = new Array(12)
		month_names[0] = "January"
		month_names[1] = "February"
		month_names[2] = "March"
		month_names[3] = "April"
		month_names[4] = "May"
		month_names[5] = "June"
		month_names[6] = "July"
		month_names[7] = "August"
		month_names[8] = "September"
		month_names[9] = "October"
		month_names[10] = "November"
		month_names[11] = "December"

		// Get the current date
		date_now = new Date()

		// Figure out the friendly day name
		day_value = date_now.getDay()
		date_text = day_names[day_value]

		// Figure out the friendly month name
		month_value = date_now.getMonth()
		date_text += ", " + month_names[month_value]

		// Add the day of the month
		date_text += " " + date_now.getDate()

		// Add the year
		date_text += ", " + date_now.getFullYear()
		//date_text = "Wednesday, December 31, 2007";
		return date_text;	
	}
	
//----------------------------------------------------------
// render all layout images based on absolute positioning
//----------------------------------------------------------
	function renderLayout(id)
	{
		var str;
		
		// Set Page Background
		str = '<div id="bg" style="position:absolute;top:0;left:0;display:inline;z-index:-1;">';
		str += '<img src="imgs/' + themeID + '/' + themeID + '_bg_760x760.gif" width="760" height="760" border="0">';
		str += '</div>';
		document.write(str);

		// Set MH Logo
		str = '<div id="mh_logo" style="position:absolute;top:17;left:22;display:inline;z-index:-1;">';
		str += '<a href="home.html"><img src="imgs/'+themeID+'/'+themeID+'_mh_logo_131x165.gif" width="131" height="165" border="0"></a>';
		str += '</div>';
		document.write(str);

		// Set Animated MH Logo
		if (!top.vars.ani_logo_flag)
		{
			str = '<div id="mh_logo_ani" style="position:absolute;top:40;left:24;display:inline;z-index:-1;">';
			str += '<a href="home.html"><img src="imgs/mh_logo_ani_flash.gif" width="127" height="127" border="0"></a>';
			str += '</div>';
			document.write(str);

			str = '<div id="blog_news" style="position:absolute;top:18;left:423;display:inline;z-index:-1;">';
			str += '<table width="260" height="14" cellpadding="0" cellspacing="0" border="0"><tr valign="top"><td style="border:1px solid #000;background-color:#F8761E;color:#ffffff;line-height:15px;font-size:11px;font-family:arial;font-weight:bold;" align="right">';
			str += 'Check out our Musical Heirs Blogger Site &ndash;&rarr;&nbsp;&nbsp;';
			str += '</td></tr></table>';
			str += '</div>';
			document.write(str);

			top.vars.ani_logo_flag=true;

		}

		// Set Curved Section Name
		str = '<div id="vSection" style="position:absolute;top:195;left:0;display:inline;z-index:-1;">';
		str += '<img src="imgs/'+themeID+'/'+themeID+'_vt_'+sectionArr[id]+'_210x310.gif" width="210" height="310" border="0">';
		str += '</div>';
		document.write(str);
		
		// Set and display current date
		str = '<div id="currentDate" style="position:absolute;top:0;left:491;display:inline;z-index:-1;">';
		str += '<table width="250" cellpadding="0" cellspacing="0" border="0"><tr valign="top"><td class="datetime" align="right">';
		str += getCurrentDate();
		str += '</td></tr></table>';
		str += '</div>';
		document.write(str);
		
		// Display blogger logo and link
		str = '<div id="blogspot" style="position:absolute;top:18;left:491;display:inline;z-index:-1;">';
		str += '<table width="250" cellpadding="0" cellspacing="0" border="0"><tr valign="top"><td class="datetime" align="right">';
		str += '<a href="http://musicalheirs.blogspot.com"><img src="imgs/mh_blog_ani_53x15.gif" width="53" height="15" border="0" style="border:1px solid #000;" alt="Musical Heirs Blogger"></a>';
		str += '</td></tr></table>';
		str += '</div>';
		document.write(str);
		
		// Set Photo Slideshow Images
		str = '<div id="slideshow" style="position:absolute;top:40;left:175;display:inline;z-index:1000;">';
		str += '<table cellpadding="0" cellspacing="0" border="0">';
		str += '   <tr>';
		str += '      <td id="F1" width="113" height="127"><img src="imgs/photos/a01.gif" name="SlideShow01" width="113" height="127"></td>';
		str += '      <td id="F2" width="113" height="127"><img src="imgs/photos/b01.gif" name="SlideShow02" width="113" height="127"></td>';
		str += '      <td id="F3" width="113" height="127"><img src="imgs/photos/c01.gif" name="SlideShow03" width="113" height="127"></td>';
		str += '      <td id="F4" width="113" height="127"><img src="imgs/photos/d01.gif" name="SlideShow04" width="113" height="127"></td>';
		str += '      <td id="F5" width="113" height="127"><img src="imgs/photos/e01.gif" name="SlideShow05" width="113" height="127"></td>';
		str += '   </tr>';
		str += '</table></div>';
		document.write(str);		
		
		var bgFilterColor;
		if (themeID == 'b') bgFilterColor = "#00f";
		if (themeID == 'r') bgFilterColor = "#f00";
		if (themeID == 'g') bgFilterColor = "#0f3";
		if (themeID == 'y') bgFilterColor = "#ff0";
		
		// Display Back navigation link on top right corner
		str = '<div id="navBack" style="display:none;position:absolute;top:220;left:675;font-size:11px;cursor:hand;"><a class="text" href="javascript:history.back()">&laquo;&nbsp;Back</a></div>';
		document.write(str);
		
		// Display color filters over photos
		/*
		str = '<div id="color-filters" style="position:absolute;display:inline;top:42;left:177;z-index:1000;">';
		str += '<table cellpadding="0" cellspacing="0" border="0">';
		str += '   <tr>';
		str += '      <td width="111" height="123"><img src="imgs/clear.gif" width="111" height="123" ';
		str += ' style="filter:alpha(opacity=35); background-color:' + bgFilterColor + ';"></td>';
		str += '      <td width="2" height="123"><img src="imgs/clear.gif" width="2" height="123" ';
		str += ' style="background-color:#fff;"></td>';
		str += '      <td width="111" height="123"><img src="imgs/clear.gif" width="111" height="123" ';
		str += ' style="filter:alpha(opacity=35); background-color:' + bgFilterColor + ';"></td>';
		str += '      <td width="2" height="123"><img src="imgs/clear.gif" width="2" height="123" ';
		str += ' style="background-color:#fff;"></td>';
		str += '      <td width="111" height="123"><img src="imgs/clear.gif" width="111" height="123" ';
		str += ' style="filter:alpha(opacity=35); background-color:' + bgFilterColor + ';"></td>';
		str += '      <td width="2" height="123"><img src="imgs/clear.gif" width="2" height="123" ';
		str += ' style="background-color:#fff;"></td>';
		str += '      <td width="111" height="123"><img src="imgs/clear.gif" width="111" height="123" ';
		str += ' style="filter:alpha(opacity=35); background-color:' + bgFilterColor + ';"></td>';
		str += '      <td width="2" height="123"><img src="imgs/clear.gif" width="2" height="123" ';
		str += ' style="background-color:#fff;"></td>';
		str += '      <td width="109" height="123"><img src="imgs/clear.gif" width="109" height="123" ';
		str += ' style="filter:alpha(opacity=35); background-color:' + bgFilterColor + ';"></td>';
		str += '   </tr>';
		str += '</table></div>';
		document.write(str);
		*/
	}

//----------------------------------------------------------
// display popup window
//----------------------------------------------------------
	function popUp(URL,TB,SB,MB,RZ,W,H,L,T)
	{
		win = window.open(URL, 'newwin', 'toolbar='+TB+',scrollbars='+SB+',location=0,statusbar=0,menubar='+MB+',resizable='+RZ+',width='+W+',height='+H+',left='+L+',top='+T);
		if (parseInt(navigator.appVersion) >= 4) { win.window.focus(); }
	}

//----------------------------------------------------------
// substring function similar to Left
//----------------------------------------------------------
	function Left(str, n)
	{
		if (n <= 0)
		    return "";
		else if (n > String(str).length)
		    return str;
		else
		    return String(str).substring(0,n);
	}

//----------------------------------------------------------
// substring function similar to Right
//----------------------------------------------------------
	function Right(str, n)
	{
	    if (n <= 0)
	       return "";
	    else if (n > String(str).length)
	       return str;
	    else {
	       var iLen = String(str).length;
	       return String(str).substring(iLen, iLen - n);
	    }
	}

//----------------------------------------------------------
// include relevant style sheet based on browser version
//----------------------------------------------------------
	browser = navigator.appName;
	appVer = parseInt(navigator.appVersion);
	ie = "Microsoft Internet Explorer";
	ns = "Netscape";
	if (navigator.appVersion.indexOf("Macintosh") != -1)
	{
		isMac = true;
	}
	else 
	{
		isMac = false;
	}
	if (document.getElementById)
	{ // IE Style
		document.write('<link rel="stylesheet" type="text/css" href="includes/css/'+themeID+'_ie5Style.css" title="master">');
		//alert('<link rel="stylesheet" type="text/css" href="includes/css/'+themeID+'_ie5Style.css" title="master">');
	} 
	else
	{
		alert("This site is best experienced when viewed using Microsoft Internet Explorer.");
		if (browser == ns && isMac == false)
		{
			if (appVer > 3)
			{ // Netscape Style
				document.write('<link rel="stylesheet" type="text/css" href="includes/css/'+themeID+'_ns4style.css" title="master">');
			}
		}
		else if (browser == ie && isMac == true)
		{ // IE Mac Style
			document.write('<link rel="stylesheet" type="text/css" href="includes/css/'+themeID+'_ie5Style.css" title="master">');
		}
		else if (browser == ns && isMac == true)
		{ // NS Mac Style
			document.write('<link rel="stylesheet" type="text/css" href="includes/css/'+themeID+'_ns4style.css" title="master">');
		}
		else
		{ // IE Style
			document.write('<link rel="stylesheet" type="text/css" href="includes/css/'+themeID+'_ie5style.css" title="master">');
		}
	}


//----------------------------------------------------------
// Set slideShowSpeed (milliseconds)
//----------------------------------------------------------
var slideShowSpeed = 4000;

//----------------------------------------------------------
// Duration of crossfade (seconds)
//----------------------------------------------------------
var crossFadeDuration = 3;

//----------------------------------------------------------
// Specify the image files
//----------------------------------------------------------
var Pic1 = new Array();
var Pic2 = new Array();
var Pic3 = new Array();
var Pic4 = new Array();
var Pic5 = new Array();

Pic1[00] = 'imgs/photos/a01.gif';
Pic1[01] = 'imgs/photos/a02.gif';
Pic1[02] = 'imgs/photos/a03.gif';
Pic1[03] = 'imgs/photos/a04.gif';
Pic1[04] = 'imgs/photos/a05.gif';
Pic1[05] = 'imgs/photos/a01.gif';

Pic2[00] = 'imgs/photos/b01.gif';
Pic2[01] = 'imgs/photos/b02.gif';
Pic2[02] = 'imgs/photos/b03.gif';
Pic2[03] = 'imgs/photos/b04.gif';
Pic2[04] = 'imgs/photos/b05.gif';
Pic2[05] = 'imgs/photos/b01.gif';

Pic3[00] = 'imgs/photos/c01.gif';
Pic3[01] = 'imgs/photos/c02.gif';
Pic3[02] = 'imgs/photos/c03.gif';
Pic3[03] = 'imgs/photos/c04.gif';
Pic3[04] = 'imgs/photos/c05.gif';
Pic3[05] = 'imgs/photos/c01.gif';

Pic4[00] = 'imgs/photos/d01.gif';
Pic4[01] = 'imgs/photos/d02.gif';
Pic4[02] = 'imgs/photos/d03.gif';
Pic4[03] = 'imgs/photos/d04.gif';
Pic4[04] = 'imgs/photos/d05.gif';
Pic4[05] = 'imgs/photos/d01.gif';

Pic5[00] = 'imgs/photos/e01.gif';
Pic5[01] = 'imgs/photos/e02.gif';
Pic5[02] = 'imgs/photos/e03.gif';
Pic5[03] = 'imgs/photos/e04.gif';
Pic5[04] = 'imgs/photos/e05.gif';
Pic5[05] = 'imgs/photos/e06.gif';

//----------------------------------------------------------
// Specify image titles
//----------------------------------------------------------
var imgTitle1 = new Array();
var imgTitle2 = new Array();
var imgTitle3 = new Array();
var imgTitle4 = new Array();
var imgTitle5 = new Array();

imgTitle1[00] = 'Grace';
imgTitle1[01] = 'Robbie';
imgTitle1[02] = 'Katie';
imgTitle1[03] = 'Jed';
imgTitle1[04] = 'Mallory';
imgTitle1[05] = 'Grace';

imgTitle2[00] = 'Mary Ashelyn';
imgTitle2[01] = 'Julia';
imgTitle2[02] = 'Caleb';
imgTitle2[03] = 'Marianna';
imgTitle2[04] = 'Mary';
imgTitle2[05] = 'Mary Ashelyn';

imgTitle3[00] = 'Patrick';
imgTitle3[01] = 'Joanna';
imgTitle3[02] = 'Paul';
imgTitle3[03] = 'Leah';
imgTitle3[04] = 'Sam';
imgTitle3[05] = 'Patrick';

imgTitle4[00] = 'Deborah';
imgTitle4[01] = 'Christopher';
imgTitle4[02] = 'Christina';
imgTitle4[03] = 'Josh';
imgTitle4[04] = 'Jenna';
imgTitle4[05] = 'Deborah';

imgTitle5[00] = 'Rose';
imgTitle5[01] = 'Brendan';
imgTitle5[02] = 'Bethany';
imgTitle5[03] = 'Peter';
imgTitle5[04] = 'Laura';
imgTitle5[05] = 'David';

//----------------------------------------------------------
// do not edit anything below this line
//----------------------------------------------------------
var t_ss;
var j = 0;
var p = Pic1.length;

var preLoad1 = new Array();
var preLoad2 = new Array();
var preLoad3 = new Array();
var preLoad4 = new Array();
var preLoad5 = new Array();

for (i = 0; i < p; i++){
   preLoad1[i] = new Image();
   preLoad1[i].src = Pic1[i];

   preLoad2[i] = new Image();
   preLoad2[i].src = Pic2[i];

   preLoad3[i] = new Image();
   preLoad3[i].src = Pic3[i];

   preLoad4[i] = new Image();
   preLoad4[i].src = Pic4[i];

   preLoad5[i] = new Image();
   preLoad5[i].src = Pic5[i];
   
   imgTitle1[i] = 'Musical Heirs';
   imgTitle2[i] = 'Musical Heirs';
   imgTitle3[i] = 'Musical Heirs';
   imgTitle4[i] = 'Musical Heirs';
   imgTitle5[i] = 'Musical Heirs';
}

function runSlideShow()
{
   var rand01=Math.floor(Math.random()*5);
   var rand02=Math.floor(Math.random()*5);
   var rand03=Math.floor(Math.random()*5);
   var rand04=Math.floor(Math.random()*5);
   var rand05=Math.floor(Math.random()*5);
   
   //run Slideshow for F1
   if (document.all){
      document.images.SlideShow01.style.filter="blendTrans(duration=1)";
      document.images.SlideShow01.style.filter="blendTrans(duration=crossFadeDuration)";
      document.images.SlideShow01.filters.blendTrans.Apply();
   }
   document.images.SlideShow01.src = preLoad1[rand01].src;
   document.images.SlideShow01.title = imgTitle1[rand01];
   if (document.all){
      document.images.SlideShow01.filters.blendTrans.Play();
   }

   //run Slideshow for F2
   if (document.all){
      document.images.SlideShow02.style.filter="blendTrans(duration=1)";
      document.images.SlideShow02.style.filter="blendTrans(duration=crossFadeDuration)";
      document.images.SlideShow02.filters.blendTrans.Apply();
   }
   document.images.SlideShow02.src = preLoad2[rand02].src;
   document.images.SlideShow02.title = imgTitle2[rand02];
   if (document.all){
      document.images.SlideShow02.filters.blendTrans.Play();
   }

   //run Slideshow for F3
   if (document.all){
      document.images.SlideShow03.style.filter="blendTrans(duration=1)";
      document.images.SlideShow03.style.filter="blendTrans(duration=crossFadeDuration)";
      document.images.SlideShow03.filters.blendTrans.Apply();
   }
   document.images.SlideShow03.src = preLoad3[rand03].src;
   document.images.SlideShow03.title = imgTitle3[rand03];
   if (document.all){
      document.images.SlideShow03.filters.blendTrans.Play();
   }

   //run Slideshow for F4
   if (document.all){
      document.images.SlideShow04.style.filter="blendTrans(duration=1)";
      document.images.SlideShow04.style.filter="blendTrans(duration=crossFadeDuration)";
      document.images.SlideShow04.filters.blendTrans.Apply();
   }
   document.images.SlideShow04.src = preLoad4[rand04].src;
   document.images.SlideShow04.title = imgTitle4[rand04];
   if (document.all){
      document.images.SlideShow04.filters.blendTrans.Play();
   }

   //run Slideshow for F5
   if (document.all){
      document.images.SlideShow05.style.filter="blendTrans(duration=1)";
      document.images.SlideShow05.style.filter="blendTrans(duration=crossFadeDuration)";
      document.images.SlideShow05.filters.blendTrans.Apply();
   }
   document.images.SlideShow05.src = preLoad5[rand05].src;
   document.images.SlideShow05.title = imgTitle5[rand05];
   if (document.all){
      document.images.SlideShow05.filters.blendTrans.Play();
   }

   //j = j + 1
   //if (j > (p-1)) j=0
   //{
      t_ss = setTimeout('runSlideShow()', slideShowSpeed)
   //}
}

function showBackLink(v)
{
   var state="none";
   if(v==1) state="inline";
   document.getElementById("navBack").style.display=state;   
}


function renderThumbs(yr,pg,cnt)
{
   var str = "<table cellpadding='1' cellspacing='1'>";
   var mask = "";
   var cols = 1;
   if (cnt>0)
   {
      str +="<tr valign='top'>";
      i=1;
      while(i<=cnt)
      {
         if (i<1000) mask = "0";
         if (i<100) mask = "00";
         if (i<10) mask = "000";
         str += "<td bgcolor='#000000'>";
         str += "<a title='"+mask+i.toString()+"' href='javascript:popUp(\"imgs/gallery/"+yr+"/"+pg+"/IMG_"+mask+i.toString()+"-500.jpg\",0,0,0,1,520,520,((screen.width-520)/2),((screen.height-520)/2))'>";
         str += "<img src='imgs/gallery/"+yr+"/"+pg+"/IMG_"+mask+i.toString()+"-100.jpg' width='100' border='0'></a>";
         str += "</td>";
         if(cols == 5)
         {
            str += "</tr><tr valign='top'>";
            cols = 0;
         }
         i++;
         cols++;  // keep track of columns count
      }
      
      if (cols <= 5)
      {
         i=1;
         blanks = 6-cols;
         while(i<blanks)
         {
            str += "<td>&nbsp;</td>";
            i++;
         }
      }
      str += "</tr></table>";
      document.write(str);
   }
}

function displayRandomQuote()
{   
   var vcolor = '#fff';
   if ( sectionID == 2 || sectionID == 6 ) vcolor='#440';
   var divStart = '<div id="quote" style="position:absolute;top:203;left:19;font-family:arial;font-size:11px;color:'+vcolor+';line-height:13px;">';
   var divEnd = '</div>';
   var quoteList = new Array();
   var rand=Math.floor(Math.random()*5);
   
   quoteList[0] = '"The human voice is<br>&nbsp;&nbsp;the most beautiful<br>&nbsp;&nbsp;instrument of all,<br>&nbsp;&nbsp;but it is the most<br>&nbsp;&nbsp;difficult to play."<br>&nbsp;&nbsp;~ <i>Richard<br>&nbsp;&nbsp;&nbsp;&nbsp;Strauss</i>';
   quoteList[1] = '"The aim and final<br>&nbsp;&nbsp;end of all music<br>&nbsp;&nbsp;should be none<br>&nbsp;&nbsp;other than the<br>&nbsp;&nbsp;glory of God<br>&nbsp;&nbsp;and the<br>&nbsp;&nbsp;refreshment<br>&nbsp;&nbsp;of the soul."<br>&nbsp;&nbsp;~ <i>Johannes<br>&nbsp;&nbsp;&nbsp;&nbsp;Sebastian<br>&nbsp;&nbsp;&nbsp;Bach';
   quoteList[2] = '"My Lord, I should be<br>&nbsp;&nbsp;sorry if I only<br>&nbsp;&nbsp;entertained them;<br>&nbsp;&nbsp;I wished to make<br>&nbsp;&nbsp;them better."<br>&nbsp;&nbsp;~ <i>George<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Frederic<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Handel</i>';
   quoteList[3] = '"Music is an agreeable <br>&nbsp;&nbsp;harmony for the honor <br>&nbsp;&nbsp;of God and the <br>&nbsp;&nbsp;permissible delights <br>&nbsp;&nbsp;of the soul."<br>&nbsp;&nbsp;~ <i>Johannes<br>&nbsp;&nbsp;&nbsp;&nbsp;Sebastian<br>&nbsp;&nbsp;&nbsp;Bach';
   quoteList[4] = '"The human voice is<br>&nbsp;&nbsp;the most beautiful<br>&nbsp;&nbsp;instrument of all,<br>&nbsp;&nbsp;but it is the most<br>&nbsp;&nbsp;difficult to play."<br>&nbsp;&nbsp;~ <i>Richard<br>&nbsp;&nbsp;&nbsp;&nbsp;Strauss</i>';

   var quoteText = divStart + quoteList[rand] + divEnd;
   
   document.write(quoteText);  
}

displayRandomQuote();