// Javascript functions.
//alert ("globals");
var gFadeTimerVal;
var gFadeMode=0;
var gNumberOfBannerImages;		// Keeps track of the number of images in the banner.  Set by InsertImageBanner().
var gFadeTransitionTime = 2000;	// The time it takes to transittion between two images.
var gTimeBetweenPictures=8000;	// How often the banner changes images.
var gShortDelay=100;

// This is the menu shared on all pages.
function CommonMenu()
{
	//alert("CommonMenu()");
	var menu;
	menu =  "<ul class=\"textMenu\"> ";
//	menu += "<li class=\"active\"><a href=\"index.html\" onmouseover=\"ShowHomeSub()\">Home</a><ul id=\"subOne\" class=\"subMenu\"><a href=\"index.html\">HomeSub1</a><a href=\"index.html\">HomeSub2</a></ul></li> ";
	menu += "<li class=\"active\"><a href=\"index.html\">Home</a></li> ";
	menu += "<li><a href=\"beliefs.html\">Beliefs</a></li> ";
	menu += "<li><a href=\"evangel.html\">Outreach</a></li> ";
	menu += "<li><a href=\"events.html\">Events</a></li> ";
	//menu += "<li><a href=\"faithraising.html\">Faithraising</a></li> ";
	menu += "<li><a href=\"fellowship.html\">Fellowship</a></li> ";
//	menu += "<li><a href=\"join.html\">How to Join</a></li> ";
	menu += "<li><a href=\"missions.html\">Missions</a> </li> ";
	menu += "<li><a href=\"music.html\">Music Ministry</a> </li><br /> ";
	menu += "<li><a href=\"preschool.html\">Preschool</a> </li> ";
	menu += "<li><a href=\"staff.html\">Meet the Staff</a></li> ";
	menu += "<li><a href=\"worship.html\">Worship Services</a></li> ";
	menu += "<li><a href=\"youth.html\">Youth Ministry</a></li> ";
	menu += "<li><a href=\"friends.html\">Children's Ministry</a></li> ";
	menu += "</ul>";

	document.write(menu);
}

function ShowHomeSub()
{
	alert("hover");
	var x=document.getElementById("subOne");
	$('.subOne').toggle();
}

