var headerScrollToCurrentIndex = 0;

var headerScrollToSectionSize = 0;

// initial setting variable DO NOT REMOVE
var slideShowIndex;
var animateImage;
var imageSize;
var originalImageIndex = new Array();
var originalImageGroupName = new Array();
var imageGroupExists = false;
var imageGroupingDelimiter = '_';
/* This variable is used to specify the default top position the images travel upward when the animation takes place.
	- If the variable is set to 0, then the image height, in pixels, is used for the top ending position. I.e if the height of the
	  image is 200px, then the image travels 200px upward 
	- This variable works in negatives. The greater the negative number the higher the image goes. For example, -200 will send the
	  image 200px upward. */
var imageAnimationStop_Top = 300; 
/* This variable is used to specify the default left position the images travel to the right when the animation takes place.
	- If the variable is set to 0, then the image width, in pixels, is used for the right ending position. I.e if the width of the
	  image is 200px, then the image travels 200px to the right
	- This variable works in positives. The greater the positive number the further to the right the image will move. For example, 200 will send the
	  image 200px to the right. */
var imageAnimationStop_Right = 600;
/* controls the speed of the entire flip animation */
var imageAnimationSpeed = 200;
/* This controls the color of the highlight background color of the current image number (1 2 3) in the group link section */
var groupCurrentImageLinkHightlightBackgroundColor = '#616D7E';
/* This controls the color of the highlight color of the font of the current image (1 2 3) in the group link section */
var groupCurrentImageLinkHightlightFontColor = '#FFFFFF';
/* the directory where the image, from the include file, are located */
var imageDir = 'images/';  
var originalImageOffset;
var originalImageOffsetLeft;
var originalImageOffsetTop;
var fullOffset = new Array();
$(function()
{
	var footer_height = $("#footer").height();
	var footer_bottom = $("#footer").css("bottom");
	footer_bottom = footer_bottom.replace("px", "");
	footer_bottom = parseInt(footer_bottom);
	var footer_bottom_NEW = -(footer_height-footer_bottom);
	var visibleFooter_height = footer_height+footer_bottom_NEW;
	// This value is the amount of height that needs to be applied to the easing animation so that the footer doesn't expose the background
	var footerEasingAdjustment = 300;
	$('#footer').css(

	{
		bottom: footer_bottom_NEW-footerEasingAdjustment,
		height: footer_height+footerEasingAdjustment
	});
	if($('body').children().attr('id') == 'imageSlideShowHiddenContainer')
	{
		initImageFlipSlideShow();	
	}
	/************************************************************
		initial scripts
	************************************************************/
	// pulls in all of the external data into the header and main content areas
	ajaxCalls();
	// This value lets you set the extended distance that the headerDropDownContainer will go past the original height of the headerContainer.
	// For instance, if the headerDropDownContainer is 300px tall, and the header container is only 240px tall, then the headerDropDownContainer
	// will only open to 240px. 
	var headerDropDownContainer_extendedDropDownDistance = 30;
	var navtainer_width = $("#navtainer").width();
	var header_width = $("#header").width();
	var header_height = $("#header").height();
		var header_offset = $("#header").offset();
	var header_offsetTop = header_offset.top;
	var header_offsetLeft = header_offset.left;
	var headerDropDownContainer_height = $("#headerDropDownContainer").height();
	var headerDropDownContainer_width = $("#headerDropDownContainer").width();
	var headerDropDownTab_height = $("#headerDropDownTab").height();
	var headerStatusImage_width = $("#headerStatusImage").width();
		var headerDropDownContainer_PositionShowingBottom = $("#headerDropDownContainer").css('bottom');
	headerDropDownContainer_PositionShowingBottom = headerDropDownContainer_PositionShowingBottom.replace('px', '');
	headerDropDownContainer_PositionShowingBottom = parseInt(headerDropDownContainer_PositionShowingBottom);
		$("#headerDropDownContainer").css('bottom', 0);
	// styling for the navtainer div
	$("#navtainer").css(
	{
		marginTop: visibleFooter_height,
		marginBottom: visibleFooter_height,
		left: "50%",
		marginLeft: -navtainer_width/2
	});
	$('#headerStatusImage').attr('class', 'closed');
/*************************************************************************
		Styling for the headerDropDownContainer
*************************************************************************/
	/*************************************************************************
			If the below code is uncommented the headerDropDownContainer
			will be "Centered" with the header container
	*************************************************************************/
	// styling for the headerDropDownContainer div
	$("#headerDropDownContainer").css(
	{
		top: -headerDropDownContainer_height+header_height+headerDropDownContainer_PositionShowingBottom,
		left: '50%',
		marginLeft: -headerDropDownContainer_width/2
	});
	/*************************************************************************
			If the below code is uncommented the headerDropDownContainer
			will be position "Left", and offset by the amount of
			pixels specified by "headerDropDownContainer_offSetLeft",
			with the header container
	*************************************************************************/
	// styling for the headerDropDownContainer div
	// This is the amount of the pixels you want the headerDropDownContainer positioned from the left
	//var headerDropDownContainer_offSetLeft = 30;
//	
//	$("#headerDropDownContainer").css(
//	{
//		top: -headerDropDownContainer_height+header_height+header_height+headerDropDownContainer_PositionShowingBottom,
//		left: header_offsetLeft+headerDropDownContainer_offSetLeft
//	});
//	
//	$(window).bind('resize', function()
//	{
//		header_offset = $("#header").offset();
//		header_offsetLeft = header_offset.left;
//		
//		$("#headerDropDownContainer").css(
//		{
//			top: -headerDropDownContainer_height+header_height,
//			left: header_offsetLeft+headerDropDownContainer_offSetLeft
//		});
//	});
/******************************************************************/
	// styling for the headerDropDownTab div "Close/Open" button for the headerDropDownContainer
	$("#headerDropDownTab").css(
	{
		//bottom: -headerDropDownTab_height
		bottom: 0
	});
/************************************************************
	header dropdown container scripts
************************************************************/
	// this is where you can change the easing method.
	var headerEasingMethod = 'easeOutElastic';
	// this changes the speed of the delay in the headerStatusImage replace, the higher the number the longer the delay
	// ex: 1000 is 1 second. 800 is .8 seconds
	var headerStatusImageChange_Speed_open = 0;
	var headerStatusImageChange_Speed_close = 100;
	// this changes the speed of the delay in the headerDropDownTab replace, the higher the number the longer the delay
	// ex: 1000 is 1 second. 800 is .8 seconds
	var headerDropDownTabImageChange_Speed_open = 100;
	var headerDropDownTabImageChange_Speed_close = 100;
	$("#headerDropDownTab").click(function()
	{
		// opens the headerDropDownContainer
		if($("#headerDropDownTab").is(".tabClosed"))
		{
			$('#imageSlideShow').css('zIndex', 0)
			// removes the class 'closed' and adds the class 'active' for its switch from off to on state
			setTimeout('headerStatusImageChange("active", "closed")', headerStatusImageChange_Speed_open);
			// removes the class 'closed' and adds the class 'active' for its switch from off to on state
			setTimeout('headerDropDownTabImageChange("tabOpen", "tabClosed")', headerDropDownTabImageChange_Speed_open);
			$("#headerDropDownContainer").animate(
			{
				top: header_height+headerDropDownContainer_extendedDropDownDistance
			}, 1000, headerEasingMethod, function()
			{
				if(headerStatusImageChange_Speed_open == 0)
				{
					headerStatusImageChange("active", "closed");
				}
			});
		}
		// closes the headerDropDownContainer
		else
		{
			// removes the class 'active' and adds the class 'closed' for its switch from on to off state
			setTimeout('headerStatusImageChange("closed", "active")', headerStatusImageChange_Speed_close);
			// removes the class 'closed' and adds the class 'active' for its switch from off to on state
			setTimeout('headerDropDownTabImageChange("tabClosed", "tabOpen")', headerDropDownTabImageChange_Speed_close);
			$("#headerDropDownContainer").animate(
			{
				top: -headerDropDownContainer_height+header_height+headerDropDownContainer_PositionShowingBottom
			}, 80, function()
			{
				$('#imageSlideShow').css('zIndex', 100);
				if(headerStatusImageChange_Speed_close == 0)
				{
					headerStatusImageChange("closed", "active");
				}
			});
		}
	});
/************************************************************
	header dropdown container scrollTo functionality
************************************************************/
	$('#screen .prev').click(function()
	{
		headerContentScroll('prev');
	});
	$('#screen .next').click(function()
	{
		headerContentScroll('next');
	});
/************************************************************
	Main Content - ScrollTo Functionality
************************************************************/
	$('.mainContentNavIndex').click(function()
	{
		var index = $("#mainContentNav a").index(this);
		var element = $("#mainExpandDiv .content").eq(index);
		// scrollTo functionality
		$("#mainContentDisplay").stop().scrollTo(element, 500, {axis:'xy'});
	});
/************************************************************
	Main Content Children - NEXT - ScrollTo Functionality
************************************************************/
	$('.moreContentNext').click(function()
	{
		var element = $(this).parents().filter('div').next('div');
		// scrollTo functionality
		$("#mainContentDisplay").stop().scrollTo(element, 500, {axis:'xy'});
	});
/************************************************************
	Main Content Children - PREV - ScrollTo Functionality
************************************************************/
	$('.moreContentPrev').click(function()
	{
		var element = $(this).parents().filter('div').prev('div');
		// scrollTo functionality
		$("#mainContentDisplay").stop().scrollTo(element, 500, {axis:'xy'});
});
/************************************************************
	footer dropdown container scripts
************************************************************/
	// opens footer div
	$("#openFooterDiv").click(function()
	{
		$("#footer").animate(
		{
			bottom: -footerEasingAdjustment
		}, 1000, 'easeOutElastic');
	});
	// closes footer div
	$("#closeFooterDropOut").click(function()
	{
		$("#footer").animate(
		{
			bottom: footer_bottom_NEW-footerEasingAdjustment
		}, 200);
	});
/************************************************************
	image flip slideShow (prev and next) events scripts
************************************************************/
	$('#prev').click(function()
	{
		slideShow('prev');
	});
	$('#next').click(function()
	{
		slideShow('next');
	});
/*************************************************************
	sliding effect script
*************************************************************/
	//syntax for slide settings:1st position is motion distance to the right - 2nd position is left margin (must match CSS) - 3rd position is text load speed at page load - 4th position is settling back speed for original position
	//slide("#sliding-navigation", 25, 15, 150, .8);
	//slide("#slidenavtop", 25, 27, 150, 1.1);
	slide("#slidenav1", 36, 26, 150, .8); 
	slide("#slidenav2", 36, 26, 150, .5);
	slide("#slidenav3", 36, 26, 150, .7);
	slide("#slidenav4", 36, 26, 150, .8);
	slide("#slidenav5", 36, 26, 150, 1.2);
/****************************************************************
	initialize tool tip script
****************************************************************/
	initToolTip();
});
function headerStatusImageChange(changeTo, changeFrom)
{
		$("#headerStatusImage").removeClass(changeFrom);
		$("#headerStatusImage").addClass(changeTo);
}
function headerDropDownTabImageChange(changeTo, changeFrom)
{
		$("#headerDropDownTab").removeClass(changeFrom);
		$("#headerDropDownTab").addClass(changeTo);
}
// function that pulls in all of the header and main content from seperate html files
function ajaxCalls()
{
	$.get("/includes/headerContent.html", function(dataHeader)
	{
		$("#innerHeaderContentDisplay").html(dataHeader) 
		headerContentScroll();
		var url = document.location;
		url = url.toString();
		var urlResult = url.split("?");
		if(urlResult[1])
		{	
			var deepLink = urlResult[1].split("=");
			var deepLinkingVariable = deepLink[0];
			var deepLinkingIndex = deepLink[1]-1;
			if(deepLinkingVariable == 'deepLinkingIndex')
			{
				$("#mainContentDisplay").stop().scrollTo('.content:eq('+ deepLinkingIndex +')', 200, {axis:'xy'}); //reset all scrollable panes to (0,0)
			}
			else
			{
				$("#mainContentDisplay").stop().scrollTo('.content:eq(0)', 200, {axis:'xy'}); //reset all scrollable panes to (0,0)
			}
		}
		else
		{
			$("#mainContentDisplay").stop().scrollTo('.content:eq(0)', 200, {axis:'xy'}); //reset all scrollable panes to (0,0)
		}
		// gets the number of elements in the innerHeaderContentDisplay div once the data is inserted in the div using ajax
		headerScrollToSectionSize = $('#innerHeaderContentDisplay').children('.headerContent').size();
		// calls the function and passes the initial text so that the header scrollTo content starts a 0
		headerContentScroll('initial');
	});
}
// function that controls the header drop down containers content area scroll functionality
function headerContentScroll(status)
{
	// on initial load sets the headerScrollToCurrentIndex value to 0
	if(status == 'initial')
	{
		headerScrollToCurrentIndex = 0;
	}
	// when the 'prev' button is clicked then the headerScrollToCurrentIndex value is incremented by 1
	if(status == 'prev')
	{
		headerScrollToCurrentIndex = headerScrollToCurrentIndex-1;	
	}
	// when the 'next' button is clicked then the headerScrollToCurrentIndex value is decremented by 1
	if(status == 'next')
	{
		headerScrollToCurrentIndex = headerScrollToCurrentIndex+1;	
	}
	// checks if the user clicks the previous button when they are one the first element. If so this sets the index back to 0
	if(headerScrollToCurrentIndex == -1)
	{
		headerScrollToCurrentIndex = 0;
	}
// THIS MUST BE UPDATED FOR EVERY CHANGE!
	// checks if the user clicks the next button if there are no other items in the list. If so this sets the index back to 0
	if(headerScrollToCurrentIndex >= headerScrollToSectionSize)
	{
		headerScrollToCurrentIndex = 0;	
	}
	// scrolls to the appropriate element dependant on the button the user selects
	$("#headerContentDisplay").stop().scrollTo('.headerContent:eq('+ headerScrollToCurrentIndex +')', 200, {axis:'xy'});
}
/**********************************************************************
	initImageFlipSlideShow function
**********************************************************************/
function initImageFlipSlideShow()
{
	originalImageOffset = $('#imageSlideShow').offset();
	originalImageOffsetLeft = originalImageOffset.left;
	originalImageOffsetTop = originalImageOffset.top;
	originalImageOffsetLeft = parseInt(originalImageOffsetLeft);
	originalImageOffsetTop = parseInt(originalImageOffsetTop);
	$.get("includes/imageContent.html", function(imageData)
	{
  		$('#imageSlideShowHiddenContainer').html(imageData);
		imageSize = $('#imageSlideShowHiddenContainer').children('.image').size();
		var imageStructure;
		for(var i = 0; i < imageSize; i++)
		{
			var imageName = $('#imageSlideShowHiddenContainer').children('.image').eq(i).text();
			var imageDescriptionText = $('#imageSlideShowHiddenContainer').children('.image').eq(i).attr('description');
			var imageHeight = $('#imageSlideShowHiddenContainer').children('.image').eq(i).attr('height');
			var imageWidth = $('#imageSlideShowHiddenContainer').children('.image').eq(i).attr('width');
			var fullImagePath = imageDir+imageName
			imageHeight = parseInt(imageHeight);
			imageWidth = parseInt(imageWidth);
			imageStructure = "<img src='"+imageDir+imageName+"' description='"+imageDescriptionText+"' imageHeight='"+imageHeight+"' imageWidth='"+imageWidth+"'/>";
			$('#imageSlideShowHiddenContainer').append(imageStructure);
		}
		$('#imageSlideShowHiddenContainer .image').remove();
		$('#imageSlideShow').css(
		{
			zIndex: 100,
			position: 'absolute'
		});
		initSlideShow();
	});	
}
function initSlideShow()
{
	var currentImage;
	var removeImageGroupingIndex;
	var imageGroupName;
	for(var a = 0; a < imageSize; a++)
	{
		currentImage = $('#imageSlideShowHiddenContainer').children('img').eq(a).attr('src');
		var imageNameSize = currentImage.length;
		currentImage = currentImage.replace(imageDir, '');
		var imageNameWithoutExtension = currentImage.lastIndexOf('.');
		currentImage = currentImage.substring(0, imageNameWithoutExtension);
		removeImageGroupingIndex = currentImage.indexOf(imageGroupingDelimiter);
		imageGroupName = currentImage.substring(0, removeImageGroupingIndex);
		if(originalImageGroupName.length == 0)
		{
			originalImageGroupName.push(imageGroupName);
			originalImageIndex.push(a);
		}
		else
		{
			for(var c = 0; c < originalImageGroupName.length; c++)
			{
				var arrayGroupImageName = originalImageGroupName[c];
				if(imageGroupName == arrayGroupImageName)
				{
					imageGroupExists = true
				}
			}
			if(imageGroupExists == false)
			{

				originalImageGroupName.push(imageGroupName);

				originalImageIndex.push(a);

			}

			

			imageGroupExists = false;

		}

	}

	var initialImage = $('#imageSlideShowHiddenContainer').children('img').eq(0).attr('src');

	var initialImageDescriptionText = $('#imageSlideShowHiddenContainer').children('img').eq(0).attr('description');

	$('#imageSlideShow').attr('src', initialImage);

	animateImage = "<img id='newImage' src='' />";

	var imageSlideShowParentContainer = $('#imageSlideShow').parent().filter('div').attr('id');

	//alert(imageSlideShowParentContainer);

	$('#'+imageSlideShowParentContainer).append(animateImage);

	slideShowIndex = 0;

	$('#newImage').hide();

	writeImageDescription(initialImageDescriptionText);

}



