jQuery(function( $ ){
	/**
	 * Demo binding and preparation, no need to read this part
	 */
		//borrowed from jQuery easing plugin
		//http://gsgd.co.uk/sandbox/jquery.easing.php
		$.easing.elasout = function(x, t, b, c, d) {
			var s=1.70158;var p=0;var a=c;
			if (t==0) return b;  if ((t/=d)==1) return b+c;  if (!p) p=d*.3;
			if (a < Math.abs(c)) { a=c; var s=p/4; }
			else var s = p/(2*Math.PI) * Math.asin (c/a);
			return a*Math.pow(2,-10*t) * Math.sin( (t*d-s)*(2*Math.PI)/p ) + c + b;
		};
		$('a.back').click(function(){
			$(this).parents('div.pane').scrollTo( 0, 800, { queue:true } );
			$(this).parents('div.section').find('span.message').text( this.title );
			return false;
		});
		//just for the example, to stop the click on the links.
		$('ul.links').click(function(e){
			e.preventDefault();
			var link = e.target;
			link.blur();
			if( link.title )
				$(this).parent().find('span.message').text(link.title);
		});
	
	//by default, the scroll is only done vertically ('y'), change it to both.
	$.scrollTo.defaults.axis = 'x'; 			
	//this one is important, many browsers don't reset scroll on refreshes
	$('div.pane').scrollTo( 0 );//reset all scrollable panes to (0,0)
	$.scrollTo( 0 );//reset the screen to (0,0)
	
	//TOC, shows how to scroll the whole window
	$('#toc a').click(function(){//$.scrollTo works EXACTLY the same way, but scrolls the whole screen
		$.scrollTo( this.hash, 1500, { easing:'elasout' });
		$(this.hash).find('span.message').text( this.title );
		return false;
	});
	
	$('a.anchor').click(function(){
		return false;
	});
	
	//Target examples bindings
	var $paneTarget = $('#artworknav');
	var $paneTarget2 = $('#book');
	var $paneTarget3 = $('#bookwrapper');
	var $paneTarget4 = $('#seeinsidewrapper');
	var $paneTarget5 = $('#images');
	var $paneTarget6 = $('#imagenav');
	
	$('#relative-selector').click(function(){
		$paneTarget.stop().scrollTo( 'li:eq(14)', 800 );
	});http://www.stephenjohnsonstudio.com/images/artwork/a2.jpg
	$('#jquery-object').click(function(){
		var $target = $paneTarget.find('li:eq(3)');
		$paneTarget.stop().scrollTo( $target , 800 );
	});
	
	$('#insidenav ul li a').each(function(){
		$(this).click(function(){
			var target = $(this).attr("href");
			$paneTarget4.stop().scrollTo( target, 800 );
		});
	});
	
	
	
	$('#absolute-number').click(function(){
		$paneTarget.stop().scrollTo( 150, 800 );
	});
	
	$(window).bind("load", function(){
		var target = $('a.active');
		$paneTarget.stop().scrollTo( target, 800 );
	});
	
	$('li.synopsis a').click(function(){
		$('ul#booknav li').removeClass('active');
		$('li.synopsis').addClass('active');
		$paneTarget3.stop().scrollTo( 0, 800 );
		$paneTarget2.stop().scrollTo( 0, 800 );
	});
	$('li.awards a').click(function(){
		$('ul#booknav li').removeClass('active');
		$('li.awards').addClass('active');
		$paneTarget3.stop().scrollTo( 0, 800 );
		$paneTarget2.stop().scrollTo( 375, 800 );
	});
	$('li.reviews a').click(function(){
		$('ul#booknav li').removeClass('active');
		$('li.reviews').addClass('active');
		$paneTarget3.stop().scrollTo( 0, 800 );
		$paneTarget2.stop().scrollTo( 750, 800 );
	});
	$('li.buynow a').click(function(){
		$('ul#booknav li').removeClass('active');
		$('li.buynow').addClass('active');
		$paneTarget3.stop().scrollTo( 0, 800 );
		$paneTarget2.stop().scrollTo( 1125, 800 );
	});
	$('li.seeinside a').click(function(){
		$('ul#booknav li').removeClass('active');
		$('li.seeinside').addClass('active');
		$paneTarget4.stop().scrollTo( 0, 800 );
		$paneTarget3.stop().scrollTo( 850, 800 );
	});
	
	
	$('.navright').click(function(){
		$paneTarget.stop().scrollTo( '+=500', 800 );
	});
	$('.navleft').click(function(){
		$paneTarget.stop().scrollTo( '-=500', 800 );
	});
	
	$('a.navright2').click(function(){
		$paneTarget4.stop().scrollTo( '+=850', 500 );
	});
	$('a.navleft2').click(function(){
		$paneTarget4.stop().scrollTo( '-=850', 500 );
	});
	
	$('.thumbnavright').click(function(){
		$paneTarget6.stop().scrollTo( '+=250', 600 );
	});
	$('.thumbnavleft').click(function(){
		$paneTarget6.stop().scrollTo( '-=250', 600 );
	});
	
	
	$("ul#menuhome li.menuartwork").hover(function(){
		$(this).animate({height: "60px"}, "fast");
		}, function() {
		$(this).animate({height: "30px"}, "fast");
	});
	
	$("ul#imagenavlist li a:first").addClass('active'); //Create active class on image nav
	
	/*$("ul#imagenavlist li a").click(function() { //Navigating to new image

		$("ul#imagenavlist li a").removeClass('active'); //Clear class name of image nav
		$(this).addClass('active'); //Add active class to clicked image
		var largePath = $(this).attr("href"); //Turn clicked URL into a variable
		var caption = $(this).attr("title");
		
		$("#imageLarge").fadeTo(500,0).delay(500,function(){ //Fade to 0 and wait until animation completes
			$("#image p").html(caption);
			$("#imageLarge").attr({ src: largePath }).delay(1000, function() { //Assign variable as image attribute and wait so next animation doesn't occur until image loads
				$("#imageLarge").fadeTo(1000,1); //Fade back to 100% visibility
			});
		});
	});*/
	
	var originalHeight = $("#imageLarge").height();
	originalHeight = originalHeight+50;
	$("#image").height(originalHeight);
	
	$("ul#imagenavlist li a").click(function() { //Navigating to new image

		$("ul#imagenavlist li a").removeClass('active'); //Clear class name of image nav
		$(this).addClass('active'); //Add active class to clicked image
		var largePath = $(this).attr("href"); //Turn clicked URL into a variable
		var caption = $(this).attr("title"); //Grab title for caption

		$("#imageLarge").removeAttr("height").removeAttr("width").fadeOut("slow", function(){ //Fade out existing image
			$(this).attr({src:largePath}).fadeIn("slow", function(){
				var newImageHeight = $(this).height();
				var newHeight = newImageHeight+50;
				$("#image").animate({height:newHeight}, "fast");
			}); //Change source of existing image and fade back in
		});
		
		$("#image p").replaceWith('<p>'+caption+'</p>'); //Replace existing caption with new caption.
		
		return false; //Don't navigate to image URL
		
	});

});