$(document).ready(function() {
	
	var $panels = $('#casestudy .contents > div');
	var $container = $('#casestudy .contents');
	
	var horizontal = false;
	
	if (horizontal) {
	  $panels.css({
	    'float' : 'left',
	    'position' : 'relative' 
	  });
	  $container.css('width', $panels[0].offsetWidth * $panels.length);
	}
	
	var $scroll = $('#casestudy').css('overflow', 'hidden');
		
	$('#casestudy-nav').find('a').click(selectNav);

	function selectNav() {
	  $(this)
	    .parents('ul:first') 
	      .find('li') 
	        .removeClass('selected') 
	      .end() 
	    .end() 
	    .parents('li:first')
	    .addClass('selected');
	    
		return false;
	    
	}

	function trigger(data) {
	  var el = $('#casestudy-nav').find('a[href$="' + data.id + '"]').get(0);
	  selectNav.call(el);
	}
			
	if (window.location.hash) {
	  trigger({ id : window.location.hash.substr(1)});
	}

	 var offset = parseInt((horizontal ? 
	   $container.css('paddingTop') : 
	   $container.css('paddingLeft')) 
	   || 0) * -1;
	
	
	var scrollOptions = {
	  target: $scroll,
	  items: $panels,
	  navigation: '#casestudy-nav a',
	  prev: 'img.left', 
	  next: 'img.right',
	  axis: 'xy', 
	  onAfter: trigger,
	  offset: offset,
	  duration: 600,
	  easing: 'easeInOutBack'
	};
	
	// apply serialScroll to the slider - we chose this plugin because it 
	// supports// the indexed next and previous scroll along with hooking 
	// in to our navigation.
	$('#casestudy').serialScroll(scrollOptions);
	
	// now apply localScroll to hook any other arbitrary links to trigger 
	// the effect
	$.localScroll(scrollOptions);
	
	// finally, if the URL has a hash, move the slider in to position, 
	// setting the duration to 1 because I don't want it to scroll in the
	// very first page load.  We don't always need this, but it ensures
	// the positioning is absolutely spot on when the pages loads.
	scrollOptions.duration = 1;
	$.localScroll.hash(scrollOptions);
	
});