/**
 * 
 */
$(document).ready(function(){
	$('.blueprint-balloon').hover(function(){
		$(this).addClass('hover');
	}, function(){
		$(this).removeClass('hover');
	});
	
	
	
	function handleSliderSlide(e, ui){
		var maxScroll = $("#items").attr("scrollWidth") - $("#items").width();
		$("#items").attr({
			'scrollLeft': ui.value * (maxScroll / 100)
		});
	}
	
	// make sure the UL has a width
	var w = 0;
	$('#items li').each(function(){
		w += 1 + $(this).outerWidth(true); // add one, to compensate for rounding errors of the browser
	});
	$('#items ul').css('width', w + 'px');
	
	$("#content-slider").slider({
		'animate': true,
		'change': handleSliderSlide,
		'slide': handleSliderSlide
	});
	
	
	(function(){
		
		var interval;
		var step = 5;
		
		function move(dir){
			var currentSliderPos = $("#content-slider").slider('value');
			$("#content-slider").slider('value', (currentSliderPos + dir));
		};
		
		function stopMove(){
			clearInterval(interval);
		}
		
		$('#slider-prev-button').mousedown(function(){
			interval = setInterval(function(){
				move(-step);
			}, 100);
		}).mouseup(stopMove).mouseout(stopMove).click(function(){
			move(-step);
		});
		
		$('#slider-next-button').mousedown(function(){
			interval = setInterval(function(){
				move(step);
			}, 100);
		}).mouseup(stopMove).mouseout(stopMove).click(function(){
			move(step);
		});
		
	})();
	
	var hash = document.location.hash;
	hash = hash.substr(1, hash.length);
	
	if (hash) {
		var el = $('#items ul li:eq(' + hash + ') a');
		var itemsW = $('#items ul').outerWidth(true);
		var l = $(el).position().left, w = $(el).outerWidth(true);
		var val = l / (itemsW - w) * 100;

		$("#content-slider").slider('value', val);
		
	}
});