function getPageSizeWithScroll(){
	if (window.innerHeight && window.scrollMaxY) {// Firefox
		yWithScroll = window.innerHeight + window.scrollMaxY;
		xWithScroll = window.innerWidth + window.scrollMaxX;
	} else if (document.body.scrollHeight > document.body.offsetHeight){ // all but Explorer Mac
		yWithScroll = document.body.scrollHeight;
		xWithScroll = document.body.scrollWidth;
	} else { // works in Explorer 6 Strict, Mozilla (not FF) and Safari
		yWithScroll = document.body.offsetHeight;
		xWithScroll = document.body.offsetWidth;
	}
	arrayPageSizeWithScroll = new Array(xWithScroll,yWithScroll);
	//alert( 'The height is ' + yWithScroll + ' and the width is ' + xWithScroll );
	return arrayPageSizeWithScroll;
}

function getScrollTop(){
	if(typeof pageYOffset!= 'undefined'){
		//most browsers
		return pageYOffset;
	}
	else{
		var B= document.body; //IE 'quirks'
		var D= document.documentElement; //IE with doctype
		D= (D.clientHeight)? D: B;
		return D.scrollTop;
	}
}

function getElementHeight(elem) {
	return elem.offsetHeight;
}

function getElementWidth(elem) {
	return elem.offsetWidth;
}






