$(document).ready(function() {

//disabled jQuery for IE6
if (($.browser.className) != 'msie6')
	{

	$("#twitter").getTwitter({
		userName: "philipspence",
		numTweets: 3,
		loaderText: "Loading tweets...",
		slideIn: false,
		showHeading: false,
		headingText: "Twitter",
		showProfileLink: true
	});


$("#header").fadeTo(2500, 0.33);





//hides stuff at the start
$("#webDesign").hide();
$("em.info").hide();
$("#about").hide();
$("#accessibility").hide();
$("#graphicDesign").hide();
$("#twitter").hide();
$("#contact").hide();

var flag = 0;
var global_GH = 0;


//adds cursor to volcano
$("#innerVolcano").addClass("cursor");
$("#smallCloud").addClass("cursor");
$("#factory").addClass("cursor");
$("#gem").addClass("cursor");
$("#bear").addClass("cursor");
$("#acorn").addClass("cursor");
$(".scrollDown").addClass("cursor");
$(".scrollUp").addClass("cursor");
$("#twitterbird").addClass("cursor");
$("#contactFlower").addClass("cursor");

//makes cloud clickable (webdesign overview)
$("#smallCloud").click(function () {
$("#volcano div.visible").removeClass("visible").fadeOut("slow");
$("#webDesign").addClass("visible").fadeIn("slow");});

//makes gem clickable (web accessibility info)
$("#gem").click(function () {
$("#volcano div.visible").removeClass("visible").fadeOut("slow");
$("#accessibility").addClass("visible").fadeIn("slow");});

//makes flower clickable (graphics design overview)
$("#acorn").click(function () {
//$("#volcano div.visible").removeClass("visible").fadeOut("slow");
$("#graphicDesign").addClass("visible").fadeIn("slow");});

//makes the close button work
$(".closeButton").click(function () {
$(this).parent().parent().fadeOut("slow");
return false;
});

//makes the world scroll
$.localScroll({
axis:'x',
duration:4500,
hash:false,
offset: 0
});

//animates the header opacity
$("#header").hover(
	function () {
	$(this).fadeTo("slow", 1);
	}, 
	function () {
	$(this).fadeTo("slow", 0.33);
	}
    );

//animates 'home' text when hovering over the header.
$("#header h1").hover(
	function () {
	if (($.browser.className) != 'msie7')
		{
		$("#header h1 span").animate({top: "24"}, 600);
		}
	else
		{
		$("#header h1 span").animate({top: "25"}, 600);
		}
	}, 
	function () {
	$("#header h1 span").animate({top: "40"}, 600);
	}
    );

//animates the header moving
$("#header").scrollFollow( {
		offset: 506,
		speed: 1000
		} );

	//webdesign portfolio the info panels
	$("#innerVolcano").hover(function() {
	  $(this).next("em").animate({opacity: "show", top: "232"}, "slow");
	}, function() {
	  $(this).next("em").animate({opacity: "hide", top: "217"}, "fast");
	});

	//webdesign overview info panel
	$("#smallCloud").hover(function() {
	  $(this).next("em").animate({opacity: "show", top: "195"}, "slow");
	}, function() {
	  $(this).next("em").animate({opacity: "hide", top: "180"}, "fast");
	});

	//webdesign accessibility info panel
	$("#gem").hover(function() {
	  $(this).next("em").animate({opacity: "show", top: "485"}, "slow");
	}, function() {
	  $(this).next("em").animate({opacity: "hide", top: "470"}, "fast");
	});

	//About info panel
	$("#factory").hover(function() {
	  $(this).prev("em").animate({opacity: "show", top: "370"}, "slow");
	}, function() {
	  $(this).prev("em").animate({opacity: "hide", top: "355"}, "fast");
	});

	//graphics design portfolio info panel
	$("#bear").hover(function() {
	  $(this).next("em").animate({opacity: "show", top: "325"}, "slow");
	}, function() {
	  $(this).next("em").animate({opacity: "hide", top: "310"}, "fast");
	});

	//graphics design overview info panel
	$("#acorn").hover(function() {
	  $(this).next("em").animate({opacity: "show", top: "151"}, "slow");
	}, function() {
	  $(this).next("em").animate({opacity: "hide", top: "134"}, "fast");
	});

	//twitter info panel
	$("#twitterbird").hover(function() {
	  $(this).next("em").animate({opacity: "show", top: "95"}, "slow");
	}, function() {
	  $(this).next("em").animate({opacity: "hide", top: "80"}, "fast");
	});

	//contact info panel
	$("#contactFlower").hover(function() {
	  $(this).next("em").animate({opacity: "show", top: "90"}, "slow");
	}, function() {
	  $(this).next("em").animate({opacity: "hide", top: "75"}, "fast");
	});

	//Initiates Web Design Portfolio
	$("#innerVolcano").click(function () {
	

	//resets gallery
	$("#webDesignOverlay div.rightPage.visible").hide().removeClass("visible");
	$("#webDesignOverlay div.rightPage:first").show().addClass("visible");


	$("ol.gallery li").animate({top: 0}, 1);
	$("html").css("overflow", "hidden");
	var viewportWidth = parseInt( $( window ).width() );
	var viewportHeight = parseInt( $( window ).height() );
	var pageScroll =  parseInt( $( document ).scrollLeft() );
	var pageScrollTop =  parseInt( $( document ).scrollTop() );

	$("#webDesignOverlay").fadeTo("0", "0.93");
	$("#webDesignOverlay").css("height",viewportHeight);
	$("#webDesignOverlay").css("width",viewportWidth);
	$("#webDesignOverlay").animate({top: pageScrollTop}, "fast");		
	$("#webDesignOverlay").animate({left: pageScroll}, "fast");
	
	//if gallery height not set

	if (global_GH == 0)
		{
		//set height
		global_GH = $("#webDesignOverlay div.leftSide ol.gallery").height();
		$("#webDesignOverlay ol.gallery").height('383px');
		
		if (global_GH > "383")
			{
			//$("#webDesignOverlay ol.gallery").before("height =" + GH+"px<br />");
			//$("#webDesignOverlay ol.gallery").before(" calculated gallery height="+finalNumber+"px");
			$("#webDesignOverlay .scrollUp").show();
			$("#webDesignOverlay .scrollDown").show();
			//$("#webDesignOverlay").addClass("slim");
			}
		else
			{
			//$("#webDesignOverlay .scrollUp").hide();
			//$("#webDesignOverlay .scrollDown").hide();
			//$("#webDesignOverlay ol.gallery").before("height =" + GH+"px<br />");
			//$("#webDesignOverlay ol.gallery").before("width =" + GW+"px<br />");
			//$("#webDesignOverlay ol.gallery").before(" calculated gallery height="+finalNumber+"px");
			//$("#webDesignOverlay ol.gallery").before(GH);
			return global_GH;
			}

		}
	else
		{
		$("#webDesignOverlay ol.gallery").height('383px');
		}
	//return global_GH;
	});

	//Initiates Graphic Design Portfolio
	$("#bear").click(function () {
	
	//resets gallery
	$("#graphicDesignOverlay div.rightPage.visible").hide().removeClass("visible");
	$("#graphicDesignOverlay div.rightPage:first").show().addClass("visible");
	$("ol.gallery li").animate({top: 0}, 1);

	$("html").css("overflow", "hidden");
	var viewportWidth = parseInt( $( window ).width() );
	var viewportHeight = parseInt( $( window ).height() );
	var pageScroll =  parseInt( $( document ).scrollLeft() );
	var pageScrollTop =  parseInt( $( document ).scrollTop() );
	$("#graphicDesignOverlay").fadeTo("0", "0.93");
	$("#graphicDesignOverlay").css("height",viewportHeight);
	$("#graphicDesignOverlay").css("width",viewportWidth);
	$("#graphicDesignOverlay").animate({top: pageScrollTop}, "fast");	
	$("#graphicDesignOverlay").animate({left: pageScroll}, "fast");

	//if gallery height not set

if (global_GH == 0)
		{
		//set height
		global_GH = $("#graphicDesignOverlay div.leftSide ol.gallery").height();
		$("#graphicDesignOverlay ol.gallery").height('383px');
		
		if (global_GH > "383")
			{
			$("#graphicDesignOverlay .scrollUp").show();
			$("#graphicDesignOverlay .scrollDown").show();
			}
		else
			{
			return global_GH;
			}

		}
	else
		{
		$("#graphicDesignOverlay ol.gallery").height('383px');
		}
	//return global_GH;

	});


	//makes the close world button work
	$("div.overlay a.closeButton").click(function () {
	$(this).parent().parent().fadeOut("slow").animate({left: -4000}, "fast").fadeIn("slow");
	$("html").css("overflow", "auto");
	return false;
	});

	//makes the close About button work
	$(".closeAboutButton").click(function () {
	$(this).parent().parent().animate({opacity: "hide", top: 150}, 1000).animate({top: 470}, "slow");
	return false;
	});

	//makes the close Contact button work
	$(".closeContactButton").click(function () {
	$(this).parent().parent().fadeOut("fast");
	$("#contactFlower").animate({height: 81, top: 64}, 1000);
	return false;
	});

	//Displays About info
	$("#factory").click(function () {
	//hides current stuff
	$("#contact").fadeOut("fast");
	$("#contactFlower").animate({height: 81, top: 64}, 1000);
	$("#twitter").animate({opacity: "hide", top: 150}, 1000).animate({top: 470}, "slow");
	//shows info
	$("#about").animate({opacity: "show", top: "270"}, 2000);
	});

	//Displays Twitter info
	$("#twitterbird").click(function () {
	//hides current stuff
	$("#contact").fadeOut("fast");
	$("#contactFlower").animate({height: 81, top: 64}, 1000);
	$("#about").animate({opacity: "hide", top: 150}, 1000).animate({top: 470}, "slow");
	//shows info
	$("#twitter").animate({opacity: "show", top: "160"}, 2000);
	});

	//Displays Contact info
	$("#contactFlower").click(function () {
	//hides current stuff
	$("#about").animate({opacity: "hide", top: 150}, 1000).animate({top: 470}, "slow");
	$("#twitter").animate({opacity: "hide", top: 150}, 1000).animate({top: 470}, "slow");
	//shows info
	$("#contactFlower").animate({height: 421, top: -255}, 600);
	$("#contact").addClass("visible").animate({opacity: "show"}, 2000);
	});



	//sorts out BOTH galleries (which to display)
	$("div.rightPage").hide();
	$("#graphicDesignOverlay div.rightPage:first").show().addClass("visible");
	$("#webDesignOverlay div.rightPage:first").show().addClass("visible");

	//makes portfolio gallery work
	$("ol.gallery li a").click(function () {
	var graphicsPage = $(this).attr("class");
	$("div.rightPage.visible").hide().removeClass("visible");
	$("div.rightPage[id='" +graphicsPage+ "']").show().addClass("visible");
	return false;
	});

	//makes gallery scroll DOWN
	$(".scrollDown").click(function () {

	if (flag == 0) //ensures the animation doesn't fire if it's already animating
	{
	flag = 1;
	var positionTop = $(this).prev().children("li:first").position();
	//var galleryHeight = $(this).prev().height();
	galleryHeight = global_GH;
	galleryHeight = galleryHeight-((galleryHeight*2)-125);

	//$(this).before("global_GH="+global_GH);

	var newTop = positionTop.top;
	newTop = newTop-125;
	if (newTop > galleryHeight)
			{
		//$(".scrollDown").text( "scrollTop:" + newTop );
		$(this).prev().children("li").animate({top: newTop}, 1000, function () {
			flag = 0;
			});
		}
	else
		{
		newTop = newTop+125;
		flag = 0;
		}
	}
	});

	//makes gallery scroll UP
	$(".scrollUp").click(function () {
	if (flag == 0) //ensures the animation doesn't fire if it's already animating
	{
	flag = 1;
	var positionTopUp = $(this).next().children("li:first").position();
	var galleryHeightUp = 125;

	var newTopUp = positionTopUp.top
	newTopUp = newTopUp+125;
	if (newTopUp < galleryHeightUp )
		{
		//$(".scrollUp").text( "scrollTop:" + newTopUp );
		$(this).next().children("li").animate({top: newTopUp}, 1000, function () {
			flag = 0;
			});
		}
	else
		{
		newTopUp = newTopUp-125;
		flag = 0;
		}
	}
	
	});

	}//end of msie6 if statement

});