var gallery_images=Array();
var galleryMoveStart=false;
var gallery_index=0;
var offsetMove = 5;
function galleryInit(){
	var el=document.getElementById('galleryFirst');
	el.onclick=new Function("galleryFirst()");
	el=document.getElementById('galleryNext');
	el.onclick=new Function("galleryNext()");
	el=document.getElementById('galleryPrev');
	el.onclick=new Function("galleryPrev()");
	el=document.getElementById('galleryLast');
	el.onclick=new Function("galleryLast()");
	
	el=document.getElementById('galleryScrollLeft');
	el.onmousedown=new Function("galleryStartMove(1);");
	el.onmouseup=new Function("galleryStopMove()");
	el=document.getElementById('galleryScrollRight');
	el.onmousedown=new Function("galleryStartMove(-1);");
	el.onmouseup=new Function("galleryStopMove()");
	
	gallery_images=document.getElementById('galleryBoxInside').getElementsByTagName('img');
	for(i=0;i<gallery_images.length;i++){
		gallery_images[i].onclick=new Function("galleryPreview(this);");
		if(i==0) galleryPreview(gallery_images[i]);
	}
}

function galleryPreview(img){
	var gallery_preview=document.getElementById('gallery_preview');
	gallery_preview.innerHTML='<img src="'+ img.name +'">';
	for(i=0;i<gallery_images.length;i++)
		if(gallery_images[i].name==img.name){
			gallery_index=i;
			break;
		}
	galleryUpdateCaption();
}

function galleryNext(){
	if((gallery_index+1)<gallery_images.length){
		gallery_index++;
		galleryPreview(gallery_images[gallery_index]);
	}
}

function galleryPrev(){
	if((gallery_index-1)>=0){
		gallery_index--;
		galleryPreview(gallery_images[gallery_index]);
	}
}

function galleryFirst(){
	gallery_index=0;
	galleryPreview(gallery_images[gallery_index]);
}

function galleryLast(){
	gallery_index=gallery_images.length-1;
	galleryPreview(gallery_images[gallery_index]);
}


function galleryUpdateCaption(){
	var gallery_caption=document.getElementById('gallery_caption');
	gallery_caption.innerHTML='' + (gallery_index+1) + ' di ' + gallery_images.length;
}

function DL_GetElementLeft(eElement)
{
    var nLeftPos = eElement.offsetLeft;          // initialize var to store calculations
    var eParElement = eElement.offsetParent;     // identify first offset parent element  
    while (eParElement != null)
    {                                            // move up through element hierarchy
        nLeftPos += eParElement.offsetLeft;      // appending left offset of each parent
        eParElement = eParElement.offsetParent;  // until no more offset parents exist
    }
    return nLeftPos;                             // return the number calculated
}

function galleryMove(dir){
	if(!galleryMoveStart) return;
	//var maxOffset=gallery_images[gallery_images.length-1].offsetLeft;
	var maxOffset=DL_GetElementLeft(gallery_images[gallery_images.length-1]);
	var divMove=document.getElementById('galleryBoxInside');
	curLeft=divMove.style.left.substring(0,divMove.style.left.length-2);
	if(dir>0){
		if((curLeft - offsetMove)<=-maxOffset){
			divMove.style.left=-maxOffset + 'px';
			galleryMoveStart=false;
		} else {
			divMove.style.left = (curLeft - offsetMove) + 'px';
			timerID=setTimeout('galleryMove('+ dir +')',10);
		}
	} else {
		if((curLeft + offsetMove)>=0){
			divMove.style.left='0px';
			galleryMoveStart=false;
		} else {
			divMove.style.left = (Number(curLeft) + offsetMove) + 'px';
			timerID=setTimeout('galleryMove('+ dir +')',10);
		}
	}
}

function galleryStartMove(dir){
	galleryMoveStart=true;
	galleryMove(dir);
}

function galleryStopMove(){
	galleryMoveStart=false;
}
window.onload=function(){galleryInit();};