$(document).ready(function(){

	//global variables = set to defaults...
	/*var currentrow = "#steps";
	var currenttarget = "#steps-image1";*/
	var scrolling = false;
	
	
	
	//PROJECT NAVIGATION - ON ANY PROJECT NAV CLICK...
	$('.processnavlinks a').click(function(){
	
		//check if scrolling currently (if scrolling don't do anything) don't want stacking of events...
		if(!scrolling) {
			
			//get the target from the "rel" of the link clicked. This should be the ID of PORTFOLIO item in the block
			//which means you can add clicks for other project items in the row - not just the first item in the row
			var target = $(this).attr("rel");
			//get position of target
			var loc = $("#"+target).position();
			//set the global currenttarget to the current target (for use in other/future clicks and scrolling scripts)
			currenttarget = "#"+target;
			
			//if we have a location...
			//if not - we're not gonna scroll
			if (loc) {
				
				//set scrolling true so we stop any scrolling
				scrolling = true;
				
				var symbolleft = "";
				// if the location is at 0 we don't need to add a - in front of the location number (left)
				if (loc.left != "0") {
					var symbolleft = "-";
					//take away 200 from the location to move out of the way of the fade.
					loc.left = loc.left-330
				} else {
					//if location IS 0 then we just set the location to 200
					loc.left = 330;	
				}
				
				//time to scroll the portfolio...
				$('#step_images').animate({"left":symbolleft+(loc.left)+"px","top":"44px"}, 900,function(){scrolling = false;});
			
			} //END LOCATION CHECK
			
			//ungrey - grey out next previous links...
					if ($(currenttarget).prev().length) {
						$('#previous').removeClass('grey');
					} else {
						$('#previous').addClass('grey');	
					}

					if ($(currenttarget).next().length) {
						$('#next').removeClass('grey');
					} else {
						$('#next').addClass('grey');	
					}
			
		} //end check for currently scrolling (scrolling == true)

	}); // end project nav clicks




	/**** NEXT PREVIOUS slider **/
	//next previous link...
	$('.nextpreviouslink').click(function() {
		//first check if we're already scrolling from another script...
		if(!scrolling) {
			var nexttarget; //create variable out here so we can use it later...
			
			//is there an element next or previous to the one we're on?
			isThereAnElement = false;
			
			if ($(this).attr("id") == "previous") {
				if ($(currenttarget).prev().length) {
					isThereAnElement = true;
					// store reference to previous element in nexttarget variable
					var nexttarget = $(currenttarget).prev();
				}
			} else if ($(this).attr("id") == "next") {
				if ($(currenttarget).next().length) {
					isThereAnElement = true;
					// store reference to next element in nexttarget variable
					var nexttarget = $(currenttarget).next();
				}
			}
			
			//if there is a next or previous element - lets go...
			if (isThereAnElement) {
							
				//get the location of that previous element
				var loc = nexttarget.position();
				// update global varable current target with the new element
				currenttarget = nexttarget;
				//if we have a location = lets get going.. (if no location - we can't scroll to it)			
				if (loc) {
					
					//set scrolling to true so no other script runs while we're doing this...
					scrolling = true;
					
					var symbolleft = "";
					if (loc.left != "0") {
						//0 doesn't need a - in front of it
						var symbolleft = "-";
						//shift over 200 pixels so we've cleared the fade
						loc.left = loc.left-330
					} else {
						//if we're at 0 then we just need to move it over 200 pixels to clear the fade
						loc.left = 330;	
					}
	
						//same as before: don't do -0px
						//if reusing = might need to also check that loc.top is GREATER than 20...
										
					//ok - lets scroll!
					$('#step_images').animate({"left":symbolleft+(loc.left)+"px","top":"44px"}, 900,function(){scrolling = false;});
					
					//ungrey - grey out next previous links...
					if ($(currenttarget).prev().length) {
						$('#previous').removeClass('grey');
					} else {
						$('#previous').addClass('grey');	
					}

					if ($(currenttarget).next().length) {
						$('#next').removeClass('grey');
					} else {
						$('#next').addClass('grey');	
					}

					
					
				}//end location check
			}//end next/previous element check...
		} //end scrolling check
	}); //end previous slider link click


});