function slideShow(status)

{	

	$('#newImage').show();

	if(status == 'next')

	{

		slideShowIndex++;	

	}

	if(status == 'prev')

	{

		slideShowIndex--;	

	}

	if(slideShowIndex >= originalImageIndex.length)

	{

		slideShowIndex = 0;	

	}

	if(slideShowIndex < 0)

	{

		slideShowIndex = originalImageIndex.length-1;	

	}

	var imageIndex = originalImageIndex[slideShowIndex];

	var imageName = $('#imageSlideShowHiddenContainer').children('img').eq(imageIndex).attr('src');

	var imageDescriptionText = $('#imageSlideShowHiddenContainer').children('img').eq(imageIndex).attr('description');

	var imageHeight = $('#imageSlideShowHiddenContainer').children('img').eq(imageIndex).attr('imageHeight');

	var imageWidth = $('#imageSlideShowHiddenContainer').children('img').eq(imageIndex).attr('imageWidth');

	$('#newImage').attr('src', imageName);

	//fullOffset = findOffset('imageSlideShow');

	if(imageAnimationStop_Top == 0 && imageAnimationStop_Right == 0)

	{

		imageAnimationStop_Right = imageWidth;

		imageAnimationStop_Top = -imageHeight;

	}

	imageAnimationStop_Right = parseInt(imageAnimationStop_Right);

	imageAnimationStop_Top = parseInt(imageAnimationStop_Top);

	if(status == 'next')

	{

		$('#newImage').css(

		{

			position: 'absolute',

			left: 0,

			top: 0,

			zIndex: 50

		});

		

		$('#imageSlideShow').stop('true', 'true').animate(

		{

			left: imageAnimationStop_Right,

			top: imageAnimationStop_Top

		}, imageAnimationSpeed, function()

		{

			$('#newImage').css(

			{

				zIndex: 200

			});

			

			$('#imageSlideShow').animate(

			{

				left: 0,

				top: 0

			}, imageAnimationSpeed, function()

			{

				

				var changeImage = $('#newImage').attr('src');

				$('#imageSlideShow').attr('src', changeImage);

				

			});

		});

	}

	if(status == 'prev')

	{

		$('#newImage').css(

		{

			position: 'absolute',

			left: 0,

			top: 0,

			zIndex: 50

		});

		

		$('#newImage').stop('true', 'true').animate(

		{

			//left: originalImageOffsetLeft+imageAnimationStop_Right,

			//top: originalImageOffsetTop+imageAnimationStop_Top,

			left: imageAnimationStop_Right,

			top: imageAnimationStop_Top

		}, imageAnimationSpeed, function()

		{

			$('#newImage').css(

			{

				zIndex: 200

			});

			

			$('#newImage').animate(

			{

				//left: originalImageOffsetLeft,

				//top: originalImageOffsetTop,

				left: 0,

				top: 0

			}, imageAnimationSpeed, function()

			{

				$('#newImage').css(

				{

					zIndex: 50

				});

				

				var changeImage = $('#newImage').attr('src');

				$('#imageSlideShow').attr('src', changeImage);

				

			});

		});

	}

	writeImageDescription(imageDescriptionText);

}



