$(document).ready(function() {
	
		var arrayProjects = new Array();
		$('.projectGrid_item').each(function(index) {
			arrayProjects.push($(this).find("a").attr("id"));
		});
		$('.prevProject').attr('id', arrayProjects[arrayProjects.length-1]);
		$('.nextProject').attr('id', arrayProjects[1]);
		
		// ----------------------------------------------------
		// KEYBOARD EVENTS
		
		$(document).keydown(function (e) {
		    if(e.which == 37) { goToPrevProject(); return false; }
		    if(e.which == 39) { goToNextProject(); return false; }
		    if(e.which == 27) { $.address.value(""); return false; }
		});

	
		// ----------------------------------------------------
		// DEEP LINKING
		
		$.address.change(function(event) {  
			var curUrl = $.address.value().substr(1);
			if(curUrl.length && curUrl != "about") 
			{
				var curProjectId = curUrl;
				$('body').data('curProjectId', curUrl);
				
				if($("#aboutPanelContent").is(":visible")) {
					$("#aboutPanelContent").toggle('blind', 500, displayWorkPannel);
					$("#taglineLink").toggleClass('taglineClosed', 500);
				} 
				else
				{
					
					displayWorkPannel();
				}
			}
			else if(curUrl.length && curUrl == "about")
			{
				$("#aboutPanelContent").toggle('blind', 500);
				$("#taglineLink").toggleClass('taglineClosed', 500);
			}
			else
			{
				if($("#aboutPanelContent").is(":visible")) {
					$("#aboutPanelContent").toggle('blind', 500);
					$("#taglineLink").toggleClass('taglineClosed', 500);
				}
				if($("#projectContentWrapper").is(":visible")) { 
					closeWorkPannel();
				}
			}
		});  
		
		function changeAddress() {
			$.address.value($('body').data("curProjectId"));
		};
		
		
		// ----------------------------------------------------
		// PROJECTS LINKS EVENTS
		
		
		// Grid
		$(".projectGrid_item").click(function(){
			
			var curProjectId = $(this).find("a").attr("id");
			
			if($("#projectContentWrapper").is(":hidden")) { 
				$('body').data('curProjectId', curProjectId);
				$('html, body').animate({scrollTop:0}, 'slow');
				changeAddress();
			}
			else
			{
				if($('body').data("curProjectId") != curProjectId)
				{
					$('html, body').animate({scrollTop:0}, 'slow');
					$('body').data('curProjectId', curProjectId);
					$('#projectTopBarContent h2').fadeOut(200);
					$('.projectDate').fadeOut(200);
					$('.projectType').fadeOut(200);
					$('.projectRole').fadeOut(200);
					$('.projectUrl').fadeOut(200);
					$('.sexyCycle-content').fadeOut(200, changeAddress);
				}
			}
		});
		
		// List
		$(".projectTable_item").click(function(){
				
			var curProjectId = $(this).find("a").attr("id");
			
			if($("#projectContentWrapper").is(":hidden")) { 
				$('body').data('curProjectId', curProjectId);
				$('html, body').animate({scrollTop:0}, 'slow');
				changeAddress();
			}
			else
			{
				if($('body').data("curProjectId") != curProjectId)
				{
					$('html, body').animate({scrollTop:0}, 'slow');
					$('body').data('curProjectId', curProjectId);
					$('#projectTopBarContent h2').fadeOut(200);
					$('.projectDate').fadeOut(200);
					$('.projectType').fadeOut(200);
					$('.projectRole').fadeOut(200);
					$('.projectUrl').fadeOut(200);
					$('.sexyCycle-content').fadeOut(200, changeAddress);
				}
			}
		});
		
		// Gallery Next Project
		$(".nextProject").click(function(){
			goToNextProject();
		});
		
		function goToNextProject(curProjectId)
		{
			$('html, body').animate({scrollTop:0}, 'slow');
			var curProjectId = $(".nextProject").attr("id");
			$('body').data('curProjectId', curProjectId);
			
			$('#projectTopBarContent h2').fadeOut(200);
			$('.projectDate').fadeOut(200);
			$('.projectType').fadeOut(200);
			$('.projectRole').fadeOut(200);
			$('.projectUrl').fadeOut(200);
			$('.sexyCycle-content').fadeOut(200, changeAddress);
		}
		
		// Gallery Prev Project
		$(".prevProject").click(function(){
			goToPrevProject();
		});
		
		function goToPrevProject()
		{
			$('html, body').animate({scrollTop:0}, 'slow');
			var curProjectId = $(".prevProject").attr("id");
			$('body').data('curProjectId', curProjectId);
			
			$('#projectTopBarContent h2').fadeOut(200);
			$('.projectDate').fadeOut(200);
			$('.projectType').fadeOut(200);
			$('.projectRole').fadeOut(200);
			$('.projectUrl').fadeOut(200);
			$('.sexyCycle-content').fadeOut(200, changeAddress);
		}
		
		// Close Project
		$(".closeProject").click(function(){
			$.address.value("");
			$('html, body').animate({scrollTop:0}, 'slow');
		});
		
		
		// ----------------------------------------------------
		// DISPLAY WORK
		
		function displayWorkPannel() {
						
			$.ajax({
		        type: "GET",
				url: "data.xml",
				cache: false,
				dataType: "xml",
				success: function(xml) {
					$(xml).find('entry').each(function(){
						if($(this).find('projectId').text() == $('body').data("curProjectId"))
						{
							projectTitle = $(this).find('projectTitle').text();
							date = $(this).find('date').text();
							projectType = $(this).find('projectType').text();
							projectRole = $(this).find('projectRole').text();
							projectUrl = $(this).find('projectUrl').text();
							projectUrlText = $(this).find('projectUrlText').text();
							projectPhotos = $(this).find('projectPhotos').text();
							var arrayPhotos = projectPhotos.split(",");
							
							var stringPhotos = "";
							for (var i in arrayPhotos)
							{
							    stringPhotos = stringPhotos+'<li><img src="upload/'+arrayPhotos[i]+'" width="938" height="515" alt="" /></li>';
							}
														
							$('body').data('stringPhotos', stringPhotos);
							
							$('#projectTopBarContent h2').text(projectTitle);
							$('#projectTopBarContent .projectDate').html('&nbsp;&nbsp;&nbsp;-&nbsp;&nbsp;&nbsp;'+date);
							$('#projectTopBarContent .projectType').html('&nbsp;&nbsp;&nbsp;-&nbsp;&nbsp;&nbsp;'+projectType);
							$('#projectTopBarContent .projectRole').html('&nbsp;&nbsp;&nbsp;-&nbsp;&nbsp;&nbsp;'+projectRole);
							if(projectUrl == "") { 
								$('#projectTopBarContent .projectUrl').html('');
							}
							else
							{
								$('#projectTopBarContent .projectUrl').html('&nbsp;&nbsp;&nbsp;-&nbsp;&nbsp;&nbsp;<a href="'+projectUrl+'" target="_blank" class="greenLink noborder">'+projectUrlText+'</a>'); 
							}
							
							$('#projectTopBarContent h2').fadeIn(200);
							$('.projectDate').fadeIn(200);
							$('.projectType').fadeIn(200);
							$('.projectRole').fadeIn(200);
							$('.projectUrl').fadeIn(200);
							
							
							
						}
						
					});
					
					if($("#projectContentWrapper").is(":hidden")) { 
						$("#headerWrapper").hide('blind', 500);
						$("#projectContentWrapper").show('blind', 500, callbackDisplayWork);
					}
					else
					{
						callbackDisplayWork();
					}
				}
			});
			
			
		};
		
		function callbackDisplayWork() {
			
			var curProjectIndex = jQuery.inArray($('body').data("curProjectId"), arrayProjects);
			if(curProjectIndex == 0)
			{
				$('.prevProject').attr('id', arrayProjects[arrayProjects.length-1]);
			}
			else
			{
				$('.prevProject').attr('id', arrayProjects[curProjectIndex-1]);
			}
			
			if(curProjectIndex == arrayProjects.length-1)
			{
				$('.nextProject').attr('id', arrayProjects[0]);
			}
			else
			{
				$('.nextProject').attr('id', arrayProjects[curProjectIndex+1]);
			}
			

			$('#projectContent').html('<div id="projectContentImg" class="sexyCycle"><div class="sexyCycle-wrap"><ul class="sexyCycle-content transparent"></ul></div><div id="pagination"><div class="prev"></div><div class="next"></div></div></div>');			
			$('.sexyCycle-content').html($('body').data("stringPhotos"));
			
			$("#projectContentImg").sexyCycle({
				speed:800,
				next: '.next',
				prev: '.prev' 
			});
			
			$('ul.sexyCycle-content').switchClass('transparent', 'opaque', 200);

			$("#projectContentImg").hover(function() { 
				$("#pagination").fadeIn(500);
				
			} , function() { //on hover out...
					$("#pagination").fadeOut(500);
				});
		}
		
		
		// ----------------------------------------------------
		// CLOSE WORK
		
		function closeWorkPannel() {
			$("#projectContentWrapper").hide('blind', 500);
			$("#headerWrapper").show('blind', 500, callbackCloseWork);
		};
		function callbackCloseWork() {
			$('#projectContent').html('');
		}
				
		
		
		// ----------------------------------------------------
		// ABOUT PANEL
		
		$("#taglineLink").click(function() {
			if($("#aboutPanelContent").is(":visible")) {
				$.address.value("");
			}
			else
			{
				$.address.value("about");
			}
		});
		
		
		
		// ----------------------------------------------------
		// GRID/TABLE BUTTONS
			
		$("#gridButton").click(function() { 
			$('html, body').animate({scrollTop:0}, 'slow');
			$("#tableButton").switchClass('activeButton', 'inactiveButton', 500);
			$("#projectsTable").fadeOut(500, function() {
				$("#projectsTable").removeClass('visible', 0);
				$("#projectsTable").addClass('hidden', 0, displayGrid());
			});
		});
		
		function displayGrid() {
			$("#projectsGrid").removeClass('hidden', 0);
			$("#projectsGrid").addClass('visible', 0);
			$("#gridButton").switchClass('inactiveButton', 'activeButton', 500);
			$("#projectsGrid").fadeIn(500);
		};
		
		$("#tableButton").click(function() { 
			$('html, body').animate({scrollTop:0}, 'slow');
			$("#gridButton").switchClass('activeButton', 'inactiveButton', 500);
			$("#projectsGrid").fadeOut(500, function() {
				$("#projectsGrid").removeClass('visible', 0);
				$("#projectsGrid").addClass('hidden', 0, displayTable());
			});
		});
		
		function displayTable() {
			$("#projectsTable").fadeOut(0);
			$("#tableButton").switchClass('inactiveButton', 'activeButton', 500);
			$("#projectsTable").fadeIn(500);
		};
				
		$(".projectGrid_item").hover(function() { 
			
			var thumbOver = $(this).find("img").attr("src"); //Get image url and assign it to 'thumbOver'
		
			//Set a background image(thumbOver) on the <a> tag - Set position to bottom
			$(this).find("a.thumb").css({'background' : 'url(' + thumbOver + ') no-repeat center bottom'});

			//Animate the image to 0 opacity (fade it out)
			$(this).find("span.imgProject").stop().fadeTo('fast', 0 , function() {
				$(this).hide() //Hide the image after fade
			});
			
			
		} , function() { //on hover out...
			//Fade the image to full opacity 
			$(this).find("span.imgProject").stop().fadeTo('fast', 1).show();
		});
		
		$(".projectTable_item").hover(function() { 
			
			var thumbOver2 = $(this).find("img").attr("src"); //Get image url and assign it to 'thumbOver'
		
			//Set a background image(thumbOver) on the <a> tag - Set position to bottom
			$(this).find("span.projectLineImg").css({'background' : 'url(' + thumbOver2 + ') no-repeat center bottom'});

			//Animate the image to 0 opacity (fade it out)
			$(this).find(".imgThumbList").stop().fadeTo('fast', 0 , function() {
				//$(this).hide() //Hide the image after fade
			});
			
			
		} , function() { //on hover out...
			//Fade the image to full opacity 
			$(this).find(".imgThumbList").stop().fadeTo('fast', 1).show();
		});

	});