/* 
   JavaScript Document
   SlideShow By 7oda or photocad
   contact : mahmoud2.2007@gmail.com
*/
$(function(){
		   
		   var realWidth_img= $('.slide-auto').size();
		   var realslideWidth_img= $('.slide-auto').outerWidth();
		   $('.con-auto').width(realWidth_img*realslideWidth_img);
		   $('.img-auto').css({'opacity':'.5','filter':'alpha(opacity=50)'});
		   var countimg = 0 , img=1 ,w=0;
		   var spanheight = $('.img-auto').outerHeight();
		   
		   /* append the selector to container depends on the number of sliders */
		   $('<div id="selectors"></div>').appendTo('.container-auto');
		   for(i=0;i<realWidth_img;i++){
			   $('<div class="sel" id="'+i+'"></div>').appendTo('#selectors');
		 	   }
		        $('#0').removeClass('sel');
		        $('#0').addClass('sel-act');
			function animationimg(){	
				if(countimg != realWidth_img-1){	
				 $('.con-auto').fadeOut('slow');
				 $('.img-auto').animate({'bottom':-spanheight-20},500);
			 	 $('.con-auto ').animate({'left':(-realslideWidth_img)*img},100);
				 $('.con-auto ').fadeIn('slow');
				 $('.img-auto').animate({'bottom':'0'},1700);
				 $('.sel-act').removeClass('sel-act').addClass('sel');
				 $('#'+ img +'').removeClass('sel').addClass('sel-act');
				//console.log(img , countimg);
				  countimg++;
			   	  img++;	
				 }
				 else {
					 
					   $('.sel-act').removeClass('sel-act').addClass('sel');
					   $('#'+ img +'').removeClass('sel').addClass('sel-act');
					   $('.img-auto').animate({'bottom':-spanheight-20},500);
					   $('.con-auto').fadeOut('slow');
					   $('.con-auto').animate({'left':0},500);
					   $('.con-auto').fadeIn(1500);
					   $('.img-auto').animate({'bottom':'0'},1700);
					   if(img == realWidth_img && countimg == realWidth_img-1){
					   $('#0').removeClass('sel').addClass('sel-act');
					        }
					   countimg=0;
					   img=1;
			    }
			}
			
			 var n = setInterval(animationimg,7000);
			 $('.sel , #0 ,#selectors.eq(0)').click(function(){			  
					clearInterval(n);
			     	var correct_slide = $(this).attr('id');
				    $('.img-auto').animate({'bottom':-spanheight-20},500);
				    $('.con-auto').fadeOut('slow');
			    	$('.con-auto').animate({'left':(-realslideWidth_img)*correct_slide},500);
				    $('.con-auto').fadeIn(1500);
			   	    $('.img-auto').animate({'bottom':'0'},1700);
					$('.sel-act').removeClass('sel-act').addClass('sel');
					$('#'+ correct_slide +'').removeClass('sel').addClass('sel-act');
					img = parseFloat(correct_slide)+1;
					countimg=parseFloat(correct_slide);
					n = setInterval(animationimg,7000);					   
            });	
});