function slideShowGroup(imageName)

{	

	imageName = imageName.replace(imageDir, '');

	var imageSelectedIndex = 0;

	$('#newImage').show();

	for(var t = 0; t < imageSize; t++)

	{

		var imageFileName = $('#imageSlideShowHiddenContainer').children('img').eq(t).attr('src');

		

		if(imageFileName.match(imageName))

		{

			imageSelectedIndex = t;	

		}

	}



	if((slideShowIndex != imageSelectedIndex) || (slideShowIndex == 0 && imageSelectedIndex == 0))

	{		

		var imageName = $('#imageSlideShowHiddenContainer').children('img').eq(imageSelectedIndex).attr('src');

		var imageDescriptionText = $('#imageSlideShowHiddenContainer').children('img').eq(imageSelectedIndex).attr('description');

		var imageHeight = $('#imageSlideShowHiddenContainer').children('img').eq(imageSelectedIndex).attr('height');

		var imageWidth = $('#imageSlideShowHiddenContainer').children('img').eq(imageSelectedIndex).attr('width');



		$('#imageSlideShow').attr('src', imageName);

		$('#imageSlideShow').css('zIndex', '200');

		$('#newImage').css('zIndex', '100');

		$('#newImage').attr('src', '');

		

		writeImageDescription(imageDescriptionText);

	}

}



