var numleft;
$(function(){
     numleft =  $("#idNum2").position().left;
     var len2 = $("#idNum2 li").length;
	 var currentLen = len2;
     var index2 = 0;
 
$("#idNum2 li").mouseover(function(){
   var index1 =   $("#idNum2 li").index(this);
   index2=index1;
   showImg1(index1,currentLen,len2);
}); 
 
var tempNum = $("#idNum2 li").clone(true);
 
$(".btnleft").click(function(e){
        new moveLeft();
		e.preventDefault();
});
 
$(".btnright").click(function(e){
		 new moveRight();  
		 e.preventDefault();
});
 
$('#idTransformView2').hover(function(){
     if(MyTime2){
     clearInterval(MyTime2);
     }
},function(){
     MyTime2 = setInterval(function(){
     new moveRight(); 
	 } , 5000);
});
 
var MyTime2 = setInterval(function(){
     new   moveRight();     
} , 5000);
 
var moveLeft  =function(){
		index2=(--index2+currentLen)%currentLen;
        if(index2==0 && currentLen==len2)
		{
			var temp = tempNum.clone(true);
			temp.insertBefore($("#idNum2 li:first"));
			currentLen=len2*2;
			index2=index2+len2;
			  $("#idNum2").stop(true,false).animate({left : -103*(len2-1)},0); 
		}
		if(index2==0 && currentLen == len2*2){
         var temp = tempNum.clone(true);
		 index2+=len2;
		 $("#idNum2 li:gt("+(len2-1)+")").remove();
		 temp.insertBefore($("#idNum2 li:first"));
         $("#idNum2").stop(true,false).animate({left : -len2*103},0); 
		}
        showImg2(index2,currentLen,len2);
 
}
 
var moveRight =function(){
         index2=(++index2+currentLen)%currentLen;
         if(index2==len2-1 && currentLen!=len2*2){
         var temp = tempNum.clone(true);
         temp.insertAfter($("#idNum2 li:last"));
		 currentLen=len2*2; 
		 }
		 
		 if(index2==len2*2-1){
		 var temp = tempNum.clone(true);
		 $("#idNum2 li:lt("+len2+")").remove();
		 index2=index2-len2;
		 temp.insertAfter($("#idNum2 li:last"));
         $("#idNum2").stop(true,false).animate({left : -103*(index2-6)},0); 
		 }  
		 showImg2(index2,currentLen,len2);
}
});
 
function showImg2(i,len,len2){
   	$("#idSlider2 li").each(function(index) {
	    if((i+len)%len2 == index) $(this).fadeIn(650);
		else
		$(this).fadeOut(650);
	});
 
   if(i==0)
   $("#idNum2").stop(true,false).animate({left : numleft-103*i},700);
   if(i>5)
   $("#idNum2").stop(true,false).animate({left : numleft-103*(i-5)},700);
 
	$("#idNum2 li").each(function(index) {
		if(i == index) $(this).addClass("on");
		else $(this).removeClass("on");
	});
 
}
function showImg1(i,len,len2)
{
   	$("#idSlider2 li").each(function(index) {
	    if((i+len)%len2 == index) $(this).fadeIn(650);
		else
		$(this).fadeOut(650);
	});
   
	$("#idNum2 li").each(function(index) {
		if(i == index) $(this).addClass("on");
		else $(this).removeClass("on");
	});
 }
