$(document).ready(function() { 
	h = $('div#content div.haikus').eq(0);
	html = h.html(); 
	if(!html)
		return false;
	
	html = html.split('<hr>');
	
	var i = parseInt(location.hash.replace(/\D+/g, ''));
	if(i < 0 || isNaN(i)){
		i = 0;
	} else if(i >= html.length ){
		i = html.length-1;
	}
	location.hash = '#h'+i;
		
	h.html(
		'<a class="prev">vorheriges</a> <a class="next">nächstes</a>'+
		'<div class="cnt"><div class="wrap"></div></div>'
	);
	move(i, 0);
			
	$('a.next', h).click(function(){
		i = move(i, 1);
		return false;
	});
	
	$('a.prev', h).click(function(){
		i = move(i, -1);
		return false;
	});
	
	$('a.next, a.prev', h)
	.append('<span>')
	.hover(
		function(){
			$('span', this).stop(true).animate({
				height: '60px',
				opacity: 1
			}, 500);
		},
		function(){
			$('span', this).stop(true).animate({
				height: '0px',
				opacity: 0
			}, 500);
		}
	)
});

function move(i, dir){
	var newi = i+dir;
	
	if(newi >= 0 && newi < html.length){
		$('div#content div.haikus div.cnt').stop(true).fadeTo('slow', 0, function(){
			$('div#content div.haikus div.cnt div.wrap').html(html[newi]);
			var speed = Math.abs($('div#content div.haikus div.cnt').height()-$('div#content div.haikus div.cnt div.wrap').height())*4;
			$('div#content div.haikus div.cnt').animate({
				height: $('div#content div.haikus div.cnt div.wrap').height()+'px'
			}, speed).fadeTo('slow', 1);
			
			if(newi >= html.length-1){
				$('a.next', h).addClass('inactive');
			} else {
				$('a.next', h).removeClass('inactive');
			}
			
			if(newi <= 0){
				$('a.prev', h).addClass('inactive');
			} else {
				$('a.prev', h).removeClass('inactive');
			}
		});
				
		location.hash = '#p'+newi;
		return newi;
	} else {
		return i;
	}
	
}