// JavaScript Document
var $items;
var $items_holder;
var $container;
var $current;
var $nextTime;
var $prevTime;
var $left_trigger;
var $right_trigger;

$(document).ready(function(){
	$items = $('#slido li');
	$items_holder = $('#slido ul');
	$container = $('#slido');
	$firstScroll = 554*2;
	$f = 2;
	$current = $f-1;
	$container.css({opacity:0}).animate({scrollLeft:$firstScroll-554},'fast',function(){
																																					$(this).animate({opacity:1},2000)
																																					$items.animate({
																																						opacity:1
																																					})
																																					$($items[$current]).animate({
																																						opacity:1
																																					})
																																				})
	
	$fWidth = ($items.length-1)*554;
	$items_holder.width($fWidth+188);
	
	$('.left_arrow').mouseout(function(){
		$left_trigger=1;
	})
	
	$('.right_arrow').mouseout(function(){
		$right_trigger=1;
	})
	
})

function prevTimer(){
	$prevTime = setTimeout("prevSlide()",1);
}

function nextTimer(){
	$nextTime = setTimeout("nextSlide()",1);
}

function stopprevTimer(){
	clearTimeout($prevTime)
}

function stopnextTimer(){
	clearTimeout($nextTime)
}

function nextSlide(){
	if($container.scrollLeft() == ($items_holder.width()-742)){
		stopnextTimer();
	}else{
		$right_trigger='';
		$container.animate({
									scrollLeft:"+="+554
								},1500,function(){
									if($right_trigger > 0){
										stopnextTimer();
									}else{
										nextTimer();
									}
								})
		$($items[$current]).animate({
													opacity:1
												});
		
		
		$($items[$current+1]).animate({
													opacity:1
												});	
		$current = $current+1;
	}
}

function prevSlide(){
	if($container.scrollLeft() == 0){
	stopprevTimer();
	
	}else{
	$left_trigger='';
	$container.animate({
								scrollLeft:"-="+554
							},1500,function(){
								if($left_trigger > 0){
									stopprevTimer();
								}else{
									prevTimer();
								}
						})
	
	$($items[$current]).animate({
												opacity:1
											});
	$($items[$current-1]).animate({
												opacity:1
											});	
	$current = $current-1;
	}
}


/*---  ---*/

$(document).ready(function(){ 
													 
	$all_key = $('.moreInfo');
	var $layer;
	var S;
	var $body  = $('html');
	$all_key.click(function(){
		$('.ProductDescContainer').hide();
		$('#'+$(this).attr('name')).fadeIn('slow');
	});
	
	$('.closer').click(function(){
		$('#'+$(this).attr('name')).fadeOut('slow');
	});
	
	/*
	for(i=0;i<$all_key.length;i++){
		$layer = $('#'+$all_key[i].name);	
		S = $all_key[i];
		function dismissLayer(e){
			
	for(i=0;i<$all_key.length;i++){
	
			$layer.trigger( 'dismiss' );
			$('#'+$all_key[i].name).fadeOut();
		}}
		
		$('#'+$all_key[i].name)
			.bind( 'summon', function( e )
			{
				$('#'+this.id).fadeIn();
				$body.bind( 'mouseover', dismissLayer );
			} )
			.bind( 'dismiss', function( e )
			{
				$('#'+this.id).hide();
				$body.unbind( 'mouseover', dismissLayer );
			} )
			.mouseover( function( e )
			{
				e.stopPropagation();
			})
			.trigger( 'dismiss' );
	
		// This is optional - this just triggers the div to 'visible'
		$('#'+$all_key[i].id).click( function( e )
		{
			$layer = $('#'+this.name);
			$layer.trigger('summon');
			e.stopPropagation();
		});
		
	}*/
});