// This is the content of the left column in all pages.
function LeftColumn()
{
	var leftcolumn;
	leftcolumn =  "<ul> ";
	leftcolumn += "<li> ";
	leftcolumn += "<h2>Upcoming Events</h2> ";
	leftcolumn += "<ul class=\"list\">";
//	leftcolumn += "<li><a style=\"color: #222222\">Wednesday, December 7<sup>th</sup></a>:<br />  <a href=\"worship.html#advent\">2<sup>nd</sup> Wednesday Advent Service</a> </li> ";
//	leftcolumn += "<li><a style=\"color: #222222\">Tuesday, December 13<sup>th</sup>:</a><br />  <a href=\"events.html#colonial\">Colonial Care's Benefit Night</a> </li> ";
//	leftcolumn += "<li>Wednesday, December 14<sup>th</sup>:<br />  <a href=\"worship.html#advent\">3<sup>rd</sup> Wednesday Advent Service</a> </li> ";
//	leftcolumn += "<li><a style=\"color: #222222\">December 24<sup>th</sup> and 25<sup>th</sup></a>:<br />  <a href=\"worship.html#christmas\">Christmas Services</a> </li> ";
//	leftcolumn += "<li><a style=\"color: #222222\">Sunday, January 1<sup>st</sup></a>:<br />  <a href=\"events.html#newyears\">New Years Day Service</a> </li> ";
//	leftcolumn += "<li><a style=\"color: #222222\">Tuesday, January 3<sup>rd</sup></a>:<br />  <a href=\"events.html#finance\">Financial Peace University</a><br /><a href=\"http://www.daveramsey.com/fpu/locations/org/37651/class/200697\" target=\"_blank\"><img src=\"images/financial_peace.bmp\" alt=\"financial peace\" width=\"160\" height=\"50\"  style=\"padding:5px 10px 0px 0px; border:none;\" /></a> </li> ";
//	leftcolumn += "<li><a style=\"color: #222222\">Sunday February 12<sup>th</sup></a>:<br />  <a href=\"index.html#swanson\">Welcome Pastor Swanson</a> </li>";
	leftcolumn += "<li><a style=\"color: #222222\">Saturday February 25<sup>th</sup></a>:<br />  <a href=\"events.html#bunco\">Pizza/Bunco Nite</a> </li>";
	leftcolumn += "<li><a style=\"color: #222222\">Sunday February 26<sup>th</sup></a>:<br />  <a href=\"worship.html#meetgreet\">Meet&Greet/Pastor QA</a> </li>";
	leftcolumn += "<li><a style=\"color: #222222\">Tuesdays, through March 27<sup>th</sup></a>:<br />  <a href=\"events.html#finance\">Financial Peace University</a><br /><a href=\"events.html#finance\" ><img src=\"images/financial_peace.bmp\" alt=\"financial peace\" width=\"160\" height=\"50\"  style=\"padding:5px 10px 0px 0px; border:none;\" /></a> </li> ";
	leftcolumn += "<li><a style=\"color: #222222\">Wednesdays, throughout the school year</a>:<br />  <a href=\"friends.html#friends\">Children's Ministry (Friends)</a> </li> ";
	leftcolumn += "<li><a style=\"color: #222222\">Wednesdays, Feb. 22<sup>nd</sup> through March 28<sup>th</sup></a>:<br />  <a href=\"friends.html#lent\">Childrens's Ministry - Lent</a> </li> ";
	leftcolumn += "<li><a style=\"color: #222222\">February 22<sup>nd</sup> through April 8<sup<th</sup></a>:<br />  <a href=\"worship.html#lent\">Lent and Easter Services</a> </li> ";
	leftcolumn += "<li><a style=\"color: #222222\">Saturday May 12<sup>th</sup></a>:<br />  <a href=\"motherdaughter.html\">Mother-Daughter Tea Party</a> </li>";
//	leftcolumn += "<li><a style=\"color: #222222\">Saturday, January 21<sup>st</sup></a>:<br />  <a href=\"murdermystery.html#mystery\">Murder Mystery Dinner</a> </li> ";
	leftcolumn += "<li></li>";
	leftcolumn += "<li></li>";
	leftcolumn += "<li></li>";
	leftcolumn += "</ul> ";
	leftcolumn += "</li> ";
	leftcolumn += "<li> ";
	leftcolumn += "<h2>Recent Events</h2> ";
	leftcolumn += "<ul class=\"list\">";
	leftcolumn += "<li>2/12: Welcome Pastor Doug</li> ";
	leftcolumn += "<li>1/21: Murder Mystery Dinner</li> ";
	leftcolumn += "<li>1/1: New Years Service</li> ";
//	leftcolumn += "<li>12/24: Christmas Services</li> ";
//	leftcolumn += "<li>12/14: Wednesday Advent Service</li> ";
//	leftcolumn += "<li>12/13: Colonial Care Night</li> ";
//	leftcolumn += "<li>12/7: Wednesday Advent Service</li> ";
//	leftcolumn += "<li>12/4: Christmas Dinner/Concert</li> ";
//	leftcolumn += "<li>11/30: Wednesday Advent Service</li> ";
//	leftcolumn += "<li>11/27: Youth Gingerbread House Making</li> ";
//	leftcolumn += "<li>11/23: Thanksgiving Service</li> ";
//	leftcolumn += "<li>11/12: Potluck Internationale</li> ";
//	leftcolumn += "<li>10/22: Road Rally</li> ";
	leftcolumn += "</ul> </li> </ul>";
	document.write(leftcolumn);
}

function InsertFooter()
{
	var footer
	//footer =  "<p id=\"legal\">Original design by <a href=\"http://www.freecsstemplates.org/\" target=\"_blank\">Free CSS Templates</a></p>";
	footer = "<p style=\"color: #000000\";>Please send any questions or comments to <a href=\"mailto:kogwebmaster@gmail.com\">kogwebmaster@gmail.com</p>";
	document.write(footer);
}

/* This inserts the pictues for the banner.  
   Each should have an id between img1 and img10.
   Each should have a class between image1 and image10.
   The id # should match the class number.*/
function InsertImageBanner()
{
	var menu;
	gNumberOfBannerImages = 4;
	menu =  "<img id=\"img1\" src=\"images/Kog_building.jpg\" alt=\"\" width=\"760\" height=\"361\" class=\"image1\"  /> ";
	menu += "<img id=\"img2\" src=\"images/Kog_sign.jpg\" alt=\"\" width=\"760\" height=\"361\" class=\"image2\"  /> ";
	menu += "<img id=\"img3\" src=\"images/Kog_building_front.jpg\" alt=\"\" width=\"760\" height=\"361\" class=\"image3\"  /> ";
	menu += "<img id=\"img4\" src=\"images/Kog_alter.jpg\" alt=\"\" width=\"760\" height=\"361\" class=\"image4\"  /> ";
	document.write(menu);
}

