var index=2;
var max = 3;
var shiftLeft=0;
var xPosition1=0;
var Counts = 0;
var Counts2 = 0;
var lastCount = 0;
var lastCount2 = 0;
$(document).ready(function(){
   $("#ColorSlideMove").draggable({
                containment: '#pCont',
				start: function(e) {
				if(lastCount!= 0)
				{
				    Counts = lastCount;
				 }
				 else
				 {
				    Counts = 0;
				 }
				if(lastCount2 != 0)
				{
				    Counts2 = lastCount2;
				 }
				 else
				 {
				    Counts2 = 0;
				 }
					xPosition1 = e.pageX;
				},
				drag: function(e) {
				
				shiftLeft = e.pageX-xPosition1;				
					if (shiftLeft > 1 && Counts < 8) {
						//nextLeft();
						   setIsLeft('t');			
				        Counts = Counts + 2;	
				        lastCount = Counts;
				        Counts2 = Counts2 - 2;
				        lastCount2 = Counts2;
					}
				    else if (shiftLeft < 1 && Counts2 < 8){
						//nextRight();						
						   setIsLeft('f');			
				        Counts = Counts - 2;	
				        Counts2 = Counts2 + 2;	
				        lastCount = Counts;
				        lastCount2 = Counts2;
					}
//												
//				if(xPosition1 > 2 && Counts <= 8)
//				    {
				             
				   // }
				 
                //alert();
				},
				stop: function(e) {
//					shiftLeft = e.pageX-xPosition1;
//					if (shiftLeft > 200 && index) {
//						//nextLeft();
//					}
//					else if (shiftLeft > 200 && index<=0){
//						//resetPosition();
//					}
//					else if (shiftLeft > 0 && shiftLeft < 201) {
//						//resetPosition();
//					}
//					else if (shiftLeft > -200 && shiftLeft < 0){
//						//resetPosition();
//					}
//					else if (shiftLeft < -200 && index<max){
//						//nextRight();
//					}
//					else if (shiftLeft < -200 && index>=max){
//						//resetPosition();
//					}
		},
	axis: 'x'});
	$(".arrowLeft").click(function(e) {
		e.preventDefault();
		nextLeft();
   });
	$(".arrowRight a").click(function(e) {
		e.preventDefault();
		nextRight();
   });
});
function nextLeft()
{
	sL = index*(-590)+590;
	if (index >0){
		$("#examples").animate({left: sL+"px"}, 500 );
		siteId = "#w"+index;
		$(siteId).hide();
		index--
		siteId = "#w"+index;
		$(siteId).show();
		$(".arrowRight").removeClass("inactive");
		if (index==0){
			$(".arrowLeft").addClass("inactive");
		}
	}
	else {
		resetPosition();
	}
}

function nextRight()
{
	sR = index*(-590)-590;
	if (index < max){		
		$("#examples").animate({left: sR+"px"}, 500 );
		siteId = "#w"+index;
		$(siteId).hide();
		index++
		siteId = "#w"+index;
		$(siteId).show();
		$(".arrowLeft").removeClass("inactive");
		if (index==max){
			$(".arrowRight").addClass("inactive");
		}
	}
	else {
		resetPosition();
	}
}

function resetPosition()
{	
	sP = index*(-590);
	$("#examples").animate({left: sP+"px"}, 500 );
}