$(function() {
	$('#topCats a').click(gotoCat);
	$('#btnPrev').click(gotoPrev);
	$('#btnNext').click(gotoNext);
	$('#goUp').click(gotoTop);
	enabled = true;
    });

var animateSpeed = 500;
var enabled = false;

function gotoCat() {
    if (enabled) {
	enabled = false;
	var category = $(this);
	showInitial(category);
    }
    return false;
}

function gotoNext() {
    if (enabled) {
	enabled = false;
	var current = $('#topCats a[active="1"]:first');
	var next = $(current).parent().next();

	if (next.length == 0) {
	    next = $(current).parent().parent().next().find('li:first');
	}
	
	if (next.length > 0) {
	    swapContent(next.find('a'), 'next');
	}
    }
}

function gotoPrev() {
    if (enabled) {
	enabled = false;
	var current = $('#topCats a[active="1"]:first');
	var prev = $(current).parent().prev();
	
	if (prev.length == 0) {
	    prev = $(current).parent().parent().prev().find('li:last');
	}
	
	if (prev.length > 0) {
	    swapContent(prev.find('a'), 'prev');
	}
    }
}

function showInitial(category) {
    $('#topCats a').attr('active', '');
    $('#catLabel h3').html(category.html());
    $('#catLabel h3').css({position: 'absolute'});
    $('#catLabel h3, #btnNext, #btnPrev').fadeIn(animateSpeed);

    // mark active a tag
    category.attr('active', 1);

    // create sub list container
    $('#catList').append('<div></div>');

    setButtonState(category);

    $('#goUp').fadeIn(animateSpeed);
    $('#topCats').fadeOut(animateSpeed, function() {	    
	    var subCat = $('#catList div:last');

	    $(subCat).load(category.attr('href'), function () {
		    if ($('#catList div:last').height() > $('#topCats').height()) {
			var nh = $('#catList div:last').height() + 'px';
			
			$('#catList').animate({height: nh}, animateSpeed, function() {
				$('#catList div:last').fadeIn(animateSpeed, function() {

					enabled = true;
				    });
			    });
		    }
		    else {
			$('#catList div:last').fadeIn(animateSpeed, function() {
				$('#catList').animate({height: $('#catList div:last').height() + 'px'});

				enabled = true;
			    });
		    }
		});    
	});
}

function swapContent(category, dir) {
    $('#topCats a').attr('active', '');
    category.attr('active', 1);

    // attach sub-category title h3
    var curTitle = $('#hdCrop h3:last');
    curTitle.before('<h3></h3>');
    var newTitle = $('#hdCrop h3:first');
    newTitle.html(category.html());

    // attach sub-category div
    var curCat = $('#catList div:last');
    curCat.before('<div></div>');
    var newCat = curCat.prev();

    if (dir == 'next') {
	$(newTitle).css({position: 'absolute',left: '500px', display: 'block'});
	$(newCat).css({left: '1000px'});
    }
    else {
	$(newTitle).css({position: 'absolute', left: '-500px', display: 'block'});
	$(newCat).css({left: '-1000px'});
    }

    setButtonState(category);

    // Google Analytics Tracking
    pageTracker._trackPageview(category.attr('href'));

    $(newCat).load(category.attr('href'), function () {
	    var offPos = (dir == 'next') ? '-1000px' : '1000px';
	    var titlePos = (dir == 'next') ? '-500px' : '500px';

	    if ($(this).height() > $('#catList div:last').height()) {
		var nh = $(this).height() + 'px';

		$('#catList').animate({height: nh}, animateSpeed, function() {
			actionAfterLoad(newCat, offPos, newTitle, titlePos);
		    });
	    }
	    else {
		actionAfterLoad(newCat, offPos, newTitle, titlePos);
	    }
        });
}

function actionAfterLoad(newCat, offPos, newTitle, titlePos) {
    $(newTitle).animate({left: 0}, animateSpeed);
    $(newCat).animate({left: 0}, animateSpeed);

    $('#hdCrop h3:last').animate({left: titlePos}, animateSpeed, function() {
	    $(this).remove();
	});

    $('#catList div:last').animate({'left': offPos}, animateSpeed, function() {
	    $(this).remove();

	    var ch = $('#catList div:last').height();
	    $('#catList').animate({height: ch + 'px'}, animateSpeed);
	    enabled = true;
	});
}

function setButtonState(category) {
    var current = $('#topCats a[active="1"]:first');
    var next = $(current).parent().next(); 
    var prev = $(current).parent().prev(); 
    
    if (next.length == 0) {
        next = $(current).parent().parent().next().find('li:first');
    }
    
    if (prev.length == 0) {
        prev = $(current).parent().parent().prev().find('li:last');
    }
    
    if (next.length < 1) {
        $('#btnNext').hide();
    }
    else {
	$('#btnNext').show();
    }

    if (prev.length < 1) {
	$('#btnPrev').hide();
    }
    else {
	$('#btnPrev').show();
    }        
}

function gotoTop() {
    if (enabled) {
	enabled = false;
	$('#goUp').fadeOut(animateSpeed);
	$('#catLabel h3, #btnNext, #btnPrev').fadeOut(animateSpeed, function() {
		$('#btnNext, #btnPrev').hide();
	    });
	
	if ($('#topCats').height() > $('#catList div:last').height()) {
	    var nh = $('#topCats').height() + 'px';
	    
	    $('#catList').animate({height: nh}, animateSpeed, function() {
		    $('#catList div:last').fadeOut(animateSpeed, function() {
			    $('#topCats').fadeIn(animateSpeed, function() {
				    enabled = true;
				});
			});
		});
	}
	else {
	    $('#catList div:last').fadeOut(animateSpeed, function() {
		    $('#topCats').fadeIn(animateSpeed, function() {
			    $('#catList').animate({height: $('#topCats').height() + 'px'});
			    enabled = true;
			});
		});
	}
    }
}