var activeCategory = 0;
var activePage = 1;
var activePhoto = 1;
var canvasWidth = 523;
var canvasHeight = 585;
var whiteBGHeight = 355;

var photoNav = null;

var CategoryDB = new Array();

var Category = function(name, useBG) {
	if(useBG == undefined) {
		useBG = false;
	}
	this.Name = name;
	this.Pages = new Array();
	this.useBG = useBG;
	
	this.addPage = function(name, useCategoryLink) {
		this.Pages[this.Pages.length] = new Page(name, useCategoryLink);
	}
}

var Page = function(name, useCategoryLink) {
	if(useCategoryLink == undefined) {
		useCategoryLink = false;
	}
	
	this.Name = name;
	this.Photos = new Array();
	this.useCategoryLink = useCategoryLink;
	
	this.addPhoto = function(photoSrc, linkText, linkHref, linkOnClick, vertical) {
		this.Photos[this.Photos.length] = new Photo(photoSrc, linkText, linkHref, linkOnClick, vertical);
	};
}

var Photo = function(photoSrc, linkText, linkHref, linkOnClick, vertical) {
	this.Source = photoSrc;
	this.LinkText = linkText;
	this.LinkHref = linkHref;
	this.LinkOnClick = linkOnClick;
	if(vertical == undefined) {
		this.vertical = false;
	} else {
		this.vertical = vertical;
	}
}

function getPhotoHtml(i, pageNum, photoNum) {
	if(photoNum == undefined) {
		photoNum = 0;
		avtivePhoto = 0;
	} else {
		activePhoto = photoNum;
	}
	var html = '';
	if(CategoryDB[i].useBG) {
		$('whiteBG').className = "whiteBG";
	} else {
		$('whiteBG').className = "";
	}
	if(CategoryDB[i].Pages[pageNum-1].Photos[photoNum].LinkHref != undefined) {
		if($('mainLink') == null) {
			var myLink = document.createElement('a');
			myLink.id = 'mainLink';
			myLink.appendChild($('mainImage'));
			$('whiteBG').appendChild(myLink);
		}
		if(CategoryDB[i].Pages[pageNum-1].Photos[photoNum].LinkOnClick != undefined) {
			$('mainLink').href = CategoryDB[i].Pages[pageNum-1].Photos[photoNum].LinkHref;
			$('mainLink').onclick = function() {
				eval(CategoryDB[i].Pages[pageNum-1].Photos[photoNum].LinkOnClick);
			}
		} else {
			$('mainLink').href = CategoryDB[i].Pages[pageNum-1].Photos[photoNum].LinkHref;
			$('mainLink').target = "_blank";
		}
	} else {
		if($('mainLink') != null) {
			$('whiteBG').adopt($('mainImage'));
			$('mainLink').destroy();
		}
	}
	$('mainImage').src = 'pics/' + CategoryDB[i].Name + '/' + CategoryDB[i].Pages[pageNum-1].Photos[photoNum].Source;
	if(CategoryDB[i].Pages[pageNum-1].Photos[photoNum].LinkText != undefined) {
		var html2 = "";
		if(CategoryDB[i].Pages[pageNum-1].Photos[photoNum].LinkHref != undefined) {
			if(CategoryDB[i].Pages[pageNum-1].Photos[photoNum].LinkOnClick != undefined) {
				html2 += '<a href="' + CategoryDB[i].Pages[pageNum-1].Photos[photoNum].LinkHref + '" onclick="' + CategoryDB[i].Pages[pageNum-1].Photos[photoNum].LinkOnClick + '">';
				
			} else {
				html2 = '<a href="' + CategoryDB[i].Pages[pageNum-1].Photos[photoNum].LinkHref + '" target="_blank">';
			}
		}
		html2 += CategoryDB[i].Pages[pageNum-1].Photos[photoNum].LinkText;
		if(CategoryDB[i].Pages[pageNum-1].Photos[photoNum].LinkHref != undefined) {
			html2 += '</a>';
		}
		$('linkText').innerHTML = html2
	} else {
		$('linkText').innerHTML = "";
	}
}

function getNavHtml(i, pageNum) {
	var html = '';
	html = '<ul>';
	if(CategoryDB[i].Pages[pageNum-1].Photos.length > 1) {
		for(var j = 0; j < CategoryDB[i].Pages[pageNum-1].Photos.length; j++) {
			html += '<li><a href="#" onclick="showPhoto(' + (j+1) + ');">' + (j+1) + '</a></li>';
		}
	} else {
		html += '<li></li>';
	}
	html += '</ul>';
	
	return html;
}

function showPhoto(photoNum) {
	showLoader();
	getPhotoHtml(activeCategory, activePage, photoNum-1);
	photoNav.innerHTML = getNavHtml(activeCategory, activePage);
}