function findOffset(id)

{

	var parentCount = $('#'+id).parents('div').size();

	var objOffset;

	var totalOffsetLeft = 0;

	var totalOffsetTop = 0;

	var totalOffset = new Array();

	for(var i = 0; i < parentCount; i++)

	{

		parent = $('#'+id).parents('div:eq('+i+')').attr('id');

		

		objOffset = $('#'+parent).attr('id', parent).offset();

		

		totalOffsetLeft += objOffset.left;

		totalOffsetTop += objOffset.top;

	}

	totalOffset.push(totalOffsetLeft);

	totalOffset.push(totalOffsetTop);

	return totalOffset;

}



function writeImageDescription(text)

{

	var imageGroupName = '';

	var imageNumber = '';

	var imageGroupList = new Array();

	$('#imageDescription').html(text+'<br/>');

	if($('#newImage').attr('src'))

	{

		var currentImage = $('#newImage').attr('src');

	}

	else

	{

		var currentImage = $('#imageSlideShow').attr('src');	

	}

	currentImageFullName = currentImage;

	currentImage = currentImage.split('.');

	currentImage = currentImage[0];

	currentImage = currentImage.replace(imageDir, '');

	var imageGroupNameLength = currentImage.lastIndexOf(imageGroupingDelimiter);

	currentImage = currentImage.substring(0, imageGroupNameLength);

	imageGroupName = currentImage;

	for(var u = 0; u < imageSize; u++)

	{

		var imageName = $('#imageSlideShowHiddenContainer').children('img').eq(u).attr('src');

		imageName = imageName.split('.');

		imageName = imageName[0];

		imageName = imageName.replace(imageDir, '');

		

		var imageNameLength = imageName.lastIndexOf(imageGroupingDelimiter);

		imageName = imageName.substring(0, imageGroupNameLength);

		

		if(imageGroupName == imageName)

		{

			imageGroupList.push(u);

		}

	}

	for(var t = 0; t < imageGroupList.length; t++)

	{

		var imageIndex = imageGroupList[t];	

		var onClickFunction = "javascript:slideShow('next');";

		

		var imageSetName = $('#imageSlideShowHiddenContainer').children('img').eq(imageIndex).attr('src');

		var onClickFunction = "javascript:slideShowGroup('"+imageSetName+"');";

		

		var anchorObj = $("<a></a>").attr('class', 'imageGroup').attr('onclick', onClickFunction).attr('target', '_blank').html(t+1);

		

		$('#imageDescription').append(anchorObj);

	}

	hightlightGroupLink(currentImageFullName);

}



