window.onload = init;

function init() {
	adoptHeight()
	if(document.getElementById('big_pic')) {
		galleryNav()
	}
}

function adoptHeight() {
	if(document.documentElement.clientHeight < 600) {
		w = document.getElementById('wrapper');
		w.style.marginTop='-10px'
	}
}

function galleryNav() {
	//write gallery-nav
	galleryNav=document.createElement('p')
	galleryNav.id='gallery_nav'
	galleryNav.innerHTML='<a id="left">&lt;&lt;</a><span id="picnr">1</span><a id="right">&gt;&gt;</a>'
	mainDiv=document.getElementById('main')
	mainDiv.insertBefore(galleryNav,mainDiv.firstChild)

	//get thumbnails
	thumbs=new Array()
	col=document.getElementsByTagName('img') //return HTMLCollection, not(!) Array
	for(i=0;i<col.length;i++) 
		thumbs.push(col[i]);
	thumbs.shift()

	//prev-link
	var left=document.getElementById('left')
	left.onclick=previous

	//next-link
	var right=document.getElementById('right')
	right.onclick=next

	//update picnr if you click on thumbnails, too
	for(i=0;i<thumbs.length;i++) {
		thumbs[i].onclick=updatePicnr
	}
}

function previous() { 
	pic_nr=document.getElementById('picnr')
	if(pic_nr.innerHTML>0) {
		pic_nr.innerHTML--
		changeImage(pic_nr.innerHTML)
	}
}
function next() { 
	pic_nr = document.getElementById('picnr')
	if(pic_nr.innerHTML<thumbs.length) {
		pic_nr.innerHTML++
		changeImage(pic_nr.innerHTML)
	}
}
function changeImage(nr) {
	pic_id=thumbs[--nr].alt.replace('_thumb', '');
	new Ajax.Updater('big_pic', '/galleries/update_big_pic/'+pic_id, {asynchronous:true, evalScripts:true});
}
function updatePicnr() {
	pic_nr=document.getElementById('picnr')
	for(i=0;i<thumbs.length;i++) {
		if(thumbs[i].alt==this.alt)
			pic_nr.innerHTML=i+1
	}	
}