var imagePreList = null;
var pageBrowser = null;
var ar = new Array();

function article(e,i,h)
{
	this.e = e;
	this.i = i
	this.loaded = false;
	this.setOnclick = function()
	{
		this.e.onclick = function()
		{
			location.href = h;
		}
		
	}
}

function arraybrowser(size, data)
{
	this.index = 0;
	this.size = size;
	this.data = data;
	
	this.lastIndex = function()
	{
  	return this.count()-1;
  }
	
	this.count = function()
	{
  	return this.data.length;
  }
   
  this.viewIndex = function()
	{
  	return Math.ceil(this.index - (this.index % this.size));
  }
  
  this.currentPage = function()
	{
  	return Math.ceil((this.index / this.size) + 1);
  }
  
  this.isFirstPage = function()
	{
  	return (this.currentPage() == 1);
  }
  
   this.pageCount = function()
	{
  	return Math.ceil(this.count() / this.size);
  }
  
  this.isLastPage = function()
	{
  	return (this.currentPage() == this.pageCount());
  }
  
  this.lastPage = function()
	{
  	return this.pageCount();
  }
  
  this.view = function()
	{
		var from = this.viewIndex();
    var len = Math.min(this.count() - from, this.size);
  	return this.data.slice(from, from+len);
  }
  
  this.setIndex = function(idx)
	{
  	this.index = Math.max(Math.min(this.lastIndex(), idx), 0);
  }
  
  this.goPage = function(page)
	{
  	this.setIndex((page-1) * this.size);
  }
 
}

function loadimages(k)
{
	var url = "v.aspx?sid=" + k;
	var req = null;
	if(window.XMLHttpRequest)
	{ 
		req = new XMLHttpRequest(); 
	}
	else if(window.ActiveXObject)
	{ 
		try
		{ 
			req = new ActiveXObject("Msxml2.XMLHTTP"); 
		} 
		catch(e)
		{ 
			try
			{ 
				req = new ActiveXObject("Microsoft.XMLHTTP"); 
			} 
			catch(e)
			{
			} 
		} 
	}
	if(req != null)
	{ 
		req.open("GET", url, true); 
		req.onreadystatechange = function()
		{ 
			if(req.readyState == 4) 
			{
				if(req.status == 200) 
				{
					if(req.responseXML != null)
					{ 
						if(req.responseXML.documentElement != null)
						{
							var startTime = new Date();
							var imageList = req.responseXML.documentElement.getElementsByTagName("Img");
							imagePreList = new Object();
							var count = imageList.length;
							for(var y = 0; y < count; y++)
							{
									var c = imageList[y];
									var nA = c.getElementsByTagName("P")[0].firstChild.data.split("/");
									var naLength = nA.length-1;
									if(nA.length > 0 && nA[naLength])
									{
										imagePreList[nA[naLength]] = c;
									}
							}
							generatepages();
						}
					}
				}
			} 
		} 
		req.send(null); 
	}
	else
	{
		alert("Ihr Browser unterstützt XMLHttpRequest nicht. Es können keine Bilder angezeigt werden.");
		generatepages();
	}
}

function ri(u, w, h, idxStr, f, p)
{	
	var idx = idxStr.split("-");
	var pElem = p.getElementsByTagName("div");
	if(pElem == null)
		return;
	var line = document.createElement("div");
	line.style.backgroundImage = "url('" + imgPath + u + "')";
	line.style.width = w + "px";
	line.style.height = f + "px";
	line.style.position = "relative";
	line.style.fontSize = 0;

	var pos = "0px ";
	var idxLength = idx.length;
	for(var i = 0; i < idxLength; i++)
	{
		var tmp = line.cloneNode(false);
		tmp.style.backgroundPosition = pos + (h-idx[i]) + "px";
		pElem[0].appendChild(tmp);
	}
}

