//Depends:
//BOLI.Core


var BOLI = BOLI || {};

BOLI.ItemScroller = BOLI.ItemScroller || function (attributes) {
    var This = this;

    //attributes

    this.itemClassName = "boli-itemscroller";
    this.itemWidth;
    this.itemHeight;
    this.numberOfItemsToDisplay = 3;
    this.scrollDirection = 'vertical';
    this.margin = '20';
    this.gapSize = '10';
    this.timer;
    this.expanders = new Array;
    this.scrollEnabled = true;
    this.interval = 4000;
    //methods


    //events

    this.container = $('<div style="overflow:hidden; position:relative; " />');
    this.offsetContainer = $('<div style="width:2000px; position:absolute" />')

    this.render = function () {
        this.items = $('.' + this.itemClassName);
        this.itemWidth = $(this.items[0]).outerWidth();
        this.itemHeight = $(this.items[0]).outerHeight();
        this.virtualItemCount = this.items.length + (this.numberOfItemsToDisplay * 2) - 1;
        if (this.scrollDirection == 'vertical') {
            this.visibleSize = ((this.itemHeight * this.numberOfItemsToDisplay) + (this.gapSize * (this.numberOfItemsToDisplay - 1)));
            this.container.css({ height: this.visibleSize + 'px' });
            this.container.css({ width: this.itemWidth + 'px' })
            this.offsetContainer.css({ height: ((this.itemHeight * this.virtualItemCount) + (this.gapSize * this.virtualItemCount)) + 'px' })
            this.allOrigItemSize = (this.itemHeight * this.items.length) + (this.gapSize * this.items.length)
            this.allItemSize = (this.itemHeight * this.virtualItemCount) + (this.gapSize * this.virtualItemCount)

        } else {
            this.visibleSize = ((this.itemWidth * this.numberOfItemsToDisplay) + (this.gapSize * (this.numberOfItemsToDisplay - 1)))
            this.container.css({ height: this.itemHeight + 'px' });
            this.container.css({ width: this.visibleSize + 'px' })
            this.offsetContainer.css({ width: ((this.itemWidth * this.virtualItemCount) + (this.gapSize * this.virtualItemCount)) + 'px' })
            this.allOrigItemSize = (this.itemWidth * this.items.length) + (this.gapSize * this.items.length)
            this.allItemSize = (this.itemWidth * this.virtualItemCount) + (this.gapSize * this.virtualItemCount)
        }

        for (var i = 0; i < this.items.length; i++) {
            if (this.scrollDirection == 'horizontal') {
                $(this.items[i]).css('float', 'left')
                $(this.items[i]).css('marginRight', this.gapSize + 'px')
            }
            else {
                $(this.items[i]).css('marginBottom', this.gapSize + 'px')
            }
            this.offsetContainer.append($(this.items[i]).show());
            this.addExpander($(this.items[i]));


        }
        for (var i = 0; i < this.virtualItemCount - this.items.length; i++) {
            var obj = $(this.items[i]).clone();
            this.offsetContainer.append(obj);
            this.addExpander(obj);
        }

        this.container.append(this.offsetContainer);
        this.container.mouseenter(function () { This.scrollEnabled = false; clearTimeout(This.timer) })
        this.container.mouseleave(function () { This.scrollEnabled = true; clearTimeout(This.timer); This.timer = setTimeout(function () { This.startMove() }, This.interval) })
        This.timer = setTimeout(function () { This.startMove() }, This.interval)
        return this.container;
    }

    this.addExpander = function (obj) {
        var ie = new itemExpander;
        this.expanders.push(ie)
        ie.targetControl = obj;
        ie.onResize = function () {
            var num = 0;
            var active = false;
            for (var u = 0; u < This.expanders.length; u++) {
                num += This.expanders[u].currentSize;
                if (This.expanders[u].currentSize != This.expanders[u].size) {
                    active = true;
                }
            }
            if (!active) This.resetPosition();
            num += This.virtualItemCount * This.gapSize;
            This.container.css({ height: (This.visibleSize + (num - This.allItemSize)) + 'px' });


        }
        ie.init();
    }

    this.setOffsetPosition = function (pos) {
        if (This.scrollDirection == 'horizontal') {
            This.offsetContainer.css('left', pos + 'px');
        } else {
            This.offsetContainer.css('top', pos + 'px');
        }
    }

    this.startMove = function () {
        var oCPosition = this.offsetContainer.position();
        if (this.scrollDirection == 'horizontal') {
            this.startPos = oCPosition.left;
            this.endPos = this.startPos - this.container.width() - this.gapSize;
        } else {
            this.startPos = oCPosition.top;
            this.endPos = this.startPos - this.container.height() - this.gapSize;
        }

        var mover = new BOLI.Core.ObjectMover;
        mover.startX = this.startPos;
        mover.endX = this.endPos;
        mover.onMove = function (pos) {
            This.setOffsetPosition(pos.X);
            //$('#test').append('<div>' + pos.X + '</div>')
        }
        mover.onStop = function () {
            if (This.scrollEnabled) {
                clearTimeout(This.timer);
                This.timer = setTimeout(function () { This.startMove() }, This.interval)
                //$('body').append('<div>' + (This.allOrigItemSize + This.startPos - This.visibleSize - This.gapSize) + '</div>')
                This.resetPosition()
            }
        }
        mover.move();
    }

    this.resetPosition = function () {
        if (this.allOrigItemSize + this.startPos - this.visibleSize - this.gapSize <= 0) {
            this.setOffsetPosition(this.allOrigItemSize + this.startPos - this.visibleSize - this.gapSize);
        }

    }
}

var itemExpander = function () {
    var This = this;
    this.targetControl;
    this.size;
    this.maxSize;
    this.onResize = new Function;
    this.currentSize;
    var mover = new BOLI.Core.ObjectMover;
    this.init = function () {
        if (this.targetControl != null) {
            var clone = this.targetControl.clone()
            clone.appendTo('body');
            this.size = this.currentSize = clone.height();
            clone.css('height', 'auto');
            this.maxSize = clone.height();
            clone.remove();
            this.targetControl.mouseover(function (e) { This.resize(); e.preventDefault(); })
            this.targetControl.mouseout(function (e) { This.revert(); e.preventDefault(); })
            mover.onMove = function (pos) {
                This.targetControl.css('height', pos.X + 'px');
                This.currentSize = pos.X;
                This.onResize();
            }
        }
    }
    this.resize = function () {
        mover.reset();
        mover.startX = this.targetControl.height();
        mover.endX = this.maxSize;
        mover.move();
    }
    this.revert = function () {
        mover.reset();
        mover.startX = this.targetControl.height();
        mover.endX = this.size;
        mover.move();
    }
}