function setTopTN() {
	if (oBDP = document.getElementById("bigDynPic")) {

		if (self.pageYOffset) {
			y = self.pageYOffset;
		}
		else if (document.documentElement && document.documentElement.scrollTop) {
			y = document.documentElement.scrollTop;
		}
		else if (document.body) {
			y = document.body.scrollTop;
		}

		if (parseInt(oBDP.style.top) == oBDP.style.top) { 
			oBDP.style.top = (15+y)
		} else {
			oBDP.style.top = (15+y) + "px"
		}
	}
}

function dyngallery()
{
	TNTopI = setInterval('setTopTN()',100)
	// check for DOM
	if(!document.getElementById || !document.createTextNode){return;}
	
	// Define Variables
	var galleryElementId='thumbs'
	var fullSizePictureId='bigDynPic';
	var fullSizePictureTitle='Click to return to images';
	var loadingMessageId='loadingmessage';
	var closeImageInformation='Click the large picture to close it.';
	var informationId='info';
	var hideClass='hide';
	var dynamicInfoClass='dyn';
	var closeIntroLink='Go to the pictures';
	var loadingMessage='Loading image';
		


	// if the needed gallery element is available...
	var gallery=document.getElementById(galleryElementId);
	if(!gallery){return;}
	// if there is an information element
 	var info=document.getElementById(informationId);
	if(info)
	{
		// add the dynamic class to it -> other style
		info.className=dynamicInfoClass;
		gallery.className=hideClass;
		// add the dynamic message and the clink to close it
		var addinfo=document.createElement('p');
		addinfo.appendChild(document.createTextNode(closeImageInformation))
		var newa=document.createElement('a');
		newa.href='#';
		newa.appendChild(document.createTextNode(closeIntroLink));
		newa.onclick=function()
		{
			this.parentNode.parentNode.removeChild(this.parentNode);
			gallery.className='';
			gallery.getElementsByTagName('a')[0].focus();
			return false;
		}
		info.appendChild(addinfo);
		info.appendChild(newa);
	}
	// if there is no loading message element, create it and hide it
	if(!document.getElementById(loadingMessageId))
	{
		var lo=document.createElement('div');
		lo.appendChild(document.createTextNode(loadingMessage));
		gallery.parentNode.insertBefore(lo,gallery);
		lo.setAttribute('id',loadingMessageId);
		lo.className=hideClass;
	}
	// loop through all links in the gallery element
	var piclinks=gallery.getElementsByTagName('a');
	for(var i=0;i<piclinks.length;i++)
	{
		// assign a function when the link is activated
		piclinks[i].onclick=function()
		{
			// if there is an information element, remove it
			var info=document.getElementById(informationId);
			if(info){info.parentNode.removeChild(info);}
			// if the link does not have a loaded attribute, show the loading 
			// message
			if(!this.loaded)
			{
				document.getElementById(loadingMessageId).className='';
			}
			// if there is already a big picture displayed, remove it
			var oldp=document.getElementById(fullSizePictureId);
			if(oldp)
			{
			 oldp.parentNode.removeChild(oldp);
			}
			// create a new element hosting the image 
			var imageContainer=document.createElement('div');
			gallery.parentNode.insertBefore(imageContainer,gallery);
			imageContainer.className=hideClass;
			imageContainer.setAttribute('id',fullSizePictureId);
			setTopTN()
			var newpic=document.createElement('img');
			// add a link around the image to allow for keyboard  access
			var newa=document.createElement('a');
			newa.href='#';
			var alt=this.getElementsByTagName('img')[0].getAttribute('alt');
			var url=this.href.indexOf('index2.php?p=')!=-1?this.href.replace('index2.php?p=',''):this.href;
			newpic.setAttribute('src',url);
			newpic.setAttribute('alt',alt);
			newpic.setAttribute('title',fullSizePictureTitle);
			newpic.parent=this;
			// if the image has finished loading, hide the loading message 
			// and set the custom attribute to loaded
			newpic.onload=function()
			{
				document.getElementById(loadingMessageId).className=hideClass;
				// MSIE won't do setAttribute loaded :-(
				this.parent.loaded=true;
			}
			newa.appendChild(newpic);
			// if you click the link around the big image, remove the big
			// image and set the focus back to the thumbnail
			newa.onclick=function()
			{
			 this.parentNode.parentNode.removeChild(this.parentNode);
			 document.getElementById(loadingMessageId).className=hideClass;
			 this.firstChild.parent.focus();
			 return false;
			}
			imageContainer.appendChild(newa);
			// if there is an alt attribute set, then add a paragraph with the
			// text to the container
			var alt=this.getElementsByTagName('img')[0].getAttribute('alt');
			if(alt!='')
			{
				imageCaption=document.createElement('p');
				imageCaption.appendChild(document.createTextNode(alt))
				imageContainer.appendChild(imageCaption);
			}
			imageContainer.className='';;
			// give the new link the focus
//			newa.focus();
			return false;
		}
	}		
}
/*
function toggle(div) {
		if (document.getElementById(div).style.display=='block') {
			document.getElementById(div).style.display = 'none';
			return
		} document.getElementById(div).style.display = 'block'; 
}
*/

window.onload=dyngallery;

