$(function(){

	//get the page content on init
	loadContent(window.location.hash);

	//on clicking a nav link, check the url and load
	$("aside a").click(function(){
		
		href = $(this).attr("href");
		loadContent(href);
		
		//change the page title
		var title = $(this).text();
		$("title").html("Clare Price - " + title);
			
	});
	
	//restore aside to 100% opacity on mouseover
	$("aside").hover(
		function(){
			//wax on
			$(this).stop().animate({opacity:1}, 200);
		},
		function(){
			//wax off
			$(this).stop().animate({opacity:0.6}, 200);
			
		}	
	);
	
});

/*
Loads page content based on parameter
*/
function loadContent(href){

	href = href.replace("#", "");//remove the hash if there is one
	
	if(href != 'biography' && href != 'writings' && href != 'contact' && href != 'links'){
		
		href = "home";
	}

	//remove the current class from the other links
	$("nav a").removeClass("current");
	
	//add the class 'current' to the appropriate link
	$("nav a#" + href).addClass("current");
	
	//elements
	var e = $("div#external");//the content
	var loading = $("img#main-loader");
	
	e.fadeOut(function(){
		loading.show();
				
		$.ajax({url: href + ".html", context: document.body, success: function(html){
			
			//load the returned content into the page		
			loading.hide();
			e.html(html).fadeIn(100);
			
		}});
		
		//end e fadeout
	});
}

function galleryLoad(img){
	
	//full size image directory
	var imgdir = 'img/gallery_large/';
	//the viewer element
	var viewer = $("#gallery #viewer");
	//the element into which we'll load the content
	var target = $("#gallery #viewer #extcontent");	
	//the url to the image
	var imgurl = imgdir + img + '.jpg';	
	//the tag for the image
	var imgtag = '<img id="main-img" src="' + imgurl + '" alt="' + img + '" />';
	

	target.fadeOut(function(){
		
		//show the loader
		$("#gallery-loader").show();
		//once the target element has been faded out, replace its content with the tag
		//we actually need to move the image off screen and make it visible so we can get it's height. Lame. 
		target.css({position:'absolute', left:'-999px'}).html(imgtag).children("#main-img").load(function(){
			
			//get the height of the image so we can smoothly animate the viewer size
			$(this).show(function(){
				var newheight = target.height();
				
				//scroll back to the top of the page
				$('html, body').animate({scrollTop: '0px'}, 500);
				
				//and slide the thumbnails back down
				viewer.animate({height : newheight}, 500, function(){
					//good to go! hide the loader and show the image
					$("#gallery-loader").hide();
					target.hide().css({position:'relative', left: '0px'}).fadeIn();
					
				});
			});
		});
			
	});
	
}

function detailsLoad(details){

	//image details element
	var element = $("#gallery #imgdetails p");
	
	element.animate({left: "-" + element.outerWidth() + "px"}, function(){
		$(this).html(details).animate({left : 0});
	});
}