function hightlightGroupLink(currentImage)

{	

	var imageGroupLinkSize = $('#imageDescription').children('a').size();

	for(var a = 0; a < imageGroupLinkSize; a++)

	{

		imageGroupCurrentShownImage = $('#imageDescription').children('a').eq(a).attr('onclick');

		imageGroupCurrentShownImage = imageGroupCurrentShownImage.toString();



		if(imageGroupCurrentShownImage.match(currentImage))

		{

			imageGroupCurrentShownImage = $('#imageDescription').children('a').eq(a).css(

			{

				backgroundColor: groupCurrentImageLinkHightlightBackgroundColor,

				color: groupCurrentImageLinkHightlightFontColor

			});

		}

	}

}



// Sliding Effect - slide() function

function slide(navigation_id, pad_out, pad_in, time, multiplier)

{

	// creates the target paths

	var list_elements = navigation_id + " li.sliding-element";

	var link_elements = list_elements + " a";

	// initiates the timer used for the sliding animation

	var timer = 0;

	// creates the slide animation for all list elements 

	$(list_elements).each(function(i)

	{

		// margin left = - ([width of element] + [total vertical padding of element])

		$(this).css("margin-left","-480px"); //start position for loading animation

		// updates timer

		timer = (timer*multiplier + time);

		$(this).animate({ marginLeft: "0" }, timer);

		$(this).animate({ marginLeft: "15px" }, timer); //amount of sideways jiggle

		$(this).animate({ marginLeft: "0" }, timer);

	});



	// creates the hover-slide effect for all link elements 		

	$(link_elements).each(function(i)

	{

		$(this).hover(

		function()

		{

			$(this).animate({ paddingLeft: pad_out }, 150); //rollover right speed

		},		

		function()

		{

			$(this).animate({ paddingLeft: pad_in }, 150); //rollover left speed

		});

	});

}



function initToolTip()

