function showPic (whichpic) {
  if (!document.getElementById) return true;
	
	// swap displayed image
	var url = whichpic.href
  document.getElementById('displayedimage').src = url;
	
	// change subnav link to active
  var nav = document.getElementById("subnav");
  var links = nav.getElementsByTagName("a");
  for ( var i=0; i < links.length; i++) {
    links[i].className = '';
  }
	whichpic.className = 'current';
	
	// get category from whichpic link
	var category = whichpic.rel;
	// change indicators on primary nav
	var sectionlinks = document.getElementById("nav").getElementsByTagName("a");
  for ( var i=0; i < sectionlinks.length; i++) {
		if (sectionlinks[i].parentNode.className == category) {
			sectionlinks[i].className = "current";
		} else {
			sectionlinks[i].className = "";
		}
  }
	
	// hide text for old image
	var hidedivs = document.getElementById("description").getElementsByTagName("div");
  for ( var i=0; i < hidedivs.length; i++) {
		hidedivs[i].className = "hide";
  }
	
	// show text for new displayed image
	var displayid = url.substring(url.lastIndexOf("_")+1,url.lastIndexOf(".jpg"));
	document.getElementById(displayid).className = "show";
  return false;
}


function prepareGallery() {
  if (!document.getElementsByTagName) return false;
  if (!document.getElementById) return false;
  if (!document.getElementById("subnav")) return false;
  var gallery = document.getElementById("subnav");
  var links = gallery.getElementsByTagName("a");
  for ( var i=0; i < links.length; i++) {
    links[i].onclick = function() {
      return showPic(this);
    }
  }
}