/**
*   Dependency: LBP.Dropdownlist, tip
*   Updated: tested
*/
LBP.ScrollSlider = new Class({
    Implements: [Events, Options],
    options: {
        total: 0,
        perSlide: 3,
        startPage: 2,
        mode: 'vertical',
        
        prefix: 'pl-',
        wrapper: '',
        dump: '',
        container: ''
    },
    initialize: function(container, wrapper, options){
        if(!$(container) || !$(wrapper)) return;
        this.container = $(container);
        this.wrapper = $(wrapper);
        this.wrapper.empty();        
        this.dump = $(this.options.dump);
        this.setOptions(options);
        this.build();
        this.attach();
        this.container.store('hasSlider', true);
        this.current = 1;
        this.slideTo(this.options.startPage);
        this.container.addEvent('onReload', this.trash.bind(this));
    },
    trash: function() {
        //destroy list
        var selectList = this.dropdownSel.retrieve('selectList');
        selectList.dispose();
        var selectBox = this.dropdownSel.retrieve('selectBox');
        selectBox.dispose();
        this.dump.empty();
        this.container.store('hasSlider', false);
        this.container.removeEvent('onReload', this.trash.bind(this));
    },
    attach: function() {
        this.select = new LBP.Dropdownlists({  wrapperName: 'pl-dropsel', selectListWidthDiff: 0, injectTo: 'wrapper', itemClick: this.clickHandle.bind(this), reverseEgr: true});
        this.prevBtn.addEvents({
            'mouseenter': function(event){
                event.stopPropagation();
                this.onHover(this.prevBtn);
            }.bind(this),
            'mouseleave': function(event){
                event.stopPropagation();
                this.onOut(this.prevBtn);
            }.bind(this),
            'click': function(event){
                event.stopPropagation();
                this.slideTo(this.prev);
            }.bind(this)
        });
        this.nextBtn.addEvents({
            'mouseenter': function(event){
                event.stopPropagation();
                this.onHover(this.nextBtn);
            }.bind(this),
            'mouseleave': function(event){
                event.stopPropagation();
                this.onOut(this.nextBtn);
            }.bind(this),
            'click': function(event){
                event.stopPropagation();
                this.slideTo(this.next);
            }.bind(this)
        });
    },
    slideTo: function(page) {
        if(this.current == page) return;
        var num = (page-1)*this.options.perSlide + 1;
        if(num > this.options.total) return;
        if($(this.options.wrapper+'-entry-'+num)) {
            this.currentEl = $(this.options.wrapper+'-entry-'+num);
            this.scrollFx.toElement(this.currentEl);
            this.current = page;
            this.calculate();
            this.updateButton();
            this.dropdownSel.fireEvent('onReverse',[this.dropdownSel, page]);
        }
    },
    updateButton: function() {
        ['prev','next'].each(function(btn){
            if(this[btn] == 0) {
                if(!this[btn+'Btn'].hasClass('inactive')) this[btn+'Btn'].addClass('inactive')
            } else {
                if(this[btn+'Btn'].hasClass('inactive')) this[btn+'Btn'].removeClass('inactive')
            }
            this[btn+'Btn'].set('html', this[btn]+'');
        }.bind(this));
    },
    onHover: function(item) {
        item.addClass('hover');
    },
    onOut: function(item) {
        if(item.hasClass('hover')) item.removeClass('hover');
    },
    clickHandle:function(selectItem, selectBox, selectList) {
        this.slideTo(selectItem.get('id').toInt());
    },
    calculate: function() {
        this.prev = this.current - 1;
        this.next = (this.current != this.total)? (this.current+1) : 0;
    },
    build: function() {
        this.scrollFx = new Fx.Scroll(this.container, { wheelStops: false});
        this.options.total = this.options.total.toInt();
        
        this.options.startPage = this.options.startPage.toInt();
        this.options.perSlide = this.options.perSlide.toInt();
        this.total = (this.options.total / this.options.perSlide).toInt();
        if((this.total * this.options.perSlide) < this.options.total) { 
            this.total = this.total+1;
        }
        this.current = (this.options.startPage < this.total)? this.options.startPage: this.total;
        this.calculate();        
        this.prevBtn = new Element("a",{ 'class': this.options.prefix+'prev', 'href': 'javascript:void(0);', 'html': this.prev+''});
        this.nextBtn = new Element("a",{ 'class': this.options.prefix+'next', 'href': 'javascript:void(0);', 'html': this.next+''});
        this.plText = new Element("span",{ 'class': this.options.prefix+'text pkg '+this.options.prefix+ 'jump-drop'});
        this.dropdownSel = new Element("select");
        for(var i=1;i< this.current; i++) {
            this.dropdownSel.adopt(new Element("option", { 'value': i, 'html': i+''}));
        }
        this.dropdownSel.adopt(new Element("option", { 'value': this.current, 'html': this.current+'', selected:'selected'}));
        for(var i=this.current+1;i<= this.total; i++) {
            this.dropdownSel.adopt(new Element("option", { 'value': i, 'html': i+''}));
        }
        this.plText.adopt(new Element('div',{ 'class': this.options.prefix+'dropsel', 'toWidth': 18 }).adopt(this.dropdownSel));
        this.wrapper.adopt(this.prevBtn, this.plText, this.nextBtn);
        this.updateButton();
    }
});