var Scrollbar = new Class({

	options : {
		mode : 'vertical',
                sizeFixer : 20
		},
		
	initialize: function(element, containerHeight, bar, slider, options){
		this.setOptions(options);
		this.element = $(element);
		this.container = new Element('div');
                this.container.setStyles({
				'position' : 'relative',
				'height' : containerHeight + 'px',
				'overflow' : 'hidden',
                                'margin' : 0
			});
		this.container.injectBefore(element);
		this.container.adopt(element);
		this.prop = '';
		var elSize, conSize;
		if(this.options.mode == 'vertical'){
			this.prop = 'margin-top';
			elSize = this.element.getSize().scrollSize.y + this.options.sizeFixer;
			
		}else{
			this.prop = 'margin-left';
			elSize = this.element.getSize().scrollSize.x + this.options.sizeFixer;
			
		}
		var diff = elSize - containerHeight
		var perShown = containerHeight / (elSize / 100);
		if(perShown < 5) perShown = 5;
                if(perShown >= 100) $(bar).setStyle('display', 'none');
		$(slider).setStyle('height', perShown + '%');
		this.slider = new Slider(bar, slider, {
			mode:this.options.mode, 
			steps:diff,
			onChange:this.scrollElement.bind(this)
		});
	},
	
	scrollElement: function(step){
		step = step - (step * 2);
		this.element.setStyle(this.prop, step + 'px');
	}
});

Scrollbar.implement(new Options);