function generatepages()
{
	var aIdx = aString.split(";");
	for(var i = 0; i < aIdx.length; i++)
	{
		var pair = aIdx[i].split(":");
		if(pair.length == 1)
			continue;
		var eName = "a" + pair[0];
		var iName = pair[1];
		if(iName != '')
			iName += ".gif";
		var tmpElem = document.getElementById(eName);
		var aElem = tmpElem.getElementsByTagName("a");
		var tmpHref = aElem[0].href;
		var art = new article(tmpElem,iName,tmpHref); 
		art.setOnclick();
		ar.push(art);
	}
	
	var content = document.getElementById("Articles");
	var count = Math.floor((content.offsetWidth / 278));
	var size = count * 8;
	
	if(ar.length <= size)
	{
		for(var x = 0; x < ar.length; x++)
		{
			loadimage(ar[x]);
		}	
	}
	else
	{
		while((ar.length % size) < count)
		{
			size = size - count;
		}
		pageBrowser = new arraybrowser(size, ar);
		renderpage(1);
	}
}

function renderpagebrowser(parentNode)
{
	window.scrollTo(0,0);
	var divElem = document.createElement("div");
	divElem.setAttribute("id",  "PageBrowser");

	var pElem = document.createElement("p");
	divElem.appendChild(pElem);
	
	var spanElem = document.createElement("span");
	var spanText = document.createTextNode(pageBrowser.count() + " Artikel auf " + pageBrowser.pageCount() + " Seiten.");
	spanElem.appendChild(spanText);
	
	var backStrong = document.createElement("strong");
	backStrong.appendChild(document.createTextNode("« "));

	var nextStrong = document.createElement("strong");	
	nextStrong.appendChild(document.createTextNode(" »"));

	var backText = document.createTextNode("Zurück");
	var nextText = document.createTextNode("Nächste");
	
	if(pageBrowser.isFirstPage())
	{
		pElem.appendChild(backStrong);
		pElem.appendChild(backText);
	}
	else
	{
		var aBack = document.createElement("a");
		aBack.href = "javascript:renderpage(" + (pageBrowser.currentPage()-1) + ");";
		aBack.appendChild(backStrong);
		aBack.appendChild(backText);
		pElem.appendChild(aBack);
	}	
	
	//var pageform = document.createElement("form");
	var pageSelect = document.createElement("select");

	for(var p = 1; p <= pageBrowser.pageCount(); p++)
	{
		var o = document.createElement("option");
		o.appendChild(document.createTextNode(p));
		o.setAttribute("value", p);
		if(p == pageBrowser.currentPage())
		{
			o.setAttribute("selected", "selected");
		}
		pageSelect.appendChild(o);
	}
	pageSelect.onchange = function()
	{
		renderpage(parseInt(this.value));		
	}
	pElem.appendChild(pageSelect);
	//pElem.appendChild(pageform);
		
	if(pageBrowser.isLastPage())
	{
		pElem.appendChild(nextText);
		pElem.appendChild(nextStrong);
	}
	else
	{
		var aNext = document.createElement("a");
		aNext.href = "javascript:renderpage(" + (pageBrowser.currentPage()+1) + ");";
		aNext.appendChild(nextText);
		aNext.appendChild(nextStrong);
		pElem.appendChild(aNext);
	}
	
	divElem.appendChild(spanElem);
	parentNode.appendChild(divElem);
}


function renderpage(idx)
{
	pageBrowser.goPage(idx);
	
	var content = document.getElementById("Articles");
	var newContent = content.cloneNode(false);
	renderpagebrowser(newContent);
	
	var view = pageBrowser.view();
	for(var x = 0; x < view.length; x++)
	{
		var a = view[x];
		newContent.appendChild(a.e);
		if(a.loaded == false)
			loadimage(a);
	}
	renderpagebrowser(newContent);
	content.parentNode.replaceChild(newContent, content);
}

function loadimage(a)
{
	if(a.i == '' || a.loaded)
		return;
	var c = imagePreList[a.i];
	if(c != null)
	{
		a.loaded = true;
		ri(c.getElementsByTagName("P")[0].firstChild.data, c.getElementsByTagName("W")[0].firstChild.data, c.getElementsByTagName("H")[0].firstChild.data, c.getElementsByTagName("Idx")[0].firstChild.data, c.getElementsByTagName("F")[0].firstChild.data, a.e);
	}
}