$(document).ready(function () {
	
	var $panels1 = $('#featured_app_showcase .panel');
	var $panels2 = $('#local_apps .panel');
	var $target1 = $('#featured_app_showcase .box').css('overflow', 'hidden');
	var $target2 = $('#local_apps .box').css('overflow', 'hidden');
	
	function selectNav() {
	  $(this)
		.parents('ul:first')
		  .find('a')
			.removeClass('selected')
		  .end()
		.end()
		.addClass('selected');
	}
	
	$('#featured_app_showcase .pagination').find('a').click(selectNav);
	$('#local_pagination').find('a').click(selectNav);

	function featured_trigger(data) {
		var el = $('#featured_app_showcase .pagination').find('a[href$="' + data.id + '"]').get(0);
		selectNav.call(el);
	}

	function local_trigger(data) {
		var el = $('#local_pagination').find('a[href$="' + data.id + '"]').get(0);
		selectNav.call(el);
	}

	var featuredScrollOptions = {
	  target: $target1,
	  items: $panels1,
	  navigation: '.pagination a',
	  prev: 'img.feature_left', 
	  next: 'img.feature_right',
	  axis: 'x',
	  onAfter: featured_trigger,
	  offset: -15, // Compensate for margin
	  duration: 500,
	  easing: 'swing'
	};
	
	var localScrollOptions = {
	  target: $target2,
	  items: $panels2,
	  navigation: '#local_pagination a',
	  prev: 'img.local_left', 
	  next: 'img.local_right',
	  axis: 'x',
	  onAfter: local_trigger,
	  offset: -15, // Compensate for margin
	  duration: 300,
	  easing: 'swing'
	};
	
	$('#featured_app_showcase').serialScroll(featuredScrollOptions);
	$('#local_apps').serialScroll(localScrollOptions);
	
	
});