$(document).ready(function () {
	
	var horizontal = true;
	var $details = $('#slider .detail');
	var $container = $('#slider .scrollContainer');
	var $scroll = $('#slider .scroll').css('overflow', 'hidden');
	
	
	if (horizontal)  {
		$details.css({
			'float' : 'left',
			'position' : 'relative'
		});
		
		$container.css ('width', $details[0].offsetWidth * $details.length);
	
	}
	
	$('#squarenav div').click(selectNav);

		
	function selectNav() {
		$(this)
			.parents('#squarenav a')
				.find('#squarenav div')
					.removeClass('selected')
				.end()
			.end()
		.addClass('selected');
	} 
	
	var scrollOptions = {
		target: $scroll,
		items: $details,
		navigation: '#squarenav a',
		axis: 'xy',
		duration: 700,
		easing: 'swing',
		onAfter: fixnav
		
	};
	
	function fixnav(data) {
		var el = $('#squarenav').find('a[href$="' + data.id + '"]').parent().get(0);
		selectNav.call(el);
	}
	
	/* Fix this sometime */ 
	
	/*if (window.location.hash) {
		console.log(fixnav({id: window.location.hash.substr(1) }.parent()));
		} else {
			$('#squarenav a:first').click();
		}*/
	
/*	console.log(window.location.hash.substr(1));*/
	
		
	$('#slider').serialScroll(scrollOptions);
	$.localScroll(scrollOptions);
	$('#squarenav a:first').click();
});