/* a little jquery slider menu with fading images 
	
	   also a content folding read more tab
	   
	   author: daniel.howlett@lexisclick.com
	 */
		
	$(document).ready(function(){
	
		// settings
		var foldedTabWidth = 34;
		var containerPadding = 7; // includes borders and padding
		var slidersWidth = 780;
		
		var fadeImages = $('#lexisSlide .fadingImage');
		var sliderElements = $('#lexisSlide .sliderItem');
		var containerWidth = $('#lexisSlide .sliderItem:first').width();
		var activeContainerWidth = slidersWidth-((foldedTabWidth+containerPadding)*(sliderElements.length - 1));
		
		// array of slide delay events
		var slideTimers = new Array();
			
		// hide the main image and show bg image on mouse over
		$('#lexisSlide .sliderItem').mouseenter(function(){
			
			for ( var i in slideTimers )
			{
				window.clearTimeout(slideTimers[i]);
			}
			slideTimers = new Array();
			
			// setup the target slider as a variable so it can be used in setTimeout
			var target = $(this);
			
			slideTimers.push( window.setTimeout( function(){
				fadeImages.stop().fadeTo(500,0.0);
				sliderElements.stop().animate({width:foldedTabWidth+'px'},1000);
				target.stop().animate({width:activeContainerWidth+'px'},1000);
			}, 250) );
		
		// show the main image again on mouse out
		}).mouseleave(function(){
		
			for ( var i in slideTimers )
			{
				window.clearTimeout(slideTimers[i]);
			}
			slideTimers = new Array();
			
			slideTimers.push( window.setTimeout( function(){
				fadeImages.stop().fadeTo(500,1.0);
				sliderElements.stop().animate({width:containerWidth+'px'},1000);
			}, 250) );
		
		}).click(function(){
			window.location.href=$(this).children('.fadingImage:first').attr('href');
		
		// add a pointer cursor 
		}).css("cursor","pointer");
		
		
		// read more content folding	
		$('#toggle').click(function(){
			$('#slide_element').slideToggle("normal");
		});
	});