/*
Ein Script von Julian Hibbeln.
http://www.fun-fox.de/bilder-fokus.php
Version 1.3
*/
<!--
var position = -1;
var pictures_urls = new Array();
var pictures_titles = new Array();

window.onload=function()
{
	var links=document.getElementsByTagName("a");
	for(var i=0; i<links.length; i++)
	{ 
		if(links[i].getAttribute("rel") && links[i].getAttribute("rel")=="thumbnail")
		{	
			pictures_urls.push(links[i].getAttribute("href"));
			pictures_titles.push(links[i].getAttribute("title"));
			links[i].onclick=function()
			{
				var title = this.getAttribute("title");
				if(!title)title = "";
				imagePreload(this.getAttribute("href"),title);
				return false;
			}
		}
	}
}

document.onkeypress=function(key)
{
	key = !key ? event:key;
	code = key.keyCode ? key.keyCode:key.which;
	if(code==27)
		remove();
}

function imagePreload(url,title)
{
	var img_f = new Image();
	var img_b = new Image();
	
	if(pictures_urls.length > 1)
		var navigation = "<span onclick=\"navigate('back')\" id=\"bf_picture_nb\">back</span> | <span onclick=\"navigate('forward')\" id=\"bf_picture_nf\">forward</span>";
	else
		var navigation = "<span id=\"bf_picture_nb\"></span><span id=\"bf_picture_nf\"></span>";

	document.getElementById("show").innerHTML = "<table id=\"bf_picture\"><tr><td><img id=\"bf_picture_img\"  src=\""+url+"\" onload=\"movePicture();\" /></td></tr><tr><td><table><tr><td id=\"bf_picture_title\">" + title + "</td><td id=\"bf_navigation\">"+navigation+"</td></tr></table><a href=\"javascript:remove()\"id=\"bf_close\"  title=\"Click or press ESC to close\">x</a></td></tr></table>";
	
	document.getElementById("bf_picture").style.visibility = "hidden";

	updatePosition(url);
	
	img_f.src=pictures_urls[nextIndex('forward')];
	img_b.src=pictures_urls[nextIndex('back')];
	
	return;
}

function movePicture()
{
	var picture = document.getElementById("bf_picture");
	var x_close = document.getElementById("bf_close");
	
	var heightPicture = picture.offsetHeight;
	var heightScreen = document.documentElement.clientHeight;
	if (window.innerWidth)
		var heightWindow = window.pageYOffset;
	else
		var heightWindow = document.documentElement.scrollTop;
	
	var top = Math.round(heightWindow + (heightScreen - heightPicture)/2);
	if(top < 0) top = 0;
	
	picture.style.top = top + "px";
	
	var widthPicture = picture.offsetWidth;
	var widthScreen = document.documentElement.clientWidth;
	
	var left = Math.round((widthScreen - widthPicture)/2);
	if(left < 0) left = 0;
	
	picture.style.left = left + "px";
	
	x_close_top = (heightWindow - top);
	if(x_close_top>0)
		x_close.style.top = x_close_top + "px";
	
	picture.style.visibility = "visible";
	return;
}

function navigate(direction)
{
	var img = document.getElementById("bf_picture_img");
	var title = document.getElementById("bf_picture_title");
	var img_x = new Image();
	
	position = nextIndex(direction);			
	img.setAttribute("src", pictures_urls[position], 1);
	if(pictures_titles[position])
		title.innerHTML = pictures_titles[position];
	else
		title.innerHTML = "";
	img_x.src=pictures_urls[nextIndex(direction)];
	
	return;
}

function updatePosition(url) 
{
	var key = '';
	for(key in pictures_urls)
	{
		if(pictures_urls[key] == url)
		{
			position = key;
		}
	}
	return;
}

function nextIndex(direction)
{
	var l = pictures_urls.length;
	if(direction == "forward")
	{
		if(position >= l-1)
			return 0;
		else
			return Number(position)+1;
	}
	if(direction == "back")
	{
		if(position <= 0)
			return l-1;
		else
			return position-1;		
	}
	return;
}

function remove()
{
	document.getElementById("show").innerHTML = "";
	return;
}
//-->