var item_arr = new Array({id: 'cover',
										name: "Faux Comic Book Cover",
										functions: 'Illustration',
										image_arr: new Array("images/fullsize/cover.jpg"),
										description: "<p>This one was done as a Christmas present in 2008. It&rsquo;s a parody of the Marvel Team-Up comic book series, with my brother-in-law&rsquo;s face on the villain Doctor Doom.</p>"},
									
									{id: 'dirk_banner',
										name: "Dirk Maximus Banner",
										functions: 'Illustration',
										image_arr: new Array("images/fullsize/dirk_banner.jpg")},
									
									{id: 'catwoman',
										name: "Catwoman Wallpaper",
										functions: 'Illustration',
										image_arr: new Array("images/fullsize/catwoman.jpg")},
									
									/*{id: 'honeychile',
										name: "Dr. No Poster",
										functions: 'illustration',
										image_arr: new Array("images/fullsize/honeychile.jpg")},*/
									
									{id: 'voltron',
										name: "Voltron Poster",
										functions: 'Illustration',
										image_arr: new Array("images/fullsize/voltron.jpg")},
									
									{id: 'hackmaster',
										name: "HackMaster",
										functions: 'Graphic Design, Illustration, HTML/CSS/PHP Development',
										url: "http://www.kenzerco.com/hackmaster",
										image_arr: new Array("images/fullsize/hackmaster.jpg")},
									
									{id: 'sauerkraut',
										name: "Sauerkraut 20K Shirt",
										functions: 'Illustration, Graphic Design',
										image_arr: new Array("images/fullsize/sauerkraut_2010.jpg"),
										description: "<p>After a number of years volunteering to help hand out water at the Sauerkraut Festival 20k race held annually in Phelps NY, I was asked to start designing the t-shirts that are given out to runners and volunteers. I created the cabbage graphic one year, and have tried to incorporate it each year since as a logo of sorts for the race.</p>"},
									
									{id: 'spy_portfolio',
										name: "Old Portfolio",
										functions: 'Graphic Design, Illustration, Flash Development',
										url: 'http://dirkmaximus.com/portfolio_old',
										image_arr: new Array("images/fullsize/spy_portfolio2.jpg",
																		"images/fullsize/spy_portfolio3.jpg",
																		"images/fullsize/spy_portfolio4.jpg",
																		"images/fullsize/spy_portfolio5.jpg",
																		"images/fullsize/spy_portfolio6.jpg"),
										description: '<p>This is my old Flash portfolio site, created in my final year of college. Its content is now outdated and my interest in Flash has since shifted from sites to games, but I think this design still merits a mention. The scrolling parallax animation from scene to scene was successful in catching attention, and this site got me into few interviews with solid companies in the months after I graduated.</p>'},
									
									{id: 'wedding',
										name: "Wedding Invitation",
										functions: 'Graphic Design',
										image_arr: new Array("images/fullsize/wedding_invite_chris.jpg"),
										description: "<p>The paper cut-out look for this invitation helped give the invitation a craft-y feel that I felt was appropriate for a wedding invitation.</p>"},
									
									{id: 'admit_one',
										name: "RIT Dept. of Communication Poster",
										functions: 'Graphic Design',
										image_arr: new Array("images/fullsize/rit_doc_admit_one.jpg")},
									
									{id: 'donation_doubler',
										name: "Colgate Donation Doubler Game",
										functions: 'Flash Development',
										url: "http://www.colgateclonation.com/donation_doubler/index.php",
										image_arr: new Array("images/fullsize/donation_doubler1.jpg",
																		"images/fullsize/donation_doubler2.jpg",
																		"images/fullsize/donation_doubler3.jpg",
																		"images/fullsize/donation_doubler4.jpg",
																		"images/fullsize/donation_doubler5.jpg",
																		"images/fullsize/donation_doubler6.jpg",
																		"images/fullsize/donation_doubler7.jpg")},
									
									{id: 'scanvisor',
										name: "Motorola Scanvisor",
										functions: 'Flash Development',
										url: "http://motorola.com/scanvisor",
										image_arr: new Array("images/fullsize/scanvisor1.jpg",
																		"images/fullsize/scanvisor2.jpg",
																		"images/fullsize/scanvisor3.jpg",
																		"images/fullsize/scanvisor4.jpg",
																		"images/fullsize/scanvisor5.jpg"),
										description: "<p>This site is used to view available Motorola scanners and filter out those that do not have the desired features. The dynamic content, which includes capabilities for multiple languages, is stored in XML files rather than a database to allow the site to be distributed via CD as well as viewed online. I eventually also created a system to allow the data to be stored in Excel files which the client could edit and then convert to the necessary XML files automatically.</p>"},
									
									{id: 'solution_advisor',
										name: "Motorola Solution Advisor",
										functions: 'Flash Development',
										url: "http://www.firstcommunicate.com/motorola/supply_chain/s49704/",
										image_arr: new Array("images/fullsize/solution_advisor1.jpg",
																		"images/fullsize/solution_advisor2.jpg",
																		"images/fullsize/solution_advisor3.jpg",
																		"images/fullsize/solution_advisor4.jpg",
																		"images/fullsize/solution_advisor5.jpg",
																		"images/fullsize/solution_advisor6.jpg")},
									
									{id: 'ge_energy',
										name: "GE Energy Savings Calculator",
										functions: 'HTML/CSS/JavaScript/PHP Development',
										url: "http://hostimages.com/GE/56443_new/",
										image_arr: new Array("images/fullsize/ge_energy1.jpg",
																		"images/fullsize/ge_energy2.jpg")},
									
									{id: 'caesars',
										name: "Caesars Pocono Resorts",
										functions: 'HTML/CSS/JavaScript/Flash Development',
										url: "http://covepoconoresorts.com",
										image_arr: new Array("images/fullsize/caesars1.jpg",
																		"images/fullsize/caesars2.jpg",
																		"images/fullsize/caesars3.jpg",
																		"images/fullsize/caesars4.jpg")},
																		
									{id: 'hack_illus',
										name: "Fantasy Illustration",
										functions: 'Illustration',
										url: "http://www.kenzerco.com/hackmaster",
										image_arr: new Array("images/fullsize/hackmaster_illustration.jpg")},
										
									{id: 'farmhouse',
										name: "The Old Farmhouse",
										functions: 'Illustration',
										image_arr: new Array("images/fullsize/farmhouse.jpg")},
										
									{id: 'security_assessment',
										name: "Motorola Network Security Services Assessment",
										functions: 'Flash Development',
										url: "http://www.hostimages.com/motorola/security_services/s51477/",
										image_arr: new Array("images/fullsize/security_assessment1.jpg",
																		"images/fullsize/security_assessment2.jpg",
																		"images/fullsize/security_assessment3.jpg",
																		"images/fullsize/security_assessment4.jpg",
																		"images/fullsize/security_assessment6.jpg",
																		"images/fullsize/security_assessment7.jpg",
																		"images/fullsize/security_assessment8.jpg")},
																		
									{id: 'dp',
										name: "Delduchetto &amp; Potter",
										functions: 'HTML/CSS/JavaScript Development',
										url: "http://www.dpmedlaw.com",
										image_arr: new Array("images/fullsize/dp1.jpg",
																		"images/fullsize/dp2.jpg",
																		"images/fullsize/dp3.jpg")},
																		
									{id: 'transitions',
										name: "Transitions Live Your Vision Challenge",
										functions: 'Flash/HTML/CSS Development',
										url: "http://hostimages.com/transitions/t56304/",
										image_arr: new Array("images/fullsize/transitions1.jpg",
																		"images/fullsize/transitions2.jpg",
																		"images/fullsize/transitions4.jpg",
																		"images/fullsize/transitions5.jpg",
																		"images/fullsize/transitions6.jpg",
																		"images/fullsize/transitions7.jpg")},
																		
									{id: 'mc17',
										name: "MC17 Retail Mobile Computer",
										functions: 'Flash Development',
										url: "http://hostimages.com/motorola/mcd/m6113/",
										image_arr: new Array("images/fullsize/mc17_1.jpg",
																		"images/fullsize/mc17_2.jpg",
																		"images/fullsize/mc17_3.jpg",
																		"images/fullsize/mc17_4.jpg",
																		"images/fullsize/mc17_5.jpg")},
																		
									{id: 'home_again',
										name: "Project Home Again",
										functions: 'HTML/CSS Development',
										url: "http://www.projecthomeagain.com/",
										image_arr: new Array("images/fullsize/homeagain1.jpg",
																		"images/fullsize/homeagain2.jpg",
																		"images/fullsize/homeagain3.jpg",
																		"images/fullsize/homeagain4.jpg")},
																		
									{id: 'reporter',
										name: "Reporter Magazine Illustrations",
										functions: 'Illustration',
										image_arr: new Array("images/fullsize/reporter_1.jpg",
																		"images/fullsize/reporter_2.jpg",
																		"images/fullsize/reporter_3.jpg")},
																		
									{id: 'hillel',
										name: "RIT Student Government and Hillel Holocaust Week Promotional Design",
										functions: 'Graphic Design',
										image_arr: new Array("images/fullsize/sg_hillel_1.jpg",
																		"images/fullsize/sg_hillel_2.jpg",
																		"images/fullsize/sg_hillel_3.jpg")},
																		
									{id: 'ekids_chara',
										name: "Eastman Kids Tour Guide Illustrations",
										functions: 'Illustration',
										image_arr: new Array("images/fullsize/ekids_characters.jpg")},
										
									{id: 'pgibettermeetings',
										name: "PGiBetterMeetings.com",
										functions: 'HTML/CSS/JavaScript/PHP Development',
										image_arr: new Array("images/fullsize/pgibettermeetings_1.jpg",
																		"images/fullsize/pgibettermeetings_2.jpg",
																		"images/fullsize/pgibettermeetings_3.jpg",
																		"images/fullsize/pgibettermeetings_4.jpg",
																		"images/fullsize/pgibettermeetings_5.jpg",
																		"images/fullsize/pgibettermeetings_6.jpg")},
																		
									{id: 'footprints',
										name: "Footprints t-shirt design",
										functions: 'Graphic Design',
										image_arr: new Array("images/fullsize/footprints3.jpg")},
										
									{id: 'parkave',
										name: "Park Avenue Comics &amp; Games Website",
										functions: 'HTML/CSS/JavaScript/PHP Development',
										url: "http://parkavenuecomics.com",
										image_arr: new Array("images/fullsize/parkave1.jpg"),
										description: '<p>The work for this project included logo design, site design and development, and creation of an html enewsletter.</p>'});












