var contentIframe = null;
var selectedNav = null;
var butterflyImg = null;

function syncNavContent() {
	var args = getArgs();
	var page = "home";
	if (args["page"]) page = args["page"];
	loadContent(page);
}

function loadContent(page) {
	if (!contentIframe) {
		contentIframe = document.getElementById("contentIframe");
	}

	if (!butterflyImg) {
		butterflyImg = document.getElementById("butterflyImg");
	}
	
	if (page == "home") {
		butterflyImg.src = "images/logo_butterfly_home.gif";
	} else {
		butterflyImg.src = "images/logo_butterfly.gif";
	}

	switch (page) {
		case "nav1": case "nav1-1":
			setLocation(page, 'illustration.html?category=childcolor');
			break;
		case "nav1-2":
			setLocation(page, 'illustration.html?category=childbw');
			break;
		case "nav1-3":
			setLocation(page, 'illustration.html?category=editcolor');
			break;
		case "nav1-4":
			setLocation(page, 'illustration.html?category=editbw');
			break;
		case "nav1-5":
			setLocation(page, 'illustration.html?category=digital');
			break;
		case "nav1-6":
			setLocation(page, 'illustration.html?category=design');
			break;
		case "nav2": case "nav2-1":
			setLocation(page, 'design.html');
			break;
		case "nav2-2":
			setLocation(page, 'design.html');
			break;
		case "nav3": case "nav3-1":
			setLocation(page, 'aboutme.html#skills');
			break;
		case "nav3-2":
			setLocation(page, 'aboutme.html#experience');
			break;
		case "nav3-3":
			setLocation(page, 'aboutme.html#education');
			break;
		case "nav3-4":
			setLocation(page, 'aboutme.html#awards');
			break;
		case "nav4": case "nav4-1":
			setLocation(page, 'clients.html');
			break;
		case "nav4-2":
			setLocation(page, 'working.html');
			break;
		case "nav4-3":
			setLocation(page, 'working.html');
			break;
		case "nav5": case "nav5-1":
			setLocation(page, 'funstuff.html');
			break;
		case "nav5-2":
			setLocation(page, 'funstuff.html');
			break;
		case "nav6": case "nav6-1":
			setLocation(page, 'contactme.html');
			break;
		case "home": default:
			setLocation(page, 'home.html');
			break;
	}
}

function setLocation(page, location) {
	var menu = page.split("-")[0];
	// submenu
	var menuOpen = document.getElementById(menu + "-open");
	if (menuOpen) {
		var menuClosed = document.getElementById(menu + "-closed");
		menuOpen.style.display = "block";
		menuClosed.style.display = "none";
	}
	
	if (selectedNav) {
		selectedNav.submenu.className = "";
		selectedNav.arrow.src = "images/spacer.gif";
	}


	var submenu = document.getElementById("sub" + page);
	if (submenu) {
		submenu.className = "selected";
		arrow = document.getElementById("sub" + page + "-arrow");
		arrow.src="images/subnav_arrow.gif";
		selectedNav = {};
		selectedNav.submenu = submenu;
		selectedNav.arrow = arrow;
	}
	
	
	var s = contentIframe.src.split("/");
	var frameLoc = s[s.length-1];
	if (frameLoc != location) {
		contentIframe.src=location;
	}
}

function getArgs() {
	var args = new Object();
	var query = location.search.substring(1);
	var pairs = query.split("&");
	for (var i=0; i< pairs.length; i++) {
		var pos = pairs[i].indexOf("=");
		if (pos == -1) continue;
		var argname = pairs[i].substring(0,pos);
		var value = pairs[i].substring(pos+1);
		args[argname] = unescape(value);
		// alert(argname + ":" + args[argname]);
	}
	return args;
}

function getToken() {
	var hash = document.location.hash;
	var token = null;
	if (hash && hash.length > 1) {
		token = hash.split("#")[1];	
	}
	return token;
}

var subitems = new Array();
subitems[1] = ["Children's Color", "Children's B&amp;W", "Editorial Color", "Editorial B&amp;W", "Digital", "Design"];
subitems[2] = ["Book Covers", "Animation"];
subitems[3] = ["Skills", "Experience", "Education", "Awards"];
subitems[4] = ["My Clients", "Working with Me"];
subitems[5] = ["Coloring Pages", "Games"];
subitems[6] = ["Contact Form"];

function writeLeftNav() {
	for (var i=1; i<=6; i++) {
		if (i!=2 && i!=5) {  // use to turn off features
				document.write('<div id="nav' + i + '-open" style="display:none" class="navOpen"><img src="images/nav' + i + '_on.gif" alt="" width="152" height="26" border="0"><img src="images/nav' + i + '_sub.gif" alt="" width="13" height="13" border="0"><br/>');
				if (subitems[i].length > 0) {
					document.write('<div class="subnav subnav' + i + '">');
					for (var j=1; j<=subitems[i].length; j++) {
							document.write('<a id="subnav' + i + '-' + j +'" href="javascript:loadContent(\'nav' + i + '-' + j + '\');">' + subitems[i][j-1] + '</a>');
							document.write('<img id="subnav' + i + '-' + j + '-arrow" src="images/spacer.gif" alt="&gt;&gt;" border="0" width="14" height="11"><br/>');
					}
					document.write('</div>');
				}
				document.write('</div>');
				document.write('<div id="nav' + i + '-closed" class="navClosed"><a target="_top" href="index.html?page=nav' + i + '-1"><img src="images/spacer.gif" alt="" width="152" height="26" border="0"></a></div>');
		} // end if
	}
}

function getZoomHref(sample) {
	var href = "zoomPane.html?fullSrc=" + sample.full;
		if (sample.title) href += "&title=" + sample.title;
		if (sample.subtitle) href += "&subtitle=" + sample.subtitle;
		if (sample.comments) href += "&comments=" + sample.comments;
		
	return encodeURI(href);
}

function zoomZoom(fullSrc) {
	document.getElementById("shadow").style.display = "block";
	document.getElementById("zoomZoomImage").src = fullSrc;
}

function closeShadow() {
	document.getElementById("shadow").style.display = "none";
	document.getElementById("zoomZoomImage").src = "images/spacer.gif";
}

