/*
 * Global variables
 */
var PAGE_MODE_MAIN = 'main';
var PAGE_MODE_PORTFOLIO = 'portfolio';
var pageMode = PAGE_MODE_MAIN;

/* 
 *	This is the main function that gets loaded when 
 * when the page is ready. Attach all js to the DOM
 * in this anonymous function.
 */
$(document).ready(function(){
  	$('#portfolio_button').click( function () {
		togglePageMode();
	});
	$('#category_list li').click( function() {
		changeCategory(this);
	});
});

/*
 * Global functions
 */
function trim(stringToTrim) {
	return stringToTrim.replace(/^\s+|\s+$/g,"");
}
 
function togglePageMode() {
	if (pageMode == PAGE_MODE_MAIN)
	{
		$('.main_page_only').css("visibility", "hidden");
		$('#portfolio_button .center').html("<strong>Return >></strong>");
		$('.portfolio_only').show();
		$('#gallery_container').load('portfolio/LivingRoom.html');
		$('#gallery_container').show();
		pageMode = PAGE_MODE_PORTFOLIO;
	}
	else
	{
		$('.main_page_only').css("visibility", "visible");
		$('#portfolio_button .center').html("<strong>See Portfolio >></strong>");
		$('.portfolio_only').hide();
		pageMode = PAGE_MODE_MAIN;
	}
}

function changeCategory(obj) {
	var selectedCategory = trim($(obj).html().replace(' ',''));
	$('#gallery_container').hide();
	$('#gallery_container').load('portfolio/'+selectedCategory+'.html');
	$('#gallery_container').show();
}