$(function() {
	//handle in page link to panels
	$('a.panel-link').click(function() {
		$('#panels-nav a[href='+ this.hash +']').click();
		return false;
	});
	//keeps nav from moving around when clicking (hide 'em all, add current class, measure 'em, set width, remove class, and then re-show them)
	$('#panels-nav li').css('visibility','hidden').addClass('current').each(function() {
		$(this).css('width', ($(this).width() + 5));
	}).removeClass('current').css('visibility','visible');
	//set nav states based on hash
	var totalEls = $('#panels-nav li a').length;
	//create paging nav	
	if(totalEls > 0) {
		var _prev = $('<span />').addClass('prev').html('previous');
		var _next = $('<span />').addClass('next').html('next');
		$('<div id="paging-nav" />').append(_prev, _next).appendTo('#panels-nav');
	}
	var activeElIndex = $('#panels-nav li a').index($('#panels-nav li a:[href='+ document.location.hash.replace('/','') +']'));
	if(activeElIndex === -1) {
		activeElIndex = 0;
	} 
	//set proper image based on hash
	if(activeElIndex !== 0) {
		$('#panels .panel:first-child').hide();
		$('#panels .panel:nth-child('+ (activeElIndex + 1) +')').show();
	} else {
		$('#panels .panel:first-child').show().css('z-index','2');
	}
	//set nav state
	$('#panels-nav li').removeClass('current').eq(activeElIndex).addClass('current');;
	setPagingState(activeElIndex);
	//set onclick event
	$('#panels-nav li a').click(function() {
		if($(this).parent().hasClass('current')) {
			return false;
		}
		var targetIndex = $('#panels-nav li a').index(this);
		//do fades
		var $new = $('#panels .panel:nth-child('+ (targetIndex + 1) +')');
		var $old = $('#panels .panel:nth-child('+ (activeElIndex + 1) +')');
		$new.fadeIn(500,function() {
			 $(this).css('z-index','2');
		});
		$old.fadeOut(500,function() {
			$(this).css('z-index','1');
		});
		//handle nav state		
		$(this).parent().addClass('current').siblings().removeClass('current');
		setPagingState(targetIndex);
		activeElIndex = targetIndex;
		//set hash
		location.hash = ($(this).attr('href')).replace('#','#/');
		return false;
	});	
	//handle paging by arrows
	$('#paging-nav span').click(function() {
		if ($(this).hasClass('no_')) { 
			return; 
		}
		//figure out direction
		var isPrev = $(this).is('.prev');
		//compare active and target index
		var targetElIndex = isPrev ? activeElIndex - 1 : activeElIndex + 1;
		//set state of link
		setPagingState(targetElIndex);
		//do click
		$('#panels-nav li a:eq('+ targetElIndex +')').click();
	});
        function setPagingState(targetIndex) {
                var isPrev = targetIndex === 0 || targetIndex < activeElIndex;
                var isNext = targetIndex > 8;
                var isSecond = targetIndex === 0 || targetIndex < 9;
                var isEnd = (isPrev && targetIndex === 0) || (!isPrev && targetIndex === totalEls - 1)
                $('#paging-nav span').removeClass('no_');
                if(isEnd) {
                        $('#paging-nav span.'+ (isPrev ? 'prev':'next')).addClass('no_');
                }
                if(isNext) {
                        $('#panels-nav ul.nav').animate({marginLeft:'-765px'},'fast');
                }
                if(isSecond) {
                        $('#panels-nav ul.nav').animate({marginLeft:'0px'},'fast');

                }

        }
});