// HScroll
// By Denis Korenic
// rework 2007/03/13 by Gordan Novoselec

function hscroll(viewportId,itemwidth,spacewidth,rightmargin,itemcount,aspeed,titleId,useimg){
   
    var title=document.getElementById(titleId);
    
    var viewportDiv=document.getElementById(viewportId);
    viewportDiv.scrollLeft=0;
    var itemWidth=itemwidth-spacewidth;
    var spaceWidth=spacewidth;
    var width=itemwidth*itemcount - spacewidth - rightmargin;
    var viewportwidth=viewportDiv.offsetWidth;
     
    var holderDiv=document.createElement("div")
    holderDiv.innerHTML=viewportDiv.innerHTML
    holderDiv.setAttribute('style','width:0px');
    holderDiv.id=(viewportId + '_holder');
    viewportDiv.innerHTML='';
    viewportDiv.appendChild(holderDiv);
    
    holderDiv=document.getElementById(viewportId + '_holder');
    holderDiv.style.width=(width + rightmargin) + 'px';
    //alert(holderDiv.style.width)
    
    if (!useimg){
    this.imgitems=holderDiv.getElementsByTagName("img");
    }
    
    this.items=itemcount;
    this.holderDiv=holderDiv;
     
    var viewportitems = parseInt((viewportwidth+spacewidth+rightmargin)/itemwidth);
    

    var currleftitem = 0;
    
    this.curritem=function(){return currleftitem+1};
    this.itemcount=function(){return itemcount}
    
    
    var maxleftitem = this.items-viewportitems;

    var currpos=0;
    var targetpos=0;
    
    viewportDiv.scrollLeft=0;
    
    if (this.imgitems) this.imgitems[0].src=this.imgitems[0].alt;

    this.moveRight=function(places){        
        if (places==null) places = 1;
        this.slide(Math.min(currleftitem+Math.abs(places), maxleftitem) - currleftitem);
        
        if (title && this.imgitems){
             var t=this.imgitems[currleftitem].title;
             if (t=''){
                title.style.display='none';
             }
             else
             {
                title.style.display='block';
                title.innerHTML=this.imgitems[currleftitem].title
             }
        }
    }
    
    this.moveLeft=function(places){
        if (places==null) places = 1; 
        this.slide(Math.max(currleftitem-Math.abs(places), 0) - currleftitem); 
        
        if (title && this.imgitems){
             var t=this.imgitems[currleftitem].title;
             if (t=''){
                title.style.display='none';
             }
             else
             {
                title.style.display='block';
                title.innerHTML=this.imgitems[currleftitem].title
             }
        }
    }
   
    this.moveTo=function(place){
        if (place!=null)
        this.slide(Math.max(0,Math.min(place, maxleftitem))-currleftitem);
        
    }


    this.slide=function(offset){
        if ((currleftitem+offset) <= maxleftitem && (currleftitem+offset) >= 0 && offset!=0){
            
            currleftitem+=offset;    
            
            if (this.imgitems){
                var img=new Image();
                img.onload=function(){
                    this.slika.src=this.src;
                    
                }
                
                        
                img.slika=this.imgitems[currleftitem];
                img.src=this.imgitems[currleftitem].alt;
            }
             
            targetpos=-(itemWidth+spaceWidth)*currleftitem;
            
            
            if (viewportDiv.slideint){window.clearInterval(viewportDiv.slideint);viewportDiv.slideint=null;}

                
                viewportDiv.slideint=window.setInterval(
                    function(){                               
                        if (currpos > targetpos) {
                            step = -Math.ceil(Math.sqrt(Math.abs(targetpos-currpos)*aspeed));
                        }
                        else if (currpos < targetpos){
                            step = Math.abs(Math.sqrt(Math.abs(targetpos-currpos)*aspeed));
                        }
                        
                        currpos+=step;
                        
                        
                        if ((step<0 && currpos<targetpos) || (step>0 && currpos>targetpos)) { 
                            currpos=targetpos;             
                        }
                        
                        viewportDiv.scrollLeft = -currpos;
                        
                        if (currpos==targetpos){
                            window.clearInterval(viewportDiv.slideint);
                            viewportDiv.slideint = null;
                        }
                    }            
                    ,40
                );
           
            }
            
            
    }
}