function Slider()
{
    var pokretniElement;
    var brojElemenata;
    var brojElemenataStranica;
    var sliderWidth;
    var sliderHeight;
    var navTable;
    var maxPozicija;
    var trenutnaPozicija;
    var trenutnoSelektan;
    var trenutnaStranica;
    var navigatorID;

    this.napravi = function(id)
    {
        sliderWidth = this.width ? this.width : 600;
        sliderHeight = this.height ? this.height : 450;
        trenutnoSelektan = this.trenutnoSelektan ? this.trenutnoSelektan : 0;
        brojElemenata = this.brojElemenata ? this.brojElemenata : 5;
        navigatorID = this.navigatorID ? this.navigatorID : null;
    
        if(this.lijevoSaltanjeID)
            this.lijevoListener = document.getElementById(this.lijevoSaltanjeID);
            
        if(this.desnoSaltanjeID)
            this.desnoListener = document.getElementById(this.desnoSaltanjeID);
        
        if(document.all)
        {
            if(this.lijevoListener)
                this.lijevoListener.attachEvent("onclick",function(){kreni_lijevo()});
            if(this.desnoListener)
                this.desnoListener.attachEvent("onclick",function(){ kreni_desno()});
        }
        else
        {
            if(this.lijevoListener)
                this.lijevoListener.addEventListener("click",function(){kreni_lijevo()},false);
            if(this.desnoListener)
                this.desnoListener.addEventListener("click",function(){kreni_desno()},false);
        }
        
        if(navigatorID)
        {
            brojElemenataStranica = this.brojElemenataStranica ? this.brojElemenataStranica : brojElemenata;
            
            var tr = document.createElement("tr");
            
            trenutnaStranica =  Math.floor(trenutnoSelektan/(brojElemenataStranica-1));
            
            var granicaGore = (trenutnaStranica+1) * brojElemenataStranica - (trenutnaStranica + 1);
            var granicaDolje = (trenutnaStranica) * brojElemenataStranica - trenutnaStranica;
            
            for(var i=0;i<brojElemenata;i++)
            {
                var td = document.createElement("td");
                td.innerHTML = "&nbsp;";
                
                if(i==trenutnoSelektan)
                    td.className = "selektan";
                    
                if(i<granicaDolje || i>granicaGore)
                    td.style.display = "none";
                    
                tr.appendChild(td);
            }
            
            var tBody = document.createElement("tbody");
            tBody.appendChild(tr);
            
            navTable = document.createElement("table");
            navTable.className = "navTablica";
            navTable.cellSpacing = 10;
            navTable.appendChild(tBody);
            
            if(document.all)
            {
                navTable.attachEvent("onmouseover",function(){ info_hover_nutra(event)});
                navTable.attachEvent("onmouseout",function(){ info_hover_van(event)});
                navTable.attachEvent("onclick",function(){ kreni_bilokud(event)});
            }
            else
            {
                navTable.addEventListener("mouseover",function(event){ info_hover_nutra(event)},false);
                navTable.addEventListener("mouseout",function(event){ info_hover_van(event)},false);
                navTable.addEventListener("click",function(event){ kreni_bilokud(event)},false);
            }
            
            var sliderNavigator = document.getElementById(this.navigatorID);
            sliderNavigator.appendChild(navTable);
        }
        
        pokretniElement = document.getElementById(this.pokretniElementID);
        pokretniElement.style.display= "block";
        pokretniElement.style.position = "absolute";
        pokretniElement.style.left = -trenutnoSelektan * sliderWidth + "px";
        pokretniElement.style.width = sliderWidth*brojElemenata + "px";
        trenutnaPozicija = parseInt(pokretniElement.style.left);
        maxPozicija = parseInt(pokretniElement.style.width) - sliderWidth;
    
        var divSlider = document.createElement("div");
        divSlider.style.margin = "auto";
        divSlider.style.overflow = "hidden";
        divSlider.style.position = "relative";
        divSlider.style.width = sliderWidth + "px";
        divSlider.style.height = sliderHeight + "px";
        divSlider.appendChild(pokretniElement)
        
        var sliderSadrzaj = document.getElementById(id);
        sliderSadrzaj.appendChild(divSlider);
    }

    function ofarbaj_td(td)
    {
        var tdNiz = navTable.getElementsByTagName("td");

        for(i=0;i<tdNiz.length;i++)
            tdNiz[i].className = "";
                            
        td.className = "selektan";
    }

    //skrolanje
    var galerijaTijek = false;
    var timer;
    
    function kreni_bilokud(e)
    {
        var td = document.all ? e.srcElement : e.target;
        
        if(galerijaTijek || td.nodeName!="TD") 
            return;
            
        var gdje = td.cellIndex * -sliderWidth;
        
        if(document.all)
            gdje -= (brojElemenataStranica-1)*trenutnaStranica* sliderWidth;
        
        ofarbaj_td(td)
        navigator_promjenaStranice(td)
        
        if(gdje>trenutnaPozicija)
            galerijaTijek = "krecemLijevo";
        else
            galerijaTijek = "krecemDesno";
        
        trenutnaPozicija=gdje;
        
        galerija_scroll(trenutnaPozicija);
    }

    function kreni_lijevo()
    {
        if(galerijaTijek || pokretniElement.style.left=="0px")
            return;
        
        galerijaTijek = "krecemLijevo";

        trenutnaPozicija+=sliderWidth
        galerija_scroll(trenutnaPozicija);
        
        if(navTable)
        {
            var cellIndex = trenutnaPozicija/-sliderWidth;
            var td = navTable.rows[0].cells[cellIndex];
            
            ofarbaj_td(td);
            
            if(navTable.rows[0].cells[cellIndex].style.display=="none")
                td = navTable.rows[0].cells[cellIndex+1];
            
            navigator_promjenaStranice(td)
        }
    }
    function kreni_desno()
    {
        if(galerijaTijek || parseInt(pokretniElement.style.left)==-maxPozicija)
            return;
            
        galerijaTijek = "krecemDesno";
        
        trenutnaPozicija-=sliderWidth
        galerija_scroll(trenutnaPozicija);
        
        if(navTable)
        {
            var cellIndex = trenutnaPozicija/-sliderWidth;
            var td = navTable.rows[0].cells[cellIndex];
            
            ofarbaj_td(td);
            
            if(navTable.rows[0].cells[cellIndex].style.display=="none")
                td = navTable.rows[0].cells[cellIndex-1];
            
            navigator_promjenaStranice(td)
        }
    }
    function galerija_scroll(lokacija)
    {
        var lijevo  = parseInt(pokretniElement.style.left);
        var change = lokacija-lijevo;
        
        if(galerijaTijek=="krecemDesno")
            var total=lijevo+Math.floor((change/5));
        else
            var total=lijevo+Math.ceil((change/5));
        
        pokretniElement.style.left = total+'px';
     
        function c() {
            galerija_scroll(lokacija);
        }
        if(change==0) {
            clearTimeout(timer);
            galerijaTijek = false;
            return;
        }
        
        timer=setTimeout(c,40);
    }
    this.galerija_tijek = function()
    {
        return galerijaTijek;
    }
    //šaltanje navigatora na nove stranice
    function navigator_promjenaStranice(td)
    {
        var index = td.cellIndex;
        
        var blockDisplay = (document.all) ? "block" : "table-cell";
        
        if(!document.all)
        {
            if(index>0 && navTable.rows[0].cells[index-1].style.display=="none")
                index = index/(trenutnaStranica*(brojElemenataStranica-1)) - 1;
            else
                index = index/(trenutnaStranica+1);
        }
        
        var zadnjiElement = (navTable.rows[0].cells.length==(trenutnaStranica+1)*brojElemenataStranica - trenutnaStranica);
        
        if(index==(brojElemenataStranica-1) && !zadnjiElement)
        {
            for(var i=0;i<brojElemenataStranica-1;i++)
                navTable.rows[0].cells[i + trenutnaStranica*(brojElemenataStranica-1)].style.display = "none";
            
            trenutnaStranica++;
           
            for(var i=0;i<brojElemenataStranica;i++)
            {
                var tdTemp = navTable.rows[0].cells[i+trenutnaStranica*(brojElemenataStranica-1)];
            
                if(tdTemp)
                    tdTemp.style.display = blockDisplay;
            }
        }
        else if(index==0 && trenutnaStranica>0)
        {
            for(var i=1;i<brojElemenataStranica;i++)
            {
                var tdTemp = navTable.rows[0].cells[i+ trenutnaStranica*(brojElemenataStranica-1)];
            
                if(tdTemp) 
                    tdTemp.style.display = "none";
            }
            
            trenutnaStranica--;
           
            for(var i=0;i<brojElemenataStranica;i++)
                navTable.rows[0].cells[i + trenutnaStranica*(brojElemenataStranica-1)].style.display = blockDisplay;
        }
    }
    //skakanje info hovera
    var divHoverRel = null;

    function info_hover_van(e)
    {
        if(divHoverRel==null)
            return;
        
        var td = (document.all) ? e.srcElement : e.target;
        td.removeChild(divHoverRel);
        
        divHoverRel=null;
    }
    function info_hover_nutra(e)
    {
        var td = (document.all) ? e.srcElement : e.target;
        
        var cellIndex = td.cellIndex;

        if(document.all)
            cellIndex = cellIndex + trenutnaStranica*(brojElemenataStranica - 1);
        
        var divPopUp = document.getElementById(navigatorID+"PopUp" + cellIndex);
        
        if(td.nodeName!="TD" || td.className=="selektan" || divPopUp==null)
            return;

        var divHoverAbs  = document.createElement("div");
        divHoverAbs.style.position = "absolute";
        divHoverAbs.className = "navPopUpDiv";
        divHoverAbs.innerHTML = divPopUp.innerHTML;

        divHoverRel = document.createElement("div");
        divHoverRel.style.position = "relative";
        divHoverRel.appendChild(divHoverAbs)
        
        td.insertBefore(divHoverRel,td.childNodes[0]);
    }
}