jQuery(document).ready(function(){
	
	var container = $('div.sliderGallery');
    var ul = $('ul', container);
    
    //var itemsWidth = ul.innerWidth() - container.outerWidth();
    var itemsWidth = 1110;
    var stop = true;
    var move = true;
    
    $('.slider', container).slider({
        min: 0,
        max: itemsWidth,
        stop: function (event, ui) {
    	ul.animate({left: ui.value * -1}, 900);
    	stop = true;
        },
        slide: function (event, ui) {
        	if(stop == false){
        	ul.css('left', ui.value * -1);
        	}
        	var tab = 0;
        	if(ui.value < 220){ tab = 0;}
        	else if (ui.value < 400){ tab = 1;}
        	else if (ui.value < 600){ tab = 2;}
        	else if (ui.value < 800){ tab = 3;}
        	else if (ui.value < 1000){ tab = 4;}
        	else if (ui.value < 1300){ tab = 5;}
        	
        	move = false;
        	$("#tabs").tabs("select", tab);
        	
        	
        	stop = false;
        }
    });
    
    $("#tabs").tabs({
		select: function(event, ui) {
    		var pos = ui.index * 222;   		
			$(".slider").slider("value", pos);
    		if(move == true){
    			ul.animate({left: pos * -1}, 500);
    		}
    		move = true;
		}
	});

	
});