function StartFadeOutTimer()
{
	gFadeMode = 0;
	gFadeTimerVal = setTimeout("FadeOutTimerHandler()",gTimeBetweenPictures);
	/*alert("fade timer started");*/
}

// Transittions between images in the banner.
function FadeOutTimerHandler()
{	
	/*alert(gFadeMode);*/
	switch(gFadeMode)
	{
	case 0:
		gFadeMode = 1;
		$("#img1").fadeOut(gFadeTransitionTime, "linear");
		$("#img2").fadeIn(gFadeTransitionTime, "linear",FadeOutDelay);
		break;
	case 1:
		gFadeMode=2;
		$("#img2").fadeOut(gFadeTransitionTime, "linear");
		$("#img3").fadeIn(gFadeTransitionTime, "linear",FadeOutDelay);
		break;
	case 2:
		gFadeMode=3;
		$("#img3").fadeOut(gFadeTransitionTime, "linear");
		$("#img4").fadeIn(gFadeTransitionTime, "linear",FadeOutDelay);
		break;
	case 3:
		gFadeMode=4;
		$("#img4").fadeOut(gFadeTransitionTime, "linear",FadeOutDelay);
		$("#img5").fadeIn(gFadeTransitionTime, "linear");
		//alert("case 3");
		break;
	case 4:
		//alert("case 4");
		gFadeMode=5;
		$("#img5").fadeOut(gFadeTransitionTime, "linear",FadeOutDelay);
		$("#img6").fadeIn(gFadeTransitionTime, "linear");
		break;
	case 5:
		gFadeMode=6;
		$("#img6").fadeOut(gFadeTransitionTime, "linear",FadeOutDelay);
		$("#img7").fadeIn(gFadeTransitionTime, "linear");
		break;
	case 6:
		gFadeMode=7;
		$("#img7").fadeOut(gFadeTransitionTime, "linear",FadeOutDelay);
		$("#img8").fadeIn(gFadeTransitionTime, "linear");
		break;
	case 7:
		gFadeMode=8;
		$("#img8").fadeOut(gFadeTransitionTime, "linear",FadeOutDelay);
		$("#img9").fadeIn(gFadeTransitionTime, "linear");
		break;
	case 8:
		gFadeMode=9;
		$("#img9").fadeOut(gFadeTransitionTime, "linear",FadeOutDelay);
		$("#img10").fadeIn(gFadeTransitionTime, "linear");
		break;
	case 9:
		gFadeMode=10;
		$("#img10").fadeOut(gFadeTransitionTime, "linear",FadeOutDelay);
		$("#img11").fadeIn(gFadeTransitionTime, "linear");
		break;
	case 10:	// Restore the images.
		//alert("case 10");
		gFadeMode=0;
		for(i=0;i<gNumberOfBannerImages;i++)
		{
			switch(i)
			{
			case 0:
				$("#img1").fadeIn(gFadeTransitionTime, "linear",FadeOutDelay);
				break;
			case 1:
				$("#img2").fadeIn(gFadeTransitionTime, "linear");
				break;
			case 2:
				$("#img3").fadeIn(gFadeTransitionTime, "linear");
				break;
			case 3:
				$("#img4").fadeIn(gFadeTransitionTime, "linear");
				break;
			case 4:
				$("#img5").fadeIn(gFadeTransitionTime, "linear");
				break;
			case 5:
				$("#img6").fadeIn(gFadeTransitionTime, "linear");
				break;
			case 6:
				$("#img7").fadeIn(gFadeTransitionTime, "linear");
				break;
			case 7:
				$("#img8").fadeIn(gFadeTransitionTime, "linear");
				break;
			case 8:
				$("#img9").fadeIn(gFadeTransitionTime, "linear");
				break;
			case 9:
				$("#img10").fadeIn(gFadeTransitionTime, "linear");
				break;
			}
		}
		//alert("10");
		break;
	}
	if(gFadeMode == gNumberOfBannerImages-1)
	{
		//alert(gFadeMode);
	//	alert(gNumberOfBannerImages);
		gFadeMode = 10;
	}
}

// Start a timer which controls the amount of timer between images in the banner.
function FadeOutDelay()
{
	setTimeout("FadeOutTimerHandler()",gTimeBetweenPictures);
}


function FadeOutDelayShort()
{
	//alert("short");
	setTimeout("FadeOutTimerHandler()",gShortDelay);
	
}