function load_into_popup_image(path) {
	$image_width = $("img#popup_image").width();
	$image_height = $("img#popup_image").height();
	
	if($image_width != null && $image_height != null) {
		$('div#popup_image_container').css('width', $image_width + 'px');
		$('div#popup_image_container').css('height', $image_height + 'px');
	}
	
	$("img#popup_image").unbind('load');
	
	$('div#popup_image_container').html('<img src="' + path + '" alt="" id="popup_image" />');
	//$('img#popup_image').attr('src', path);
	
	$("img#popup_image").load(function(evt){
		//alert("load");
		popup_content_size();
	});

	/*if($("img#popup_image")[0].complete){
		alert("complete");
		popup_content_size();
	}else{
		$("img#popup_image").load(function(evt){
			alert("load");
			popup_content_size();
		});
	}*/
}

function get_item_by_id(id) {
	var loopLength = item_arr.length;
	for(var i = 0; i < loopLength; i++) {
		var item = item_arr[i];
		
		if(item.id == id) {
			return item;
		}
	}
}











function open_popup(id) {
	var item = get_item_by_id(id);
	
	//get the size of the page
	var size_arr = getPageSizeWithScroll();
	
	//set the popup
	var popup = document.getElementById('item_popup');
	popup.style.height = size_arr[1] + 'px';
	
	//set the black transparent background
	var background = document.getElementById('background');
	background.style.height = size_arr[1] + 'px';
	
	//set up the loading animation
	var scroll_top = getScrollTop();
	var loading_circle = document.getElementById('loading_circle');
	loading_circle.style.top = scroll_top + 250 + 'px';
	loading_circle.style.display = "block";
	
	//set the content location
	var content = document.getElementById('popup_content');
	content.style.top = scroll_top + 50 + 'px';
	
	//display the popup
	popup.style.display = 'block';
	
	//load the first image for this item
	var start_image = item.image_arr[0];
	load_into_popup_image(start_image);
	
	//load the image nav if there is more than one image
	var img_nav_ul = document.getElementById('img_nav');
	if(item.image_arr.length > 1) {
		img_nav_ul.style.display = "block";
		
		var html_str = '<li id="prev"><a href="" onclick="prev_image();return false;">&lt;</a></li>';
		for(var i = 0; i < item.image_arr.length; i++) {
			if(i == 0) {
				html_str += '<li class="selected"><a href="'+ item.image_arr[i] + '" onclick="new_image(' + i + ', this);return false;">' + (i + 1) + '</a></li>';
			}else{
				html_str += '<li><a href="'+ item.image_arr[i] + '" onclick="new_image(' + i + ', this);return false;">' + (i + 1) + '</a></li>';
			}
		}
		html_str += '<li id="next"><a href="" onclick="next_image();return false;">&gt;</a></li>';
		
		img_nav_ul.innerHTML = html_str;
	}else {
		img_nav_ul.style.display = "none";
		img_nav_ul.innerHTML = "";
	}
	
	//create the title and site link if available
	var text_content_div = document.getElementById("text_content");
	html_str = '<h1>' + item.name;
	
	if(item.url != undefined) {
		html_str += ' - <a href="' + item.url + '" target="_blank">View the site</a>';
		
		$('div#view_site').html('<a href="' + item.url + '" target="_blank">View the site</a>');
		$('div#view_site').css('display', 'block');
	}else{
		$('div#view_site').html('');
	}
	
	html_str  += '</h1>';
	
	//create the description if available
	if(item.description != undefined) {
		html_str += item.description;
	}
	
	text_content_div.innerHTML = html_str;
}

