// Assign the global jQuery object to its shorthand form
var $ = jQuery;

// Initialize global variabls
var target_html;	// This holds the original content after loading a portfolio item
var body_class;		// This holds the original body class after loading a portfolio item
var is_html_loaded = false;

// Watch for a change in the URL, this is how we find out what portfolio item we are looking at
$(window).hashchange(function() {
	// get rid of the hash tag from the url hash
	var url_endpoint = location.hash.replace("#", "");
//	console.log(project);
	// the target for replacing content is #main, we will reuse this
	var target = '#main';
	if (url_endpoint) {
		load_html(url_endpoint, target);
		$('.current-portfolio-item').attr('class', '');
		$('a[href$="' + location.hash + '"]').first().parent().attr('class', 'current-portfolio-item');
	} else {
		unload_html(target);
	}
	
});

$(document).ready(init);

function init() {
	$(window).hashchange();
	// Prepare the content to fade in
	$('#main .aside').css({opacity: '0', top: '40px'});
	$('#content').css({opacity: '0', top: '40px'}).animate({opacity: '1', top: '0'});
	
	// Use JS to fix the links of the portfolio to dynamically load them into the content.
	$('#portfolio-slider a').each(function() {
		var href = $(this).attr('href');
		href = "/#" + href;
		$(this).attr('href', href);
	});
	$('#portfolio-slider').tinycarousel({ duration: 400, display: 5 });
	
	target_html = $('#main').html();
	body_class = $('body').attr('class');
	
	// Wait a bit before animating the asides.
	setTimeout(function() {
		$('#main .aside').animate({opacity: '1', top: '0'});
	}, 200);
}

function load_html(url, target, callback) {
//	if (!is_html_loaded) {
//		target_html = $(target).html();
//		is_html_loaded = false;
//	}
//	console.log(url);
	
	
	$('#content').animate({opacity: '0', top: '40px'});
	setTimeout(function() {
		$.get(url, function(data) {
			$(target).html(data);
			$('#content').css({opacity: '0', top: '40px'}).animate({opacity: '1', top: '0'});
			if (callback) callback();
		});
	}, 200);
	
//	scrollTo(0, 0);
}
function unload_html(target, callback) {
	$(target).html(target_html);
	update_body_class(body_class);
	if (callback) callback();	
}

function update_body_class(c) {
	$('body').attr('class', c);
	
//	console.log(body_class);
//	console.log(c);
}