// triptips.js by frank thanks to clagnut
var picscount,tripbasesrc,lastpicnr,nextpicnr;
window.onload = init;

function init()
{
	optionTest = true;
	if (!document.getElementById)
		{ 
		optionTest = false;
		return;
		}
	if (!document.getElementsByTagName)
		{ 
		optionTest = false;
		return;
		}

	initeventhandlers();		
} //end init

function initeventhandlers()
{
	if (!optionTest) return;
	
	if (document.getElementById('gallery'))	//if gallery images available attach handler
		{
		document.getElementById('back').firstChild.nodeValue = 'Bilder vergrößern: Auf ein Bild klicken.';
		var galleryimagesarray = document.getElementById('gallery').getElementsByTagName('img');//get all the images in the gallery
		//init the globals
		tripbasesrc = galleryimagesarray[0].src.substring(0,galleryimagesarray[0].src.indexOf("-"));
		picscount = document.getElementById('count').firstChild.nodeValue;
		lastpicnr = picscount;
		currentpicnr = 1;
		nextpicnr = currentpicnr + 1;
		for (var i=0;i<galleryimagesarray.length-1;i++)	//assign the handlers to all the images in the gallery, last img is the bigpicture
			{
		    galleryimagesarray[i].onclick = showgallery ;
			}
		}

} // end initeventhandlers

function showgallery ()
{
	var galleryimagesarray = document.getElementById('gallery').getElementsByTagName('img');//get all the images in the gallery
	for (var i=0;i<galleryimagesarray.length-1;i++)	//make all the thumbs invisible, last img is the bigpicture dont apply style
		{
		galleryimagesarray[i].style.display = 'none';
		}
	document.getElementById('count').className = '';
	//write the proper text into the nav elements
	document.getElementById('back').firstChild.nodeValue = 'zurück';
	document.getElementById('count').firstChild.nodeValue = 'Bild 1 von '+picscount;
	document.getElementById('forward').firstChild.nodeValue = 'weiter';
	document.getElementById('gallery').className = 'loading';
	//show the first big picture
	document.getElementById('bigpicture').src = tripbasesrc+'-g-1.jpg';
	//make the fade in effect
	setOpacity(document.getElementById('bigpicture'), 0);
	fadeIn('bigpicture',0);	
	
	//attach a handler onto the pseudo buttons
	document.getElementById('back').onclick = imgbackward;
	document.getElementById('forward').onclick = imgforward;
	//attach a handler onto the img to make the fade in effect
	document.getElementById('bigpicture').onload =function(){ document.getElementById('bigpicture').style.visibility = 'visible'; setOpacity(document.getElementById('bigpicture'), 0); fadeIn('bigpicture',0);	}
}

function imgbackward ()
{
	//show the previous big picture
	document.getElementById('bigpicture').style.visibility = 'hidden'; //hide pic while loading
	document.getElementById('bigpicture').src = tripbasesrc+'-g-'+lastpicnr+'.jpg';
	//update the text
	document.getElementById('count').firstChild.nodeValue = 'Bild '+lastpicnr+' von '+picscount;
	//clac new next and last picnr
	nextpicnr = lastpicnr+1;
	if (nextpicnr > picscount) nextpicnr = nextpicnr-picscount;
	lastpicnr--;
	if (lastpicnr < 1) lastpicnr = picscount;
}

function imgforward ()
{
	//show the next big picture
	document.getElementById('bigpicture').style.visibility = 'hidden'; //hide pic while loading
	document.getElementById('bigpicture').src = tripbasesrc+'-g-'+nextpicnr+'.jpg';
	//update the text
	document.getElementById('count').firstChild.nodeValue = 'Bild '+nextpicnr+' von '+picscount;
	//clac new next and last picnr
	lastpicnr = nextpicnr-1;
	if (lastpicnr < 1) lastpicnr = lastpicnr+picscount;
	nextpicnr++;
	if (nextpicnr > picscount) nextpicnr = nextpicnr-picscount;
}

function setOpacity(obj, opacity) {
	opacity = (opacity == 100)?99.999:opacity;
	obj.style.filter = "alpha(opacity:"+opacity+")";// IE/Win
	obj.style.KHTMLOpacity = opacity/100;// Safari<1.2, Konqueror
	obj.style.MozOpacity = opacity/100;// Older Mozilla and Firefox
	obj.style.opacity = opacity/100;// Safari 1.2, newer Firefox and Mozilla, CSS3
}

function fadeIn(objId,opacity) 
{
	obj = document.getElementById(objId);
	if (opacity <= 100)
		{
		setOpacity(obj, opacity);
		opacity += 10;
		window.setTimeout("fadeIn('"+objId+"',"+opacity+")", 100);
		}
}