function new_image(num, path) {
	//var popup_image = document.getElementById("popup_image");
	
	load_into_popup_image(path);
	
	var img_nav_ul = document.getElementById('img_nav');
	
	var li_arr = img_nav_ul.getElementsByTagName("li");
	var nav_arr = new Array();
	for(var i = 0; i < li_arr.length; i++) {
		var li = li_arr[i];
		
		if(li.getAttribute("id") != "prev" && li.getAttribute("id") != "next") {
			nav_arr.push(li);
		}
	}
	
	for(var i = 0; i < nav_arr.length; i++) {
		var li = nav_arr[i];
		
		if(i != num) {
			li.className = "";
		}else {
			li.className = "selected";
		}
	}
	
	$('#image_loading_circle').css('display', 'block');
}

function prev_image() {
	var num;
	var path;
	
	var img_nav_ul = document.getElementById('img_nav');
	var li_arr = img_nav_ul.getElementsByTagName("li");
	var nav_arr = new Array();
	for(var i = 0; i < li_arr.length; i++) {
		var li = li_arr[i];
		
		if(li.getAttribute("id") != "prev" && li.getAttribute("id") != "next") {
			nav_arr.push(li);
		}
	}
	
	for(var i = 1; i < nav_arr.length; i++) {
		var li = nav_arr[i];
		
		if(li.className == "selected") {
			num = i - 1;
			var new_li = nav_arr[num];
			path = new_li.getElementsByTagName("a")[0];
		}
	}
	
	if(typeof(num) != "number") {
		return;
	}
	
	$('#image_loading_circle').css('display', 'block');
	
	//var popup_image = document.getElementById("popup_image");
	load_into_popup_image(path);
	
	for(var i = 0; i < nav_arr.length; i++) {
		var li = nav_arr[i];
		if(i != num) {
			li.className = "";
		}else {
			li.className = "selected";
		}
	}
}

