function stopEvent(e)
{
    try {
        var e = getEvent(e);
        var src = getTarget(e);
        e.cancelBubble = true;
        e.returnValue = false;
        if (e.preventDefault) {
            e.preventDefault();
        }
        if (e.stopPropagation) {
            e.stopPropagation();
        }
    } catch(e) {}
}

function getEvent(e)
{
    return e || window.event;
}

function getTarget(e)
{
    return e.target || e.srcElement;
}


var Collection = {

    wrap: null,
    wrapContent: null,
    goLeft: null,
    goRight: null,

    collectionWidth: 0,

    aLoadedImages: [],
    iImagesCountToLoad: 0,
    iImagesCountLoaded: 0,

    iImageLoaderInterval: null,

    left: 0,
    right: 0,

    reel: 0,

    timer: 0,
    step: 1,

    intervalMs: 60,
    hideActiveArrow: 0,

    loadImages: function()
    {
        var bLoaded = true;
        var z = 0;
        var aTmpImages = [];

        if (!arguments.callee.done) {

            //Collection.wrap =

            //console.log(Collection.wrap==null);

            var  titles = Collection.wrap.getElementsByTagName('li');
            for (var i = 0; i < titles.length; i++) {
                if (titles[i].className != 'scroll-nav') {
                    z++;

                    aTmpImages[z] = new Image();
                    aTmpImages[z].src = titles[i].getElementsByTagName('input')[0].value;

                    if (aTmpImages[z].complete) {
                        Collection.iImagesCountLoaded++;
                    } else {
                        aTmpImages[z].onload = function()
                        {
                            Collection.iImagesCountLoaded++;
                        };
                        aTmpImages[z].onabort = function()
                        {
                            Collection.iImagesCountLoaded++;
                        };
                        aTmpImages[z].onerror = function()
                        {
                            Collection.iImagesCountLoaded++;
                        };
                    }
                }
            }
            Collection.iImagesCountToLoad = z;
        }

        arguments.callee.done = true;

        if (Collection.iImagesCountLoaded != Collection.iImagesCountToLoad) {
            bLoaded = false;
        }

        if (bLoaded) {
            clearInterval(Collection.iImageLoaderInterval);
            Collection.initOver();
        }
    },

    setTitles: function()
    {

        var titles = Collection.wrap.getElementsByTagName('li');

        for (var i = 0; i < titles.length; i++) {
            if (titles[i].className != 'scroll-nav') {
                titles[i].onmouseover = function(e)
                {
                    var oAltDiv = this.getElementsByTagName('div')[0];
                    var oAltImage = this.getElementsByTagName('img')[0];

                    oAltDiv.style.zIndex = '999';
                    oAltImage.src = this.getElementsByTagName('input')[0].value;

                    oAltDiv.innerHTML = '<span>' + oAltImage.alt + '</span>';

                    var sImageWidth = oAltImage.offsetWidth;
                    var sAltWidth = oAltDiv.firstChild.offsetWidth;

                    if (sAltWidth > sImageWidth) {
                        oAltDiv.style.left = '-' + ((sAltWidth - sImageWidth) / 2) + 'px';
                    } else {
                        oAltDiv.style.textAlign = 'center';
                    }

                    oAltDiv.innerHTML = oAltImage.alt;
                };

                titles[i].onmouseout = function(e)
                {
                    this.getElementsByTagName('div')[0].style.textAlign = 'left';
                    this.getElementsByTagName('img')[0].src = this.getElementsByTagName('input')[1].value;
                    this.getElementsByTagName('div')[0].style.zIndex = '1';
                    this.getElementsByTagName('div')[0].innerHTML = '<br />';
                };
            }
        }

    },

    setCollectionWidth: function()
    {
        var images = Collection.wrap.getElementsByTagName('img');
        for (var i = 0; i < images.length; i++) {
            Collection.collectionWidth += images[i].offsetWidth;
        }
    },

    resizeWidth: function()
    {
        Collection.updateInterval();
        Collection.reel = Collection.collectionWidth - $$('collection').offsetWidth;
        Collection.unsetMove();
        Collection.setMove();
    },

    initOver: function()
    {
        Collection.setTitles();

        Collection.wrapContent = $$('wrap-content');
        Collection.goRight = $$('collection-go-right');
        Collection.goLeft = $$('collection-go-left');
        Collection.setCollectionWidth();
        addEvent(window, 'resize', Collection.resizeWidth);
        Collection.resizeWidth();
    },

    init: function()
    {
        Collection.wrap = $$('wrap');
        if(Collection.wrap!=null)
            Collection.iImageLoaderInterval = setInterval(Collection.loadImages, 10);
    },

    unsetMove: function()
    {
        Collection.goLeft.className = 'right-arrow-none';
        Collection.goRight.className = 'left-arrow-none';
        Collection.wrapContent.style.left = '0px';
        removeEvent(Collection.goLeft, 'mouseover', Collection.goLeftOver);
        removeEvent(Collection.goLeft, 'mouseout', Collection.goLeftOut);
        removeEvent(Collection.goRight, 'mouseover', Collection.goRightOver);
        removeEvent(Collection.goRight, 'mouseout', Collection.goRightOut);
    },

    goLeftOver: function()
    {
        if (Collection.left != 1) {
            Collection.goLeft.className = 'right-arrow';
            Collection.updateInterval();
            Collection.moveLeft();
        } else {
            Collection.goLeft.className = 'right-arrow-none';
        }
        if (Collection.reel > 0) {
            Collection.goRight.className = 'left-arrow-passive';
        }
    },

    goLeftOut: function()
    {
        if (Collection.left != 0) {
            Collection.goLeft.className = 'right-arrow-passive';
            Collection.updateInterval();
        } else {
            Collection.goLeft.className = 'right-arrow-none';
        }
    },

    goRightOver: function()
    {
        if (Collection.right != 1) {
            Collection.goRight.className = 'left-arrow';
            Collection.updateInterval();
            Collection.moveRight();
        } else {
            Collection.goRight.className = 'left-arrow-passive';
        }
        if (Collection.reel > 0) {
            Collection.goLeft.className = 'right-arrow-passive';
        }
    },

    goRightOut: function()
    {
        if (Collection.right != 0) {
            Collection.goRight.className = 'left-arrow-passive';
            Collection.updateInterval();
        } else {
            Collection.goRight.className = 'left-arrow-none';
        }
    },

    setMove: function()
    {
        if (Collection.reel > 0) {
            Collection.goLeft.className = 'right-arrow-passive';
            addEvent(Collection.goLeft, 'mouseover', Collection.goLeftOver);
            addEvent(Collection.goLeft, 'mouseout', Collection.goLeftOut);
            addEvent(Collection.goRight, 'mouseover', Collection.goRightOver);
            addEvent(Collection.goRight, 'mouseout', Collection.goRightOut);
        }
    },

    updateInterval: function()
    {
        if (Collection.timer != 0) {
            clearInterval(Collection.timer);
        }
        Collection.step = 1;
        Collection.left = 0;
        Collection.right = 0;
    },

    moveLeft: function()
    {
        var cur = Collection.getAbsCurrentOffset();
        if (cur != Collection.reel) {
            Collection.left = 1;
            Collection.timer = setInterval(Collection.doLeft, Collection.intervalMs);
        } else {
            Collection.goLeft.className = 'right-arrow-none';
        }
    },

    doLeft: function()
    {
        var cur = Collection.getAbsCurrentOffset();
        Collection.step++;
        if (cur <= (Collection.reel - Collection.step)) {
            Collection.wrapContent.style.left = - (cur + Collection.step) + 'px';
        } else {//if (leftPos > 0 && leftPos != cur) {
            Collection.wrapContent.style.left = - (Collection.reel) + 'px';
            Collection.goLeft.className = 'right-arrow-none';
            Collection.updateInterval();
        }

    },

    moveRight: function()
    {
        var cur = Collection.getCurrentOffset();
        if (cur != 0) {
            Collection.right = 1;
            Collection.timer = setInterval(Collection.doRight, Collection.intervalMs);
        } else {
            Collection.goRight.className = 'left-arrow-none';
        }
    },

    doRight: function()
    {
        var cur = Collection.getCurrentOffset();
        Collection.step++;
        if (cur <= - (Collection.step)) {
            Collection.wrapContent.style.left = + (cur + Collection.step) + 'px';
        } else {//if (cur != 0) {
            Collection.wrapContent.style.left = '0px';
            Collection.goRight.className = 'left-arrow-none';
            Collection.updateInterval();
        }
    },

    getCurrentOffset: function()
    {
        return parseInt(Collection.wrapContent.style.left);
    },

    getAbsCurrentOffset: function()
    {
        return Math.abs(parseInt(Collection.wrapContent.style.left));
    }
}