// Mootools 1.2 based scrolling buttons
// (c)2010 Standupweb

// uses mootools core + Fx.Scroll from mootools more
var SwScrollControl = new Class({
    Implements: Options,
    options: {
        speed: 400,									// scrolling speed - default value: 400
        scrollStep: 160,								// number of pixel scrolled every time the user click on a scrolling button - default value: 80
        buttonSize: 12,								// size of the scrolling buttons in pixel - default value: 17
        scrollUpButtonClass: 'swScrollUp',			// css class describing how the 'up' scroll button should look like - default value: 'swScrollUp'
        scrollDownButtonClass: 'swScrollDown',		// css class describing how the 'down' scroll button should look like - default value: 'swScrollDown'
		marginRight: 0,								// number of pixels to be put on the right of the scroll buttons - default value: 0
		marginBottom: 0								// number of pixels to be put on the left of the scroll buttons - default value: 0
    },
    initialize: function(swScrollId, options){
        this.setOptions(options);
        var scrollDiv = $(swScrollId);
		if (!scrollDiv) {return;}
        var wrap = new Element('div', {'styles': {'position':'relative'}});
        wrap.wraps(scrollDiv);
		if (scrollDiv.getScrollSize().y <= (wrap.getSize().y + 5)) {
			return;
		}
        var scrollUpEl = new Element('div', {
            'class': this.options.scrollUpButtonClass,
            'styles': {
                'cursor': 'pointer',
                'display': 'block',
                'position': 'absolute',
                'top': 0,
                'width': this.options.buttonSize,
                'height': this.options.buttonSize
            }
        });
        var scrollDownEl = new Element('div', {
            'class': this.options.scrollDownButtonClass,
            'styles': {
                'cursor': 'pointer',
                'display': 'block',
                'position': 'absolute',
                'top': this.options.buttonSize,
                'width': this.options.buttonSize,
                'height': this.options.buttonSize
            }
        });
        wrap.grab(scrollUpEl);
        wrap.grab(scrollDownEl);
        
        this.myFxDown = new Fx.Scroll(scrollDiv, {
            duration: this.options.speed,
            offset: {
                'x': 0,
                'y': this.options.scrollStep
            }
        });
        scrollDownEl.addEvent('click', function(){
            this.myFxDown.start();
        }.bind(this));
        
        this.myFxUp = new Fx.Scroll(scrollDiv, {
            duration: this.options.speed,
            offset: {
                'x': 0,
                'y': -this.options.scrollStep
            }
        });
        scrollUpEl.addEvent('click', function(){
            this.myFxUp.start();
        }.bind(this));
    }
});