function next_image() {
	var num;
	var path;
	
	var img_nav_ul = document.getElementById('img_nav');
	var li_arr = img_nav_ul.getElementsByTagName("li");
	var nav_arr = new Array();
	for(var i = 0; i < li_arr.length; i++) {
		var li = li_arr[i];
		
		if(li.getAttribute("id") != "prev" && li.getAttribute("id") != "next") {
			nav_arr.push(li);
		}
	}
	
	for(var i = 0; i < nav_arr.length - 1; i++) {
		var li = nav_arr[i];
		
		if(li.className == "selected") {
			num = i + 1;
			var new_li = nav_arr[num];
			path = new_li.getElementsByTagName("a")[0];
		}
	}
	
	if(typeof(num) != "number") {
		return;
	}
	
	$('#image_loading_circle').css('display', 'block');
	
	//var popup_image = document.getElementById("popup_image");
	load_into_popup_image(path);
	
	for(var i = 0; i < nav_arr.length; i++) {
		var li = nav_arr[i];
		if(i != num) {
			li.className = "";
		}else {
			li.className = "selected";
		}
	}
}















function close_popup() {
	
	
	//reset the image
	$('div#popup_image_container').html('');
	$('div#popup_image_container').css('width', 'auto');
	$('div#popup_image_container').css('height', 'auto');
	
	//hide the content
	var content = document.getElementById('popup_content');
	content.style.display = "none";
	
	//hide the popup
	var popup = document.getElementById('item_popup');
	popup.style.display = 'none';
}

function popup_content_size() {
	//hide the loading animations
	$('#image_loading_circle').css('display', 'none');
	$('#loading_circle').css('display', 'none');
	
	//show the content
	var content = document.getElementById('popup_content');
	var popup_image = document.getElementById("popup_image");
	content.style.display = "block";
	content.style.width = getElementWidth(popup_image) + 'px';
	
	//make the background grow if needed based on the content size
	var scroll_top = getScrollTop();
	var content_height = getElementHeight(content);
	
	var background = document.getElementById('background');
	var background_height = background.style.height;
	background_height = background_height.replace('px', '');
	
	var popup = document.getElementById('item_popup');
	
	if(scroll_top + 50 + content_height > background_height) {
		popup.style.height = scroll_top + 50 + content_height + 'px';
		background.style.height = scroll_top + 50 + content_height + 'px';
	}
}