{

	var $cluetip, $cluetipInner, $cluetipOuter, $cluetipTitle, $cluetipArrows, $dropShadow, imgCount;

  $.fn.cluetip = function(js, options) {

    if (typeof js == 'object') {

      options = js;

      js = null;

    }

    return this.each(function(index) {

      var $this = $(this);      

      

      // support metadata plugin (v1.0 and 2.0)

      var opts = $.extend(true, {}, $.fn.cluetip.defaults, options || {}, $.metadata ? $this.metadata() : $.meta ? $this.data() : {});



      // start out with no contents (for ajax activation)

      var cluetipContents = false;

      var cluezIndex = parseInt(opts.cluezIndex, 10)-1;

      var isActive = false, closeOnDelay = 0;



      // create the cluetip divs

      if (!$('#cluetip').length) {

        $cluetipInner = $('<div id="cluetip-inner"></div>');

        $cluetipTitle = $('<h3 id="cluetip-title"></h3>');        

        $cluetipOuter = $('<div id="cluetip-outer"></div>').append($cluetipInner).prepend($cluetipTitle);

        $cluetip = $('<div id="cluetip"></div>').css({zIndex: opts.cluezIndex})

        .append($cluetipOuter).append('<div id="cluetip-extra"></div>')[insertionType](insertionElement).hide();

        $('<div id="cluetip-waitimage"></div>').css({position: 'absolute', zIndex: cluezIndex-1})

        .insertBefore('#cluetip').hide();

        $cluetip.css({position: 'absolute', zIndex: cluezIndex});

        $cluetipOuter.css({position: 'relative', zIndex: cluezIndex+1});

        $cluetipArrows = $('<div id="cluetip-arrows" class="cluetip-arrows"></div>').css({zIndex: cluezIndex+1}).appendTo('#cluetip');

      }

      var dropShadowSteps = (opts.dropShadow) ? +opts.dropShadowSteps : 0;

      if (!$dropShadow) {

        $dropShadow = $([]);

        for (var i=0; i < dropShadowSteps; i++) {

          $dropShadow = $dropShadow.add($('<div></div>').css({zIndex: cluezIndex-i-1, opacity:.1, top: 1+i, left: 1+i}));

        };

        $dropShadow.css({position: 'absolute', backgroundColor: '#000'})

        .prependTo($cluetip);

      }

      var tipAttribute = $this.attr(opts.attribute), ctClass = opts.cluetipClass;

      if (!tipAttribute && !opts.splitTitle && !js) return true;

      // if hideLocal is set to true, on DOM ready hide the local content that will be displayed in the clueTip

      if (opts.local && opts.localPrefix) {tipAttribute = opts.localPrefix + tipAttribute;}

      if (opts.local && opts.hideLocal) { $(tipAttribute + ':first').hide(); }

      var tOffset = parseInt(opts.topOffset, 10), lOffset = parseInt(opts.leftOffset, 10);

      // vertical measurement variables

      var tipHeight, wHeight;

      var defHeight = isNaN(parseInt(opts.height, 10)) ? 'auto' : (/\D/g).test(opts.height) ? opts.height : opts.height + 'px';

      var sTop, linkTop, posY, tipY, mouseY, baseline;

      // horizontal measurement variables

      var tipInnerWidth = isNaN(parseInt(opts.width, 10)) ? 275 : parseInt(opts.width, 10);

      var tipWidth = tipInnerWidth + (parseInt($cluetip.css('paddingLeft'),10)||0) + (parseInt($cluetip.css('paddingRight'),10)||0) + dropShadowSteps;

      var linkWidth = this.offsetWidth;

      var linkLeft, posX, tipX, mouseX, winWidth;

            

      // parse the title

      var tipParts;

      var tipTitle = (opts.attribute != 'title') ? $this.attr(opts.titleAttribute) : '';

      if (opts.splitTitle) {

        if(tipTitle == undefined) {tipTitle = '';}

        tipParts = tipTitle.split(opts.splitTitle);

        tipTitle = tipParts.shift();

      }

      if (opts.escapeTitle) {

        tipTitle = tipTitle.replace(/&/g,'&amp;').replace(/>/g,'&gt;').replace(/</g,'&lt;');

      }

      

      var localContent;



/***************************************      

* ACTIVATION

****************************************/

    

//activate clueTip

    var activate = function(event) {

      if (!opts.onActivate($this)) {

        return false;

      }

      isActive = true;

      $cluetip.removeClass().css({width: tipInnerWidth});

      if (tipAttribute == $this.attr('href')) {

        $this.css('cursor', opts.cursor);

      }

      $this.attr('title','');

      if (opts.hoverClass) {

        $this.addClass(opts.hoverClass);

      }

      linkTop = posY = $this.offset().top;

      linkLeft = $this.offset().left;

      mouseX = event.pageX;

      mouseY = event.pageY;

      if ($this[0].tagName.toLowerCase() != 'area') {

        sTop = $(document).scrollTop();

        winWidth = $(window).width();

      }

// position clueTip horizontally

      if (opts.positionBy == 'fixed') {

        posX = linkWidth + linkLeft + lOffset;

        $cluetip.css({left: posX});

      } else {

        posX = (linkWidth > linkLeft && linkLeft > tipWidth)

          || linkLeft + linkWidth + tipWidth + lOffset > winWidth 

          ? linkLeft - tipWidth - lOffset 

          : linkWidth + linkLeft + lOffset;

        if ($this[0].tagName.toLowerCase() == 'area' || opts.positionBy == 'mouse' || linkWidth + tipWidth > winWidth) { // position by mouse

          if (mouseX + 20 + tipWidth > winWidth) {  

            $cluetip.addClass(' cluetip-' + ctClass);

            posX = (mouseX - tipWidth - lOffset) >= 0 ? mouseX - tipWidth - lOffset - parseInt($cluetip.css('marginLeft'),10) + parseInt($cluetipInner.css('marginRight'),10) :  mouseX - (tipWidth/2);

          } else {

            posX = mouseX + lOffset;

          }

        }

        var pY = posX < 0 ? event.pageY + tOffset : event.pageY;

        $cluetip.css({left: (posX > 0 && opts.positionBy != 'bottomTop') ? posX : (mouseX + (tipWidth/2) > winWidth) ? winWidth/2 - tipWidth/2 : Math.max(mouseX - (tipWidth/2),0)});

      }

        wHeight = $(window).height();



/***************************************

* load a string from cluetip method's first argument

***************************************/

      if (js) {

        if (typeof js == 'function') {

          js = js($this[0]);

        }

        $cluetipInner.html(js);

        cluetipShow(pY);

      }

/***************************************

* load the title attribute only (or user-selected attribute). 

* clueTip title is the string before the first delimiter

* subsequent delimiters place clueTip body text on separate lines

***************************************/



      else if (tipParts) {

        var tpl = tipParts.length;

        $cluetipInner.empty();

        for (var i=0; i < tpl; i++){

          if (i == 0) {

            $cluetipInner.html(tipParts[i]);

          } else { 

            $cluetipInner.append('<div class="split-body">' + tipParts[i] + '</div>');

          }            

        };

        cluetipShow(pY);

      }

/***************************************

* load external file via ajax          

***************************************/

      else if (!opts.local && tipAttribute.indexOf('#') != 0) {

        if (/\.(jpe?g|tiff?|gif|png)$/i.test(tipAttribute)) {

          $cluetipInner.html('<img src="' + tipAttribute + '" alt="' + tipTitle + '" />');

          cluetipShow(pY);

        } else if (cluetipContents && opts.ajaxCache) {

          $cluetipInner.html(cluetipContents);

          cluetipShow(pY);

        } else {

          var ajaxSettings = opts.ajaxSettings;

          ajaxSettings.cache = false; // force requested page not to be cached by browser

          ajaxSettings.url = tipAttribute;

          ajaxSettings.beforeSend = function() {

            $cluetipOuter.children().empty();

            if (opts.waitImage) {

              $('#cluetip-waitimage')

              .css({top: mouseY+20, left: mouseX+20})

              .show();

            }

          };

         ajaxSettings.error = function() {

            if (isActive) {

              $cluetipInner.html('<i>sorry, the contents could not be loaded</i>');

            }

          };

          ajaxSettings.success = function(data) {

            cluetipContents = opts.ajaxProcess(data);

            if (isActive) {

              $cluetipInner.html(cluetipContents);

            }

          };

          ajaxSettings.complete = function() {

            imgCount = $('#cluetip-inner img').length;

            if (imgCount && !$.browser.opera) {

              $('#cluetip-inner img').load(function() {

                imgCount--;

                if (imgCount<1) {

                  $('#cluetip-waitimage').hide();

                  if (isActive) cluetipShow(pY);

                }

              }); 

            } else {

              $('#cluetip-waitimage').hide();

              if (isActive) cluetipShow(pY);    

            } 

          };

          $.ajax(ajaxSettings);

        }
/***************************************
* load an element from the same page
***************************************/
      } else if (opts.local) {
        var $localContent = $(tipAttribute + (/#\w+$/.test(tipAttribute) ? '' : ':eq(' + index + ')')).clone(true).show();
        $cluetipInner.html($localContent);
        cluetipShow(pY);
      }
    };
// get dimensions and options for cluetip and prepare it to be shown
    var cluetipShow = function(bpY) {
      $cluetip.addClass('cluetip-' + ctClass);
      if (opts.truncate) { 
        var $truncloaded = $cluetipInner.text().slice(0,opts.truncate) + '...';
        $cluetipInner.html($truncloaded);
      }
      function doNothing() {}; //empty function
      tipTitle ? $cluetipTitle.show().html(tipTitle) : (opts.showTitle) ? $cluetipTitle.show().html('&nbsp;') : $cluetipTitle.hide();
      if (opts.sticky) {
        var $closeLink = $('<div id="cluetip-close"><a href="#">' + opts.closeText + '</a></div>');
        (opts.closePosition == 'bottom') ? $closeLink.appendTo($cluetipInner) : (opts.closePosition == 'title') ? $closeLink.prependTo($cluetipTitle) : $closeLink.prependTo($cluetipInner);
        $closeLink.click(function() {
          cluetipClose();
          return false;
        });
        if (opts.mouseOutClose) {
          if ($.fn.hoverIntent && opts.hoverIntent) { 
            $cluetip.hoverIntent({
              over: doNothing, 
              timeout: opts.hoverIntent.timeout,  
              out: function() { $closeLink.trigger('click'); }
            });
          } else {
            $cluetip.hover(doNothing, 
            function() {$closeLink.trigger('click'); });
          }
        } else {
          $cluetip.unbind('mouseout');
        }
      }
// now that content is loaded, finish the positioning 
      var direction = '';

      $cluetipOuter.css({overflow: defHeight == 'auto' ? 'visible' : 'auto', height: defHeight});

      tipHeight = defHeight == 'auto' ? Math.max($cluetip.outerHeight(),$cluetip.height()) : parseInt(defHeight,10);   

      tipY = posY;

      baseline = sTop + wHeight;

      if (opts.positionBy == 'fixed') {

        tipY = posY - opts.dropShadowSteps + tOffset;

      } else if ( (posX < mouseX && Math.max(posX, 0) + tipWidth > mouseX) || opts.positionBy == 'bottomTop') {

        if (posY + tipHeight + tOffset > baseline && mouseY - sTop > tipHeight + tOffset) { 

          tipY = mouseY - tipHeight - tOffset;

          direction = 'top';

        } else { 

          tipY = mouseY + tOffset;

          direction = 'bottom';

        }

      } else if ( posY + tipHeight + tOffset > baseline ) {

        tipY = (tipHeight >= wHeight) ? sTop : baseline - tipHeight - tOffset;

      } else if ($this.css('display') == 'block' || $this[0].tagName.toLowerCase() == 'area' || opts.positionBy == "mouse") {

        tipY = bpY - tOffset;

      } else {

        tipY = posY - opts.dropShadowSteps;

      }

      if (direction == '') {

        posX < linkLeft ? direction = 'left' : direction = 'right';

      }

      $cluetip.css({top: tipY + 'px'}).removeClass().addClass('clue-' + direction + '-' + ctClass).addClass(' cluetip-' + ctClass);

      if (opts.arrows) { // set up arrow positioning to align with element

        var bgY = (posY - tipY - opts.dropShadowSteps);

        $cluetipArrows.css({top: (/(left|right)/.test(direction) && posX >=0 && bgY > 0) ? bgY + 'px' : /(left|right)/.test(direction) ? 0 : ''}).show();

      } else {

        $cluetipArrows.hide();

      }



// (first hide, then) ***SHOW THE CLUETIP***

      $dropShadow.hide();

      $cluetip.hide()[opts.fx.open](opts.fx.open != 'show' && opts.fx.openSpeed);

      if (opts.dropShadow) $dropShadow.css({height: tipHeight, width: tipInnerWidth}).show();

      if ($.fn.bgiframe) { $cluetip.bgiframe(); }

      // delayed close (not fully tested)

      if (opts.delayedClose > 0) {

        closeOnDelay = setTimeout(cluetipClose, opts.delayedClose);

      }

      // trigger the optional onShow function

      opts.onShow($cluetip, $cluetipInner);

      

    };
/***************************************
   =INACTIVATION
-------------------------------------- */
    var inactivate = function(event) {
      isActive = false;
      $('#cluetip-waitimage').hide();
      if (!opts.sticky || (/click|toggle/).test(opts.activation) ) {
        cluetipClose();
clearTimeout(closeOnDelay);        
      };
      if (opts.hoverClass) {
        $this.removeClass(opts.hoverClass);
      }
    };
// close cluetip and reset some things
    var cluetipClose = function() {
      $cluetipOuter 
      .parent().hide().removeClass();
      opts.onHide($cluetip, $cluetipInner);

      $this.removeClass('cluetip-clicked');

      if (tipTitle) {

        $this.attr(opts.titleAttribute, tipTitle);

      }

      $this.css('cursor','');

      if (opts.arrows) $cluetipArrows.css({top: ''});

    };
/***************************************
   =BIND EVENTS
-------------------------------------- */
  // activate by click
      if ( (/click|toggle/).test(opts.activation) ) {
        $this.click(function(event) {

          if ($cluetip.is(':hidden') || !$this.is('.cluetip-clicked')) {

            activate(event);

            $('.cluetip-clicked').removeClass('cluetip-clicked');

            $this.addClass('cluetip-clicked');

          } else {

            inactivate(event);

          }

          this.blur();

          return false;

        });

  // activate by focus; inactivate by blur    

      } else if (opts.activation == 'focus') {

        $this.focus(function(event) {

          activate(event);

        });

        $this.blur(function(event) {

          inactivate(event);

        });

  // activate by hover

    // clicking is returned false if cluetip url is same as href url

      } else {

        $this.click(function() {

          if ($this.attr('href') && $this.attr('href') == tipAttribute && !opts.clickThrough) {

            return false;

          }

        });

        //set up mouse tracking

        var mouseTracks = function(evt) {

          if (opts.tracking == true) {

            var trackX = posX - evt.pageX;

            var trackY = tipY ? tipY - evt.pageY : posY - evt.pageY;

            $this.mousemove(function(evt) {

              $cluetip.css({left: evt.pageX + trackX, top: evt.pageY + trackY });

            });

          }

        };

        if ($.fn.hoverIntent && opts.hoverIntent) {

          $this.mouseover(function() {$this.attr('title',''); })

          .hoverIntent({

            sensitivity: opts.hoverIntent.sensitivity,

            interval: opts.hoverIntent.interval,  

            over: function(event) {

              activate(event);

              mouseTracks(event);

            }, 

            timeout: opts.hoverIntent.timeout,  

            out: function(event) {inactivate(event); $this.unbind('mousemove');}

          });           

        } else {

          $this.hover(function(event) {

            activate(event);

            mouseTracks(event);

          }, function(event) {

            inactivate(event);

            $this.unbind('mousemove');

          });

        }

      }

    });

  };

  

/*

 * options for clueTip

 *

 * each one can be explicitly overridden by changing its value. 

 * for example: $.fn.cluetip.defaults.width = 200; 

 * would change the default width for all clueTips to 200. 

 *

 * each one can also be overridden by passing an options map to the cluetip method.

 * for example: $('a.example').cluetip({width: 200}); 

 * would change the default width to 200 for clueTips invoked by a link with class of "example"

 *

 */

  

  $.fn.cluetip.defaults = {  // set up default options

    width:            260,      // The width of the clueTip - default 275

    height:           'auto',   // The height of the clueTip

    cluezIndex:       97,       // Sets the z-index style property of the clueTip

    positionBy:       'fixed',   // Sets the type of positioning: 'auto', 'mouse','bottomTop', 'fixed'

    topOffset:        -20,       // Number of px to offset clueTip from top of invoking element

    leftOffset:       15,       // Number of px to offset clueTip from left of invoking element

    local:            false,    // Whether to use content from the same page for the clueTip's body

    localPrefix:    null,       // string to be prepended to the tip attribute if local is true

    hideLocal:        true,     // If local option is set to true, this determines whether local content

                                // to be shown in clueTip should be hidden at its original location

    attribute:        'rel',    // the attribute to be used for fetching the clueTip's body content

    titleAttribute:   'title',  // the attribute to be used for fetching the clueTip's title

    splitTitle:       '',       // A character used to split the title attribute into the clueTip title and divs

                                // within the clueTip body. more info below [6]

    escapeTitle:      false,    // whether to html escape the title attribute

    showTitle:        true,     // show title bar of the clueTip, even if title attribute not set

    cluetipClass:     'default',// class added to outermost clueTip div in the form of 'cluetip-' + clueTipClass.

    hoverClass:       '',       // class applied to the invoking element onmouseover and removed onmouseout

    waitImage:        true,     // whether to show a "loading" img, which is set in jquery.cluetip.css

    cursor:           'help',

    arrows:           false,    // if true, displays arrow on appropriate side of clueTip

    dropShadow:       true,     // set to false if you don't want the drop-shadow effect on the clueTip

    dropShadowSteps:  4,        // adjusts the size of the drop shadow - default 6

    sticky:           false,    // keep visible until manually closed

    mouseOutClose:    false,    // close when clueTip is moused out

    activation:       'hover',  // set to 'click' to force user to click to show clueTip

                                // set to 'focus' to show on focus of a form element and hide on blur

    clickThrough:     false,    // if true, and activation is not 'click', then clicking on link will take user to the link's href,

                                // even if href and tipAttribute are equal

    tracking:         false,    // if true, clueTip will track mouse movement (experimental)

    delayedClose:     0,        // close clueTip on a timed delay (experimental)

    closePosition:    'top',    // location of close text for sticky cluetips; can be 'top' or 'bottom' or 'title'

    closeText:        'Close',  // text (or HTML) to to be clicked to close sticky clueTips

    truncate:         0,        // number of characters to truncate clueTip's contents. if 0, no truncation occurs



    // effect and speed for opening clueTips

    fx: {             

                      open:       'show', // can be 'show' or 'slideDown' or 'fadeIn'

                      openSpeed:  ''

    },     



    // settings for when hoverIntent plugin is used             

    hoverIntent: {    

                      sensitivity:  3,

              			  interval:     50,

              			  timeout:      0

    },



    // function to run just before clueTip is shown.           

    onActivate:       function(e) {return true;},



    // function to run just after clueTip is shown.

    onShow:           function(ct, c){},

    // function to run just after clueTip is hidden.

    onHide:           function(ct, c){},

    // whether to cache results of ajax request to avoid unnecessary hits to server    

    ajaxCache:        true,  



    // process data retrieved via xhr before it's displayed

    ajaxProcess:      function(data) {

                        data = data.replace(/<s(cript|tyle)(.|\s)*?\/s(cript|tyle)>/g, '').replace(/<(link|title)(.|\s)*?\/(link|title)>/g,'');

                        return data;

    },                



    // can pass in standard $.ajax() parameters, not including error, complete, success, and url

    ajaxSettings: {

                      dataType: 'html'

    },

    debug: false

  };





/*

 * Global defaults for clueTips. Apply to all calls to the clueTip plugin.

 *

 * @example $.cluetip.setup({

 *   insertionType: 'prependTo',

 *   insertionElement: '#container'

 * });

 * 

 * @property

 * @name $.cluetip.setup

 * @type Map

 * @cat Plugins/tooltip

 * @option String insertionType: Default is 'appendTo'. Determines the method to be used for inserting the clueTip into the DOM. Permitted values are 'appendTo', 'prependTo', 'insertBefore', and 'insertAfter'

 * @option String insertionElement: Default is 'body'. Determines which element in the DOM the plugin will reference when inserting the clueTip.

 *

 */

   

  var insertionType = 'appendTo', insertionElement = 'body';

  $.cluetip = {};

  $.cluetip.setup = function(options) {

    if (options && options.insertionType && (options.insertionType).match(/appendTo|prependTo|insertBefore|insertAfter/)) {

      insertionType = options.insertionType;

    }

    if (options && options.insertionElement) {

      insertionElement = options.insertionElement;

    }

  };	

}