$(function(){


	// here i set current margin for slide to make next and prev button work proper
	//var curmargin = 0;   
 	//curmargin += document.getElementById('slides').style.marginLeft;
	//$('#slides').css({marginLeft:curmargin});
					
			
		 $('#sliderMenu ul li a').click(function(){
			$('#sliderMenu li.menuItem').removeClass('act').addClass('inact'); 
			$(this).parent().removeClass('inact').addClass('act'); 
			$('#sliderMenu li.menuItem').eq(5).css({borderRightWidth:'1px'});
			$(this).blur();
			
	});
		//here i make first tab selected
		 $('#sliderMenu ul li.menuItem:first').addClass('act').siblings().addClass('inact');
		 		  		 
				
			
		 // here i set the width for ul to animate left
		 	var totWidth=0;	
		 	$('#slides li').each(function(){
		 		totWidth += $(this).width();
		 	});
		 
		 $('#slides').width(totWidth);
		 
		 
		 
		 // here i bind tabs to load feature item
		 $('.menuItem a').bind('click',function(){
			
			
			var t = $(this).attr("href").substring(1);
			if(t =='f1'){
				$('#slides').animate({marginLeft:(totalf1-totalf1)+'px'},1000);
				pos = totalf1-totalf1;
			}
			if(t == 'f2'){
				$('#slides').animate({marginLeft:'-'+(totalf1)+'px'},1000);
				pos =  totalf1;
			}
			if(t == 'f3'){
				$('#slides').animate({marginLeft:'-'+(totalf2)+'px'},1000);	
				pos = totalf2;
			}
			if(t == 'f4'){
				$('#slides').animate({marginLeft:'-'+(totalf3)+'px'},1000);	
				pos = totalf3;
			}			
			if(t == 'f5'){
				$('#slides').animate({marginLeft:'-'+(totalf4)+'px'},1000);	
				pos = totalf4;
			}			
		    if(t == 'f6'){
				$('#slides').animate({marginLeft:'-'+(totalf5)+'px'},1000);	
				pos = totalf5;
				$('#sliderMenu li.menuItem').eq(5).css({borderRightWidth:'0px'});
			}	
			if(t == 'f7'){
				$('#slides').animate({marginLeft:'-'+(totalf6)+'px'},1000);	
				pos = totalf6;
			}		
			});
		 	//end 
 
curWidth=$('#slides').width(); // total width of slide
lWidth=$('#slides li').eq(0).width(); // width of first element to move one by one
var noOfF1=$('#slides').find('li.f1').length;
var noOfF2=$('#slides').find('li.f2').length;
var noOfF3=$('#slides').find('li.f3').length;
var noOfF4=$('#slides').find('li.f4').length;
var noOfF5=$('#slides').find('li.f5').length;
var noOfF6=$('#slides').find('li.f6').length;
var noOfF7=$('#slides').find('li.f7').length;
totalf1=lWidth*noOfF1;
totalf2=totalf1+(lWidth*noOfF2);
totalf3=totalf2+(lWidth*noOfF3);
totalf4=totalf3+(lWidth*noOfF4);
totalf5=totalf4+(lWidth*noOfF5);
totalf6=totalf5+(lWidth*noOfF6);
totalf7=totalf6+(lWidth*noOfF7);

$('#mycarousel-next').click(function(){

	pos += lWidth;
	if(pos <= (curWidth-(lWidth*5))){
		$('#slides').stop().animate({marginLeft:-pos+'px'});
		
	}else{
		pos-=lWidth;
	}
	
	
	
});


$('#mycarousel-prev').click(function(){
	
	pos -= lWidth;
	if(pos >=0){
		
		$('#slides').stop().animate({marginLeft:-pos+'px'});
	}else{
		pos+=lWidth;
	}
	
	
});


		 
 });


var pos=0;
var curWidth=0;
var lWidth=0;
var totalf1=0;
var totalf2=0;
var totalf3=0;
var totalf4=0;
var totalf5=0;
var totalf6=0;
var totalf7=0;



//now make function to check tabs 
function init_CheckTabs(){
 var tabs = document.getElementById('slides').style.marginLeft;
 tabs = tabs.substring(1,tabs.lastIndexOf("px"));
 if (tabs=="") tabs="0";
 var tabI=parseInt(tabs);
   if(tabI>=(totalf1-totalf1-lWidth)){
   $('#sliderMenu ul li.menuItem').eq(0).removeClass('act').removeClass('inact').addClass('act').siblings().removeClass('act').addClass('inact');
  // $('#sliderMenu ul li.menuItem').eq(0).addClass('act').siblings().removeClass('act');
   
   }
   if(tabI>=(totalf1-lWidth)){
   $('#sliderMenu ul li.menuItem').eq(1).removeClass('act').removeClass('inact').addClass('act').siblings().removeClass('act').addClass('inact');
   }
  
   if(tabI>=(totalf2-lWidth)){
   $('#sliderMenu ul li.menuItem').eq(2).removeClass('act').removeClass('inact').addClass('act').siblings().removeClass('act').addClass('inact');
   }
   if(tabI>=(totalf3-lWidth)){
   $('#sliderMenu ul li.menuItem').eq(3).removeClass('act').removeClass('inact').addClass('act').siblings().removeClass('act').addClass('inact');
   }
   if(tabI>=(totalf4-lWidth)){
   $('#sliderMenu ul li.menuItem').eq(4).removeClass('act').removeClass('inact').addClass('act').siblings().removeClass('act').addClass('inact');
   }
   if(tabI>=(totalf5-lWidth)){
   $('#sliderMenu ul li.menuItem').eq(5).removeClass('act').removeClass('inact').addClass('act').siblings().removeClass('act').addClass('inact');
	  }
  if(tabI>=(totalf6-lWidth)){
   $('#sliderMenu ul li.menuItem').eq(6).removeClass('act').removeClass('inact').addClass('act').siblings().removeClass('act').addClass('inact');
	  }

 
}
