// 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
                );

        }


    }
}