<!--
// jQuery.noConflict();
// RUN

var selected, index, total;
var width, center, spread;

var transition = false;
var projectopen = false;

jQuery(document).ready( function() {

	/* Yer outta here! */
	if ( $.browser.msie ) $(location).attr('href', "http://www.omarelsayed.com/ie/");
	
	/* Init variables */
	selected = $(".section.selected");
	index = $(".section").index(selected);
	total = $(".section").length - 1;
	
	width = selected.width();
	center = $(window).width() / 2;
	spread = width * 0.25 + $(window).width() / 2;

	/* Build interface */
	layoutSections();
	$("body").prepend("	<div id='startover'></div>");
	$("body").prepend("<div id='background'><div></div></div>");
	$("body").css("background", "#ededed");
	var bgpos = $("#background").position().left - (index * spread) / 4;
	$("#background").css("left", bgpos);
	$(".message").hide();
	selected.children(".message").fadeIn(1000);
	$('#rightarrow').show();
	$('#leftarrow').show();
	if (index < total) $('#rightarrow').animate({right:-20}, 600);
	$('#rightarrow').fadeTo(200,0.8).fadeTo(300,0.3).fadeTo(300,0.8).fadeTo(300,0.3).fadeTo(300,0.8).fadeTo(300,0.6);
	if (index > 0) $('#leftarrow').animate({left:-20}, 600);
	if (index > 0) $('#startover').show();
	
	/* Init Parralax */
	$('.section').jparallax(
		{ mouseport:jQuery('body'), frameDuration:62, linkResponse:false },
		{ xtravel:-0.9, width:600, height:600 },
		{ xtravel:-0.18, ytravel:-0.18, width:55, height:355 },
		{ xtravel:-0.2, ytravel:-0.2, width:50, height:350 }
	);

	$('#background').jparallax(
		{ mouseport:jQuery('body'), frameDuration:60, yparallax:false, linkResponse:false },
		{ xtravel:0.06, width:5000 }
	);
	
	/* Buttons! */
	$("#title").click( function() {
		closeProject();
		selected.children(".message").fadeIn(1000);
		moveTo(0);
	});

	$('#rightarrow').click( function() {
		if ( index < total && !projectopen ) {
			$(this).animate({right:-20}, 800);
			moveTo(index + 1);
		}		
	});

	$('#leftarrow').click( function() {
		if ( index > 0 && !projectopen ) {
			$(this).animate({left:-20}, 800);
			moveTo(index - 1);			
		}
	});

	$("#startover").click( function() {
		closeProject();
		selected.children(".message").fadeIn(1000);
		$("#rightarrow").animate({right:-20}, 800);
		moveTo(0);
	});
	
	$(".getintouch").live("click", function()  {
		var pos = $("body").height() / 2 - 60;
		$("#contactinfo").animate({top:pos}, 150, "swing");
	});
	
	$("#contactinfo .close").click( function()  {
		var pos = $("body").height() / 2 - 60 + 40;
		$("#contactinfo").animate({top:pos}, 50, "swing", function() {
			$("#contactinfo").animate({top:-145}, 200, "swing");
		});
	});
	
	$(".viewproject").click( function() {
		selected.children(".message").fadeOut("500", function() {
			$("#leftarrow").animate({left:-60}, 300)				
			$("#rightarrow").animate({right:-60}, 300)				
		});
		loadProject($(this).attr("title"));		
	});
	
	$("#projectdialog .close").click(closeProject);
	
	$(".gallery > .galleryarrow").live("mouseup", function() {

			var images = $("#projectdialog .gallery").children("ul");
			var current = images.children(".selected");
			var title = $("#projectdialog .gallery").children("h5");
			
			var index = images.children().index(current);
			if( $(this).hasClass("nextbutton") ) {
				if (index == images.children().length - 1) var next = images.children("li:first");
				else var next = current.next();
			}
			else if( $(this).hasClass("prevbutton") ) {
				if (index == 0) var next = images.children("li:last");
				else var next = current.prev();
			}
			
			var page = (images.children().index(next) + 1) + " of " + images.children().length;
			$(".gallery > span").text(page);
			title.text(next.attr("title"));
			current.fadeOut();
			current.removeClass("selected");
			next.fadeIn();
			next.addClass("selected");
			
	});
	
	/* Logic & Maths */
	function moveTo(targetindex) {
		if (!transition && targetindex != index) {
			transition = true;
			
			var target = $(".section").eq(targetindex);	
			var travel = spread * (targetindex - index);

			for( var i = 0; i <= total; i++) {
				
				var section = $(".section").eq(i);
				var pos = center + ((i - index) * spread) - travel;
				
				if ( targetindex > index ) {
					if ( i <= targetindex + 1 && i >= index - 1) {
						section.show();
						section.animate({left: pos}, 700, "swing");
					}
					else {
						section.hide();
						section.css("left", pos);
					}
				}
				else {
					if ( i >= targetindex - 1 && i <= index + 1) {
						section.show();
						section.animate({left: pos}, 700, "swing");
					}
					else {
						section.hide();
						section.css("left", pos);
					}
				}
				
			}// end for
						
			var bgpos = $("#background").position().left - travel / 4;
			$("#background").animate({ left:bgpos }, 900, "swing");
			
			if (targetindex < total) $('#rightarrow').animate({right:-20}, 400);
			else $('#rightarrow').animate({right:-60}, 100);
			
			if (targetindex > 0) {
				$('#leftarrow').animate({left:-20}, 400);
				$("#startover").fadeIn(300);
			}
			else {
				$('#leftarrow').animate({left:-60}, 100);	
				$("#startover").fadeOut(800);
			} 
			
			selected.children(".message").fadeOut(300, function() {
				target.children(".message").fadeIn(700);
				selected = target;
				index = targetindex;
				transition = false;
			});
			
		} // end if
		
	}// end moveTo()
	
	function layoutSections() {
		
		var target = $(".section:first");
		for( var i = -index; i <= total - index; i++) {
			target.css("left", center + (i * spread));
			target = target.next();
			if ( i < - 1 || i >  1 ) $(".section").eq(i).hide();
		}
	}
	
	$(window).resize( function(){
		center = $(window).width() / 2;
		spread = width * 0.25 + $(window).width() / 2;
		layoutSections();
	});
	
	function loadProject(project) {
		projectopen = true;
		var path = "/projects/" + project + "/";
		$("#projectdialog").fadeIn(500, function() {
			$("#projectdialog .container").load(path, function() {
				$("#projectdialog .loading").hide();
			});
		});
	}
	
	function closeProject() {
		$("#projectdialog").fadeOut(200, function() {
			$("#projectdialog .container").empty();
			$("#projectdialog .loading").show();		
		});		

		if (index < total) $('#rightarrow').animate({right:-20}, 600);
		if (index > 0) $('#leftarrow').animate({left:-20}, 600);
		
		selected.children(".message").fadeIn(1000);
		projectopen = false;
	}
	
	/* Menu */
	$("#menu").hover (
			function() {
				$(this).fadeTo(200, 0.5);
				$("#menulist").slideDown(200, function() {
					$("#menulist li").fadeIn();
				});
			},
			function() {
				$(this).fadeTo(200, 0.3);
				$("#menulist li").fadeOut(200);
				$("#menulist").fadeOut(300);
			}
	);
	
	$("#menu li a").click( function () {
		var project = $(this).attr("name");
		var targetindex = $(".section").index($("#" + project));
		moveTo(targetindex);
		if ( projectopen ) closeProject();
	});
	
	/* Styling */
	$("#rightarrow").mousedown( function () {
		if ( index < total && !projectopen ) {
			$(this).stop(true)
			$(this).animate({right:0}, 20);
		}
	});
	
	$("#leftarrow").mousedown( function () {
		if ( index > 0 && !projectopen) {
			$(this).stop(true)
			$(this).animate({left:0}, 20);
		}
	});
	
	$("#title").hover(
		function () { $(this).fadeTo(200, 0.7); },
		function () { $(this).fadeTo(500, 0.4); }
	);
	
	$(".mainarrow").hover(
		function () { $(this).fadeTo(200, 0.6); },
		function () { $(this).fadeTo(500, 0.3); }
	);
	
	$("#startover").hover(
		function () { $(this).fadeTo(200, 1); },
		function () { $(this).fadeTo(300, 0.6); }
	);
	
	/* Debug */
	function debug( message, clear ) {
		if ( $("#debug").length == 0) $("body").append("<ul id='debug'></ul>");	
		if ( clear ) $("#debug").empty();
		var status = "<li>" + message + "</li>";;
		$("#debug").prepend(status);
	}
});

//-->