addLoadEvent(init)

function init()
{
	
	setUpRightNav();
	setUpLeftNav();
	preparePlaceHolder();	
}

function setUpLeftNav()
{
	//Determine if browser can support this function
	if(!document.getElementById) return false;
	if(!document.getElementsByTagName) return false;
	
	//Determine if page has available hooks
	if(!document.getElementById("leftnav")) return false;
	
	var navleft = document.getElementById("leftnav");
	var linksleft = navleft.getElementsByTagName("A");
	 
	//loop through links and add handler
	for(var l = 0; l < linksleft.length; l++)
	{
		// IE requires stopDefault called first
		addEvent(linksleft[l], "click", stopDefault);
		addEvent(linksleft[l], "click", showPic);
	}
}
function setUpRightNav()
{
	//Determine if browser can support this function
	if(!document.getElementById) return false;
	if(!document.getElementsByTagName) return false;
	
	//Determine if page has available hooks
	if(!document.getElementById("rightnav")) return false;
	
	var navright = document.getElementById("rightnav");
	var linksright = navright.getElementsByTagName("A");
	
	//loop through links and add handler
	for(var r = 0; r < linksright.length; r++)
	{
		// IE requires stopDefault called first
		addEvent(linksright[r], "click", stopDefault);
		addEvent(linksright[r], "click", showPic);
	}
}
function preparePlaceHolder()
{
	//check if browsers work
	if(!document.createElement) return false;
	if(!document.createTextNode) return false;
	if(!document.getElementById) return false;
	
	// Set up image container
	var placeholder = document.createElement("img");
	placeholder.setAttribute("id", "placeholder");
	placeholder.setAttribute("src", "images/shop_imgs_lg/shop1-1_03.jpg");
	placeholder.setAttribute("alt", "Shop Image Gallery");
	
	//Set up text container
	var description = document.createElement("p");
	description.setAttribute("id", "description");
	var desctext = document.createTextNode("Choose an Image");
	description.appendChild(desctext);

	//Add Elements to the DOM
	document.getElementById("picture").appendChild(placeholder);
	document.getElementById("title").appendChild(description);
}

function showPic(e)
{
	//Determine if browser can support this function
	if(!document.getElementById) return false;
	if(!document.getElementsByTagName) return false;
	
	//Determine if page has available hooks
	if(!document.getElementById("picture")) return false;
	if(!document.getElementById("title")) return false;
	
	//Create a cross-browser reference to object clicked on
	if(window.event)// IE Event Model
	{
		var target = window.event.srcElement.parentNode;
	}
	else if(e) // W3C Event Model
	{
		var target = e.target.parentNode;
	}
	if(window.event)// IE Event Model
	{
		var desctarget = window.event.srcElement;
	}
	else if(e) // W3C Event Model
	{
		var desctarget = e.target;
	}
	
		// shortcut var for href attribute
		var url = target.getAttribute("href");
		
		
		// Check to see if the link has a title attribute & value
		if(desctarget.getAttribute("title"))
		{
			var capText = desctarget.getAttribute("title"); 	
		}
		else
		{
			var capText = "";
		}
		
		//Alternative ternary method for above conditional if statement
		//target.getAttribute("title") ? var capText = target.getAttribute("title") : "";
		
		// Create shortcut Vars
		var pic = document.getElementById("placeholder");
		var caption = document.getElementById("description");
		
		// manipulate the DOM
		pic.setAttribute("src", url);
		caption.firstChild.nodeValue = capText;
}