function makeCached(doc) {
	return {
		'next': doc.find('#navi_3_pfeil a').attr('href'),
		'image': doc.find('.panel_image').clone(), 
		'text': doc.find('.panel_text').clone()
	};
}

function afterGet(data, stat) {
    var old = $('.panel_image.active');
	var cached = makeCached($(data));
    cache[old.data('key')] = cached;
	switchPage(cached, old.data('pre'));
}

function afterGetPreload(data, stat) {
    var key = $('body').data('preload_key');
	var cached = makeCached($(data));
    cache[key] = cached;
}

function preloadNext(href) {
    if (href == undefined) return;
    var check = cache[href];
    if (check != undefined) return;
    $('body').data('preload_key', href);
    $.get(href, null, afterGetPreload, 'html');
}

function switchPage(cached, pre) {
	adjustArrow(cached['next']);
    slideImage(cached['image'], pre);
	changeText(cached['text'], pre);
    preloadNext(cached['next']);
}

function adjustArrow(next) {
	$('#navi_3_pfeil a').attr('href', next);
}

function slideImage(panel, pre) {
    var old = $('.panel_image.active');
    panel.addClass('active').css('z-index','99');
    $('.panel_image:not(.active)').remove();
    $('.panel_image').removeClass('old');
    old.removeClass('active').addClass('old').css('z-index', '0');
    var left = $('#bilder .scroll').position()['left'];
    var width = old.width();
    var panel_start = (pre) ? left - width : left + width;
    var old_end = (pre) ? left + width : left - width;
    panel.css('left', panel_start);
    panel.insertBefore(old);
    panel.animate({'left': left}, 800);
    old.animate({'left': old_end}, 800);
}

function changeText(text, pre) {
    if ($.browser.msie) {
        $('.panel_text').replaceWith(text);
    } else {
	text.css('opacity', '0');
	$('.panel_text').fadeTo(400, 0.1, function() { 
                text.replaceAll('.panel_text').fadeTo(400, 1);
        });
    }
}

var cache = {};

function clickLink() {
    var index = $('.navigation a').index(this);
    var active_index = $('.navigation li').index($('.navigation li.active').eq(0));
    if (index != active_index) {
		// change active link
	    $('.navigation li').removeClass('active');
	    $(this).parents('li').addClass('active');
		// change content
	    var href = $(this).attr('href');
	    var pre = index < active_index;
	    var cached = cache[href];
	    if (cached == undefined) {
			$('.panel_image.active').data('key', href).data('pre', pre);
			$.get(href, null, afterGet, 'html');
	    } else {
			switchPage(cached, pre);
	    }
    }
    return false;
}

function clickArrow() {
	var href = $(this).attr('href');
	var sel = $('.navigation a[href='+href+']');
	sel.click();
	return false;
}

function my_href() {
        return $('.navigation a.active').attr('href');
}

// when the DOM is ready...
$(function () {
    $('.navigation a').click(clickLink);
	$('#navi_3_pfeil a').click(clickArrow);
    $('.panel_image').addClass('active');
    cache[my_href()] = makeCached($(document));
    preloadNext($('#navi_3_pfeil a').attr('href'));
});