/*==============================================================
Name: Cesar Villanueva Jr.
Class: Portfolio II/Professional Practice for Multimedia
Date: August 16, 2010
Project: CesarInLa.com
Version: 1.2
================================================================
ABOUT:
The scripts contained in this file control all the ajax calls, user interactivity, and
user interface tweaks that are powered via jQuery, MySQL, and PHP.
===============================================================*/

// This resets the current location of the portfolio slider image back to zero. This
// was necessary here because since we are loading our script via $.getScript once
// on the first initial load and after just calling on the function to start each slider
// when the user clicks on the menu the curclick would stay or go forward by one
// from the previous slider show because the script was still in our browsers cache
// I'm not sure if this is the best way to do it, but for now its working. Yay!
var curclicked = 0;

$(document).ready(function() {
	//alert("jQuery is ready to do your bidding");
	
	/* SCROLL  CONTENT SCROLL WRAPPER */
	// Web, Flash, Resume, and Contact button control the scrolling when the
	// user presses a menu button
	$('#webButton').click(function() {
		$('#contentScrollerWrap').animate({
			marginLeft: '-960px'
		}, 700, 'easeInOutExpo');
	});
	$('#flashButton').click(function() {
		$('#contentScrollerWrap').animate({
			marginLeft: '-960px'
		}, 700, 'easeInOutExpo');
	});
	$('#resumeButton').click(function() {
		$('#contentScrollerWrap').animate({
			marginLeft: '0'
		}, 700, 'easeInOutExpo');
	});
	$('#contactButton').click(function() {
		$('#contentScrollerWrap').animate({
			marginLeft: '-1950px'
		}, 700, 'easeInOutExpo');
	});
	
	/*CLOSE BUTTON ABOUT PANEL CLOSE*/
	// Close the resume panel if it is open using the close button
	// This event handler will only trigger after the user clicks on the resume
	// button in the animation
	/*$('#closeResume').click(function() {
		$('#resumeButton').click();
	});*/
	
	/*CLOSE BUTTON ROLLOVER */
	// Add a class of hover when the user hovers over the close button
	// and change the image displayed, when user hovers away it will change
	// back to the previous image by removing the hover class
	/*$('#closeResume').hover(function() {
		$(this).addClass('hover');
	}, function() {
		$(this).removeClass('hover');
	});*/
	
	$.ajaxSetup ({
		cache: true
	});
	
	/* AJAX REQUESTS */
	// Grab the users clicked action and fire the ajax function to get project details
	$('ul.secondLevelNav li').click(function() {

		// Grab the text from the clicked list item
		var projectName = $(this).text();
		
		// Use ajax to send data through post, use the getdetails.php to run the data
		// we sent which we are calling clickedLItem, and upon success select the
		// #projectDetails div and add/display data
		$.ajax({
			type: 'post',
			url: 'php/getdetails.php',
			data: 'clickedListItem=' + projectName,
			beforeSend: function() {
				// Fade out and remove all the portfolio images and text
				//alert("Content being removed...");
				$('#ajaxContent').fadeOut('slow', function() {
					$(this).remove();
				});
				// Add loading cubes animation
				$('<div>Loading portfolio...</div>')
					.attr('class', 'loadingCubes')
					.hide()
					.prependTo('#projectDetails')
					.fadeTo('slow', 1);
			},
			success: function(data) { 
				// Grab the received content set it and hide it immediately
				$('#ajaxContainer').html(data).hide().fadeTo('slow', 1);
			},
			complete: function() { 
				//$.getScript("js/portfolioslider.js", function() {startSlider()});
				startSlider(curclicked);
				// Fade out and remove loading cubes animation
				$('.loadingCubes').fadeOut('slow', function() {
					$(this).remove();
				});
				checkSampleCode();
			}
		}); // Ajax for loading portolios end
	});
	
	// Load first project on page load via AJAX
	loadFirstProject();
	//checkSampleCode();
	highlightMenuItem();
});

// Load the first portfolio project found in the web category top list
function loadFirstProject() {
	// When I make the whole index page into a php page I will need this in order
	// to get the first menu item, this will be helpful when I make the menus dynamic,
	// being created with the information fromt the database
	var loadProject = $('.secondLevelNav li:first').text();
	//alert("This portfolio will be loaded first: " + loadProject);

	$.ajax({
		type: 'post',
		url: 'php/getdetails.php',
		data: 'clickedListItem=' + loadProject,
		success: function(data) { $('#ajaxContent').html(data); },
		complete: function() { $.getScript("js/portfolioslider.js", function(){startSlider(curclicked)}),
		checkSampleCode();
		$('#navigation ul.secondLevelNav li:first').addClass('highlighter');
		}
	});
}

// Determine whether the selected project has a sample code link
/*NOTEs*/
// I initially had major issues with getting the href from the targeted
// link because I was calling this function before the ajax call could finish
// but once I removed the call to the complete action of the ajax setup
// the link was getting grabbed because jquery had html to traverse
function checkSampleCode() {
	// Target our selected sample code
	var targetCode = $('#aTest').attr('href');
	//alert(targetCode);
	if (targetCode == "#") {
		$('p.sampleCode').css('display', 'none');
		//alert("Remove sample code links...");
	}
}

// Removes and adds the highlight for the menu corresponding to the clicked/loaded portfolio project
function highlightMenuItem() {
	$('#navigation ul.secondLevelNav li').click(function() {
		// On click find the first matched list item that has the highlighter class
		var highlightLink = $(this).find('ul li:first').hasClass('highlighter');
		
		// Remove the highlighter class if the clicked item doesn't match the first
		// list item element with the class of highlighter. It basically removes all
		// the secondLevelNav li that it finds
		if(!highlightLink) {
			$('#navigation ul.secondLevelNav').find('li').removeClass('highlighter');
			//alert("Remove highlighter...");
		}
		// Add class highlighter to the selected list item
		$(this).addClass('highlighter');
	});
}