function showPage(categoryName, pageNum) {
	for(var i = 0; i < CategoryDB.length; i++) {
		if(CategoryDB[i].Name == categoryName) {
			activeCategory = i;
			activePage = pageNum;
			showPhoto(1);
			return true;
		}
	}
	return false;
}

function setupNavigation() {
	var workLeftNav = document.getElementById('workLeftNav');
	
	var html = '';
	
	for(var i = 0; i < CategoryDB.length; i++) {
		if(CategoryDB[i].Pages[0].useCategoryLink) {
			html += '<p><strong>... <a href="#" onclick="showPage(\'' + CategoryDB[i].Name + '\',1);">' + CategoryDB[i].Name + '</a></strong></p>';
		} else {
			html += '<p><strong>... ' + CategoryDB[i].Name + '</strong></p>';
		}
		html += '<ul>';
		for(var j = 0; j < CategoryDB[i].Pages.length; j++) {
			html += '<li><a href="#" onclick="showPage(\'' + CategoryDB[i].Name + '\',' + (j+1) + ');">' + CategoryDB[i].Pages[j].Name + '</a></li>';
		}
		html += '</ul>';
		html += '<p>&nbsp;</p>';
	}
	
	workLeftNav.innerHTML = html;
}

function showLoader(){
	$('loader').setStyle('display', 'block');
}

function hideLoader(){
	$('loader').setStyle('display', 'none');
}

function updateNavPos(whiteBGUsed) {
	if(whiteBGUsed == undefined) {
		whiteBGUsed = false;
	}
	var imageWidth = getImageWidth("mainImage");
	var imageHeight = 0;
	if(whiteBGUsed) {
		imageHeight = whiteBGHeight;
		imageWidth = 400;
	} else {
		imageHeight = (getImageHeight("mainImage") + 65);
	}
	$('mainImage').style.marginTop = "0px";
	photoNav.style.marginLeft = "" + Math.round((canvasWidth - imageWidth) / 2) + "px";
	
	// If vertical spacing manually set
	if(CategoryDB[activeCategory].Pages[activePage-1].Photos[activePhoto].vertical != false) {
		photoNav.style.marginTop = CategoryDB[activeCategory].Pages[activePage-1].Photos[activePhoto].vertical + "px";
	} else { // Else automatically detect vertical spacing
		if(CategoryDB[activeCategory].Name == 'web') {
			photoNav.style.marginTop = "90px";
		} else {
			photoNav.style.marginTop = "" + Math.round(((canvasHeight - imageHeight) / 2) - 25) + "px";
		}
	}
	$('linkText').setStyle('margin-left', Math.round((canvasWidth - getImageWidth("mainImage")) / 2));
}

