/*For example canyoneer.aspx*/
/*This has been phased out since search engines penalize rank if sections of content are hidden.*/
/*No reference to this file has been kept in any of the site files.  But this file has been left here incase I want to reference it as a sort of how to later.*/
/*I am not good with java and had to work a long time for this.  If I ever need to look at the syntax for things that worked here it is.*/
function ToggleDiv(elementId)
{
	var element = document.getElementById(elementId);
	if(element.style.display != "block")
	{
		element.style.display = "block";
	}
	else
	{
		element.style.display = "none";
	}
}


function UpdateText(element)
{
	if(element.innerHTML.indexOf("Show") != -1) 	
	{
		element.innerHTML = "Hide";
		
	}
	else
	{
		element.innerHTML = "Show";

	}
}


function ToggleHeader(elementId)
{
	/*THIS VALUE MUST MATCH THE MARGIN-LEFT VALUE in the External Style Sheet for h_major-section*/
	/*The code will function just fine if not but the movement will be off*/
	var CssValue = "80px"	
	/*This value is what the new margin left value will be on everyother click.*/
	var ToggleValue = "0px" /* The function is called it will toggle between these two values.  for this page it takes the indent away.*/
	/*This gets the Id of the emement passed to it by the element that called the function and assigns it to the variable header*/
	var header = document.getElementById(elementId); 		
 	
 	/*The JavaScript can only check the value of the margin left for an element if it is done on the inline style.*/
 	/*The original value was set with an external style sheet so the script sees no value at all.*/
 	/*The first statement (an IF  AND) says that if the value is not the CssValue and is not the ToggleValue,*/
 	/*Then do the code in the box.  Since the original value is not a value the code in the box will be performed.*/
 	if(header.style.marginLeft != ToggleValue && header.style.marginLeft != CssValue)
 		{
 		   /*Since the value was not the CSS or Toggle values it must have been */
 		   /*the original value from the external style sheet.  So we need it to change to the toggle value*/
 		   /*Set the margin left property to the toggle value*/
 		   header.style.marginLeft = (ToggleValue);
 		   /*Stop processing the function.*/
 		   /*This block of code is only run on the first instance and sets the vaule to the toggle value*/
 		   /*The job is done so we stop the function.*/
 		   return;

 		}
 	
	/*The next time this function is ran, the above IF AND statemet will not execute, because*/
	/*from here out the value will be eitehr the CssValue or the ToggleValue.*/
	/*This IF ELSE statment toggles between teh values*/	
 	if(header.style.marginLeft == ToggleValue)
 		{
 			header.style.marginLeft = (CssValue);			
 		}
 		
 	else
 		{
 			header.style.marginLeft = (ToggleValue);			
 		}

}

function RevealLink(elementId) 
/*The visibility value of the link (that shows the div) is set to hidden in the external style sheet*/
/*This function sets it to visible on mouseover then back to hidden after a time out to give the user time to utilize the link before it goes away..*/

/*NOTE*/
/*NOTE*/
/*The function that shows or hides the divs in the sections toggles the DISPLAY property between block and none*/
/*Those sections disappear and appear and are taken out of the page entirely so the page expands and contracts to show those divs.*/
/**/
/*This function is set to toggle the link to show those divs.  This function toggles the VISIBILITY property from hidden to visble.*/
/*I used visibility since I needed the space where the link would sho to be taken up on the page.*/
/*Using visibility keeps the page from adjusting itself as the links are shown and hidden.  Much easier on the eys for the user.*/								
	{		
		var element = document.getElementById(elementId); //gets the id of the element passed to the function and assigns it to the variable of element
		var tempFunction = function() // this variable is assigned a value of a function and will be called when this function is needed.
			{
				element.style.visibility = ("hidden"); //hide the link by setting the display  value back to none

			}
			
		/*See notes for function ToggleHeader for an explanation of the locic for this if statement*/	
		if(element.style.visibility != "hidden" && element.style.visibility != "block") 
		{			
			element.style.visibility = ("visible"); 		//allow link to be visible
			window.setTimeout(tempFunction,5000)// wait the determined amount of time milliseconds then call the function to set it back to hidden.
			/*Doing the work inside the setTimeout function does not work.*/
			/*Calling a function outside of this function did not work ether.*/
			/*I found a web site explaining the answer*/
			/*Set a variable (in this case tempFunction). */
			/*Make the variable equal to the function you wat performed in teh setTimeout function*/
			/*Call the variable with teh function you want*/
			return;	
		}
		
		
		if(element.style.visibility == "hidden") // after the function is run once the display value will be hidden, so this statement will run on subsequent mouseover events 
		{
		/*This is the same code as in the above if statement.*/
		/*The first time the function is called the above statement will run since the value for display will not be block or none.*/
		/*The value of display can only be detected if it was set on an inline style.*/
		/*After the above if statement runs the value for display will be set to block or none and done so in line via this function*/
		/*On subsequent cals for this function the value will be block or none and this statemet will be true and therefore execute.*/
		element.style.visibility = ("visible"); 
			window.setTimeout(tempFunction,5000)
		}
	
	}