window.onload = init;
function init() {

	if(document.getElementById('big_pic')) {
		var gallery2=document.getElementById('big_pic').parentNode;
		var ul=gallery2.getElementsByTagName('ul')[0];
		
		var image_counter=document.createElement('div');
		image_counter.id='image_counter';
		image_counter.innerHTML=ul.getElementsByTagName('img').length;
		document.body.appendChild(image_counter);
		
		offset=document.createElement('div');
		offset.id='offset';
		offset.innerHTML='0';
		document.body.appendChild(offset);
			
		var scrollBox=document.createElement('div');
		scrollBox.id='scrollbox';
		gallery2.appendChild(scrollBox);
		scrollBox.appendChild(ul)
		
		var left = document.createElement('a');
		left.id = 'left';
		left.style.display='none';
		left.innerHTML = 'previous';
		left.onclick = function() {scrollLeft(ul)};
		gallery2.appendChild(left);
		
		var right = document.createElement('a');
		right.id = 'right';
		if(image_counter.innerHTML<11)
			right.style.display='none';
		right.innerHTML = 'next';
		right.onclick = function() {scrollRight(ul)};;
		gallery2.appendChild(right);
		
		/*//set focus for selected images (needed for ie)
		var images=ul.getElementsByTagName('img');
		for(i in images) {
			var img = images[i];
			img.onclick = function() {setFocus(this, images);blur();};
		}*/
	}
}

/*function setFocus(img, images) {
	for(i in images) {var x=images[i];x.className='';}
	img.className='focus';
}*/

function scrollLeft(element){
	var image_width=80;
	var offset=document.getElementById('offset');
	var images=document.getElementById('image_counter').innerHTML;
	var rest=offset.innerHTML;
	var scroll_by=10;
	if(rest<10)
		scroll_by=rest;
	offset.innerHTML=parseInt(offset.innerHTML)-scroll_by;
	if(offset.innerHTML==0)
		document.getElementById('left').style.display='none';
	if(images>10){
		document.getElementById('right').style.display='block';
	}
	
	new Effect.Move(element, { x: (scroll_by*image_width), y: 0, mode: 'relative' }); 
	return false;
}

function scrollRight(element){
	var image_width=80;
	var offset=document.getElementById('offset');
	var images=document.getElementById('image_counter').innerHTML;
	var rest=images-offset.innerHTML-10; //10: current pics
	var scroll_by=10;
	if(rest<10)
		scroll_by=rest;
	offset.innerHTML=parseInt(offset.innerHTML)+scroll_by;
	if(parseInt(offset.innerHTML)+10==images)
		document.getElementById('right').style.display='none';
	document.getElementById('left').style.display='block';
	
	new Effect.Move(element, { x: -(scroll_by*image_width), y: 0, mode: 'relative' }); 
	return false;
}
