/**
 * Created by Komma-mediadesign.
 * User: Mike
 * Date: 3/13/13
 * Time: 3:11 PM
 */

function VerticalGridSlider(slider){

    var t = this;

    /*
     * @property gridSize;
     * The slider slides on a grid
     */
    t.gridSize = 132;

    /*
     * @property viewport
     * width of the viewport
     */
    t.viewport = 295;

    /*
     * @property slider
     */
    t.slider = slider;

    /*
     * @property numItems
     */
    t.numItems = 0;

    /*
     * @property itemsInView
     */
    t.itemsInView = 0;

    /*
     * @property hiddenTop
     */
    t.hiddenTop = 0;

    /*
     * @property hiddenBottom
     */
    t.hiddenBottom = 0;

    /*
     * @property index
     */
    t.index = 0;


    t.btnDown = '#scrollDown';

    t.btnUp = '#scrollUp';

    this.init = function()
    {
        // set num items
        t.numItems = ($('li',t.slider).size());

        $(t.btnUp).css({ cursor : 'default' });
        if(t.numItems < 3)
        {
            $(t.btnDown).css({ cursor : 'default' });
            $('.arrow',t.btnDown).css({ opacity : 0 });
        }

        // set slider size
        var h = t.gridSize * t.numItems;
        $(t.slider).css({ height : h+'px' });

        // set Items in view
        t.itemsInView = Math.floor(t.viewport / t.gridSize);

        // set Items in view
        t.hiddenBottom = t.numItems - t.itemsInView;

        // set on click functions
        $(t.slider+' li').each(function(index)
        {
            /*$(this).click(function(e){
                e.preventDefault();
                var a = $('a',this);
                $('body').append('<div id="jsLoad"></div>');
                $('#jsLoad').load('/mvc/controllers/c_gridSlider.php?index='+index+'&hiddenTop='+ t.hiddenTop+'&hiddenBottom='+ t.hiddenBottom+'&offsetTop='+$(document).scrollTop(), function(){
                    window.location.href = $(a).attr('href');
                });
            });*/
        });

        // set on click buttons
        $(t.btnDown).click(function(e){
            t.slide(1);
        });
        $(t.btnUp).click(function(e){
            t.slide(-1);
        });
    };

    this.setGridSize = function(size)
    {
        t.gridSize = parseInt(size);
    };

    this.setViewport = function(size)
    {
        t.gridSize = parseInt(size);
    };

    this.setButtons = function(up,down)
    {
        t.btnDown = parseInt(down);
        t.btnUp = parseInt(up);
    };

    this.slide = function(dir)
    {
        if(t.numItems > 2)
        {
            var top = null;
            var steps = 1;
            var inViewport = 2;

            /*
             * If over half of the viewport
             */
            if(dir == 1)
            {
                if((t.hiddenTop + inViewport) != t.numItems)
                {
                    t.hiddenTop += steps;
                    top = t.hiddenTop * t.gridSize * -1;
                    $(t.slider).stop().animate({ top : top+'px' },500);
                }
            }
            if(dir == -1)
            {
                if(t.hiddenTop != 0)
                {
                    t.hiddenTop -= steps;
                    top = t.hiddenTop * t.gridSize * -1;
                    $(t.slider).stop().animate({ top : top+'px' },500);
                }
            }

            if(t.hiddenTop <= 0)
            {
                $(t.btnUp).css({ cursor : 'default' });
                $('.arrow',t.btnUp).stop().animate({ opacity: 0},200);
            }
            else
            {
                $(t.btnUp).css({ cursor : 'pointer' });
                $('.arrow',t.btnUp).stop().animate({ opacity: 1 },200);
            }

            if((t.hiddenTop + inViewport) >= t.numItems)
            {
                $(t.btnDown).css({ cursor : 'default' });
                $('.arrow',t.btnDown).stop().animate({ opacity: 0 },200);
            }
            else
            {
                $(t.btnDown).css({ cursor : 'pointer' });
                $('.arrow',t.btnDown).stop().animate({ opacity: 1 },200);
            }
        }
    };
}