function init() {
	CategoryDB[0] = new Category('print');
	CategoryDB[0].addPage('american red cross');
	CategoryDB[0].Pages[0].addPhoto('p_redcross_1.jpg','American Red Cross:<br />African Food Crisis poster series');
	CategoryDB[0].Pages[0].addPhoto('p_redcross_2.jpg','American Red Cross:<br />African Food Crisis poster series');
	CategoryDB[0].Pages[0].addPhoto('p_redcross_3.jpg','American Red Cross:<br />African Food Crisis poster series');
	CategoryDB[0].Pages[0].addPhoto('p_redcross_4.jpg','American Red Cross:<br />African Food Crisis poster series');
	CategoryDB[0].addPage('icrc');
	CategoryDB[0].Pages[1].addPhoto('p_icrc_2.jpg','International Committee for the Red Cross:<br />Exhibit posters for "Fields"');
	CategoryDB[0].Pages[1].addPhoto('p_icrc_1.jpg','International Committee for the Red Cross:<br />Exhibit posters for "Fields"');
	CategoryDB[0].addPage('boys &amp; girls club');
	CategoryDB[0].Pages[2].addPhoto('p_bgc_1.jpg','Boys & Girls Club:<br />Grand Opening advertisement');
	CategoryDB[0].Pages[2].addPhoto('p_bgc_2.jpg','Boys & Girls Club:<br />Grand Opening advertisement');
	CategoryDB[0].addPage('warn');
	CategoryDB[0].Pages[3].addPhoto('p_warn_1.jpg','WARN Industries:<br />Pullzall consumer advertisement');
	CategoryDB[0].addPage('reebok');
	CategoryDB[0].Pages[4].addPhoto('p_reebok_1.jpg','RBK:<br />Poster series');
	CategoryDB[0].Pages[4].addPhoto('p_reebok_2.jpg','RBK:<br />Poster series');
	CategoryDB[0].Pages[4].addPhoto('p_reebok_3.jpg','RBK:<br />In-store consumer promotion');
	CategoryDB[0].addPage('raindance');
	CategoryDB[0].Pages[5].addPhoto('p_raindance.jpg','Raindance:<br />Consumer advertising');
	CategoryDB[0].addPage('hnw');
	CategoryDB[0].Pages[6].addPhoto('p_hnw_1.jpg','Housing Northwest:<br />College housing consumer advertisement');
	CategoryDB[0].addPage('tapwave');
	CategoryDB[0].Pages[7].addPhoto('p_tapwave_1.jpg','Tapwave:<br />Consumer advertising');
	CategoryDB[0].Pages[7].addPhoto('p_tapwave_2.jpg','Tapwave:<br />Consumer advertising');
	CategoryDB[0].addPage('gamefly');
	CategoryDB[0].Pages[8].addPhoto('p_gamefly.jpg','Gamefly:<br />Consumer advertising');
	
	CategoryDB[1] = new Category('packaging');
	CategoryDB[1].addPage('labtec');
	CategoryDB[1].Pages[0].addPhoto('pk_labtec.jpg','Labtec:<br />Retail packaging');
	CategoryDB[1].addPage('tapwave');
	CategoryDB[1].Pages[1].addPhoto('pk_zodiac_1.jpg','Tapwave:<br />Zodiac retail packaging');
	CategoryDB[1].Pages[1].addPhoto('pk_zodiac_2.jpg','Tapwave:<br />Zodiac accessories retail packaging');
	CategoryDB[1].addPage('jowood');
	CategoryDB[1].Pages[2].addPhoto('pk_jowood_1.jpg','JoWooD:<br />U.S. launch party invitation');
	CategoryDB[1].Pages[2].addPhoto('pk_jowood_2.jpg','JoWooD:<br />Retail packaging');
	CategoryDB[1].Pages[2].addPhoto('pk_jowood_3.jpg','JoWooD:<br />Retail packaging');
	
	CategoryDB[2] = new Category('collateral');
	CategoryDB[2].addPage('ncc');
	CategoryDB[2].Pages[0].addPhoto('c_ncc.jpg','National Corrosion Center:<br />Annual Report');
	CategoryDB[2].addPage('icrc');
	CategoryDB[2].Pages[1].addPhoto('c_icrc_1.jpg','International Committee for the Red Cross:<br />Exhibit guide for "Fields"');
	CategoryDB[2].addPage('the vancouver clinic');
	CategoryDB[2].Pages[2].addPhoto('c_vancouver_1.jpg','The Vancouver Clinic:<br />Ancillary Services awareness campaign');
	CategoryDB[2].Pages[2].addPhoto('c_vancouver_2.jpg','The Vancouver Clinic:<br />Ancillary Services awareness campaign');
	CategoryDB[2].Pages[2].addPhoto('c_vancouver_3.jpg','The Vancouver Clinic:<br />Ancillary Services awareness campaign');
	CategoryDB[2].addPage('avia');
	CategoryDB[2].Pages[3].addPhoto('c_avia_1.jpg','Avia:<br />Direct marketing');
	CategoryDB[2].addPage('ryka');
	CategoryDB[2].Pages[4].addPhoto('c_ryka_1.jpg','Ryka catalog:<br />Direct marketing');
	CategoryDB[2].addPage('speedo');
	CategoryDB[2].Pages[5].addPhoto('c_speedo_1.jpg','Speedo:<br />Direct marketing');
	CategoryDB[2].addPage('jowood');
	CategoryDB[2].Pages[6].addPhoto('c_jowood.jpg','JoWooD:<br />Brass Balls -Party invitation');
	CategoryDB[2].addPage('tapwave');
	CategoryDB[2].Pages[7].addPhoto('c_tapwave.jpg','Tapwave:<br />Zodiac informational trade show and in-store brochure');
	
	CategoryDB[3] = new Category('identity', true);
	CategoryDB[3].addPage('', true);
	CategoryDB[3].Pages[0].addPhoto('i_sevenbridges_1.jpg');
	CategoryDB[3].Pages[0].addPhoto('i_laurus_1.jpg');
	CategoryDB[3].Pages[0].addPhoto('i_e2_1.jpg');
	CategoryDB[3].Pages[0].addPhoto('i_ver_1.jpg');
	CategoryDB[3].Pages[0].addPhoto('i_howells_1.jpg');
	CategoryDB[3].Pages[0].addPhoto('i_skyron_1.jpg');
	CategoryDB[3].Pages[0].addPhoto('i_fury_1.jpg');
	CategoryDB[3].Pages[0].addPhoto('i_svpp_1.jpg');
	CategoryDB[3].Pages[0].addPhoto('i_elistics_1.jpg');
	CategoryDB[3].Pages[0].addPhoto('i_bg_1.jpg');
	CategoryDB[3].Pages[0].addPhoto('i_jowood_1.jpg');
	CategoryDB[3].Pages[0].addPhoto('i_tapwave_1.jpg');
	
	CategoryDB[4] = new Category('outdoor');
	CategoryDB[4].addPage('tapwave');
	CategoryDB[4].Pages[0].addPhoto('o_tapwave_1.jpg','Tapwave:<br />New York, Chicago and San Francisco');
	CategoryDB[4].Pages[0].addPhoto('o_tapwave_2.jpg','Tapwave:<br />New York, Seattle, San Francisco');
	
	CategoryDB[5] = new Category('web');
	CategoryDB[5].addPage('web sites');
	CategoryDB[5].Pages[0].addPhoto('w_svpp.jpg', 'Social Venture Partners of Portland');
	CategoryDB[5].Pages[0].addPhoto('w_xenium.jpg', '@ www.xeniumhr.com', 'http://www.xeniumhr.com');
	CategoryDB[5].Pages[0].addPhoto('w_spot.jpg','@ www.justincase.us.com','http://www.justincase.us.com');
	CategoryDB[5].Pages[0].addPhoto('w_gracies.jpg','@ www.graciesdining.com','http://www.graciesdining.com');
	CategoryDB[5].Pages[0].addPhoto('w_ncs.jpg','@ www.ncsgynonc.com','http://www.ncsgynonc.com');
	CategoryDB[5].addPage('robocop');
	CategoryDB[5].Pages[1].addPhoto('w_robocop.jpg','Robocop:<br />online ad series','#','javascript:MM_openBrWindow(\'web/robocop.html\',\'robocop\',\'toolbar=no,scrollbars=no,resizable=no,width=170,height=650\')', 40);
	CategoryDB[5].addPage('nate adams');
	CategoryDB[5].Pages[2].addPhoto('w_nateadams.jpg','Nate Adams:<br />online ad series','#','javascript:MM_openBrWindow(\'web/nate.html\',\'nate\',\'toolbar=no,scrollbars=no,resizable=no,width=350,height=300\')');
	CategoryDB[5].addPage('metal slug');
	CategoryDB[5].Pages[3].addPhoto('w_metalslug.jpg','Metal Slug:<br />online ad series','#','javascript:MM_openBrWindow(\'web/metalslug.html\',\'metalslug\',\'toolbar=no,scrollbars=no,resizable=no,width=350,height=650\')', 40);
	CategoryDB[5].addPage('samurai showdown');
	CategoryDB[5].Pages[4].addPhoto('w_samurai.jpg','Samurai Showdown:<br />online ad series','#','javascript:MM_openBrWindow(\'web/samurai.html\',\'samurai\',\'toolbar=no,scrollbars=no,resizable=no,width=350,height=650\')', 40);
	CategoryDB[5].addPage('platoon');
	CategoryDB[5].Pages[5].addPhoto('w_platoon.jpg','Platoon:<br />online ad series','#','javascript:MM_openBrWindow(\'web/platoon_perty.html\',\'platoon\',\'toolbar=no,scrollbars=no,resizable=no,width=170,height=650\')', 40);
	
	CategoryDB[6] = new Category('broadcast');
	CategoryDB[6].addPage('tapwave lifestyle');
	CategoryDB[6].Pages[0].addPhoto('tapwave_life.jpg','Tapwave:<br />Lifestyle Video','#','javascript:MM_openBrWindow(\'tapwave_life.html\',\'broadcast\',\'toolbar=no,scrollbars=no,resizable=no,width=357,height=300\');');
	CategoryDB[6].addPage('gamefly');
	CategoryDB[6].Pages[1].addPhoto('gamefly_original.jpg','Gamefly:<br />National Campaign','#','javascript:MM_openBrWindow(\'gamefly.html\',\'broadcast\',\'toolbar=no,scrollbars=no,resizable=no,width=357,height=300\')');
	CategoryDB[6].addPage('tapwave candies');
	CategoryDB[6].Pages[2].addPhoto('tapwave_candies.jpg','Tapwave:<br />Candies In-Store','#','javascript:MM_openBrWindow(\'tapwave_candies.html\',\'broadcast\',\'toolbar=no,scrollbars=no,resizable=no,width=357,height=300\')');
	
	photoNav = document.getElementById('imageNav');
	
	showPage(CategoryDB[activeCategory].Name, activePage);
	
	setupNavigation();
}

window.addEvent('domready', function() {
	$('mainImage').addEvent('load', function() {
		updateNavPos(CategoryDB[activeCategory].useBG);
		hideLoader();
	});
	init();
});