$(document).ready(function() {

	/* JSCROLLPANE ========================================================== */
	$('.scrollpane').jScrollPane();


	$("#background, .front #nav-bar-bg, .front #nav-bar, #projects-container").css({opacity:0});
	$(".right-column-overlay").css({opacity:0}).hide();


	/* FRONT BACKGROUND FADE-IN */
	$('.front #nav-bar-bg').fadeTo(800, 1, function() {
		$('.front #nav-bar').fadeTo(800, 1, function() {
			$('.front #background').fadeTo(800, 1);
		});
	});

	/* OTHER FADE-INS */
	$('.about #background, .contact #background, .planning #background, .press #background').fadeTo(800, 1, function() {
		$('.right-column-overlay').show().fadeTo(500, 0.8);
	});
	$('#projects-container').fadeTo(800, 1);



	/* BACKGROUND RESIZER */
	function resizeBackground() {
		containerWidth = $('#background').width();
		containerHeight = $('#background').height();
		graphicWidth = $('#background img').width();
		graphicHeight = $('#background img').height();
		widthRatio = containerWidth/graphicWidth;
		heightRatio = containerHeight/graphicHeight;
		if (widthRatio > heightRatio) {
			$('#background img').width(graphicWidth*widthRatio).height(graphicHeight*widthRatio);
		} else {
			$('#background img').width(graphicWidth*heightRatio).height(graphicHeight*heightRatio);
		}
	};
	resizeBackground();
	$(window).bind("resize", resizeBackground);


	/* LINK ROLLOVERS*/
	$("a").not("a.nav-projects, a.nav-about, a.nav-contact, .right-column-overlay a").hover(
		function() { $(this).animate({color:"#455560"}, 200); },
		function() { $(this).animate({color:"#b2bd21"}, 200); }
	);
	$("#nav a, .right-column-overlay a").hover(
		function() { $(this).animate({color:"#b2bd21"}, 200); },
		function() { $(this).animate({color:"#ffffff"}, 200); }
	);




	/* PROJECT PAGE ========================================================== */
	$('#projects-container').css({overflow:"hidden"});
	$('#projects-container ul').width($("ul.projects-list > li.project-strip").length * 120);

		/* project strip hover: enabling this makes the scrolling jumpy. Leave disabled. */
		/* $("li.project-strip").css({opacity:0.5});
		$("li.project-strip").hover(
			function() { $(this).stop().fadeTo(200, 1.0); },
			function() { $(this).stop().fadeTo(800, 0.5); }		
		); */

	var $list = $('ul.projects-list');
	var $container = $('#projects-container');
	var cw = $('#projects-container').width(); 
	var lw = $('ul.projects-list').width(); 
	var mousepos = 1;

	/* Ricardo's code */
	$container.mousemove(function(e) { 
		var diff = e.pageX - mousepos; 
		//if (diff > 4 || diff < -4) { 
			mousepos = e.pageX; 
			newX = (cw - lw)*e.pageX/cw; 
			diff = parseInt(Math.abs( $list.css('left').substring(0,4)-newX )); 
			$list.stop().animate({'left':newX}, {duration:3000,easing:'easeOutExpo'}); 
		//} 
	}); 


	/* SINGLE PROJECT BEHAVIOURS ========================================================== */
	$("#single-project-container").css({overflow:"hidden"});

		/* display thumbnails */
		$("#project-thumbnails").css({display:"block"});
	
		/* thumbnail resets */
		function resetThumbs() {
			$('#project-thumbnails img').css({opacity:0.67}).removeClass("active");
		}
		resetThumbs();
		$('#project-thumbnails img:first').css({opacity:1.0}).addClass("active");
		var firstAlt = $('#project-thumbnails img:first').attr("alt");
		if (!firstAlt) { firstAlt = " "; };
		$('#project-image-caption').html('<p><strong>' + firstAlt + '</strong></p>');		
	
		/* thumbnail hover */
		//$('#project-thumbnails img').not("img.active").hover(
		//	function() { $(this).fadeTo(500, 1.0); },
		//	function() { $(this).fadeTo(500, 0.67); }
		//);

		/* thumbnail click handler */
		$('#project-thumbnails img').click(function(evt) {
			evt.preventDefault();
			$('#project-thumbnails img').not(this).fadeTo(500, 0.67).removeClass("active");
			$(this).fadeTo(500, 1.0).addClass("active");

			var thumbSrc = $(this).attr("src");
			var thumbAlt = $(this).attr("alt");
			if (!thumbAlt) { thumbAlt = " "; };
			var largeSrc = thumbSrc.replace("t.jpg", ".jpg");
			$('#project-image').fadeTo(500, 0, function() {
				$('#project-image').html('<img src="'+largeSrc+'" alt="'+thumbAlt+'" />');
				$('#project-image').fadeTo(500, 1.0);
				$('#project-image-caption').html('<p><strong>' + thumbAlt + '</strong></p>');

			});
		});

}); // END JQUERY DOCUMENT READY