$(document).ready(function() {
	var slideTime = 1000;
	
	$("#slider").slider({
		value:0,
		min: 0,
		max: 373,
		animate: true,
		slide: function(event, ui){
			if($("#color_bars").width() != $("#slider").slider("value"))
				$("#color_bars").css({width: $("#slider").slider("value")});
			
			// default
			if($("#slider").slider("value") < 1)
				if($(".default").hasClass('selected') == false)
				{
					$(".default, .slide1, .slide2").removeClass('selected');
					$(".default").addClass('selected');
					$("#content-scroll").stop().animate({scrollLeft: 0}, slideTime);
				}
			
			// slide 1
			if(($("#slider").slider("value") > 0) && ($("#slider").slider("value") <= 221))
				if($(".slide1").hasClass('selected') == false)
				{
					$(".default, .slide1, .slide2").removeClass('selected');
					$(".slide1").addClass('selected');
					$("#content-scroll").stop().animate({scrollLeft: 373}, slideTime);
				}
				
			// slide 2
			if($("#slider").slider("value") > 221)
				if($(".slide2").hasClass('selected') == false)
				{
					$(".default, .slide1, .slide2").removeClass('selected');
					$(".slide2").addClass('selected');
					$("#content-scroll").stop().animate({scrollLeft: 746}, slideTime);
				}
		},
		change: function(event, ui){
			if($("#color_bars").width() != $("#slider").slider("value"))
				$("#color_bars").css({width: $("#slider").slider("value")});
			
			// default
			if($("#slider").slider("value") < 1)
				if($(".default").hasClass('selected') == false)
				{
					$(".default, .slide1, .slide2").removeClass('selected');
					$(".default").addClass('selected');
					$("#content-scroll").stop().animate({scrollLeft: 0}, slideTime);
				}
			
			// slide 1
			if(($("#slider").slider("value") > 1) && ($("#slider").slider("value") <= 221))
				if($(".slide1").hasClass('selected') == false)
				{
					$(".default, .slide1, .slide2").removeClass('selected');
					$(".slide1").addClass('selected');
					$("#content-scroll").stop().animate({scrollLeft: 373}, slideTime);
				}
				
			// slide 2
			if($("#slider").slider("value") > 221)
				if($(".slide2").hasClass('selected') == false)
				{
					$(".default, .slide1, .slide2").removeClass('selected');
					$(".slide2").addClass('selected');
					$("#content-scroll").stop().animate({scrollLeft: 746}, slideTime);
				}
		},
		stop: function(event, ui){
			//alert($("#slider").slider("value"));
		}
	});
});