var ScrollBar = new Class({

		Implements: [Events, Options],

		options: {
			maxThumbSize: 10,
			wheel: 8
		},

		initialize: function(contentscroll, track, thumb, options){
			this.setOptions(options);

			this.contentscroll = $(contentscroll);
			this.track = $(track);
			this.thumb = $(thumb);

			this.bound = {
				'start': this.start.bind(this),
				'end': this.end.bind(this),
				'drag': this.drag.bind(this),
				'wheel': this.wheel.bind(this),
				'page': this.page.bind(this)
			};

			this.position = {};
			this.mouse = {};
			this.update();
			this.attach();
		},

		update: function(){

			this.contentscrollSize = this.contentscroll.offsetHeight;
			this.contentscrollScrollSize = this.contentscroll.scrollHeight;
			this.trackSize = this.track.offsetHeight;

			this.contentscrollRatio = this.contentscrollSize / this.contentscrollScrollSize;

			this.thumbSize = (this.trackSize * this.contentscrollRatio).limit(this.options.maxThumbSize, this.trackSize);

			this.scrollRatio = this.contentscrollScrollSize / this.trackSize;

			this.thumb.setStyle('height', this.thumbSize);

			this.updateThumbFromcontentscrollScroll();
			this.updatecontentscrollFromThumbPosition();
		},

		updatecontentscrollFromThumbPosition: function(){
			this.contentscroll.scrollTop = this.position.now * this.scrollRatio;
		},

		updateThumbFromcontentscrollScroll: function(){
			this.position.now = (this.contentscroll.scrollTop / this.scrollRatio).limit(0, (this.trackSize - this.thumbSize));
			this.thumb.setStyle('top', this.position.now);
		},

		attach: function(){
			this.thumb.addEvent('mousedown', this.bound.start);
			if (this.options.wheel) this.contentscroll.addEvent('mousewheel', this.bound.wheel);
			this.track.addEvent('mouseup', this.bound.page);
		},

		wheel: function(event){
			this.contentscroll.scrollTop -= event.wheel * this.options.wheel;
			this.updateThumbFromcontentscrollScroll();
			event.stop();
		},

		page: function(event){
			if (event.page.y > this.thumb.getPosition().y) this.contentscroll.scrollTop += this.contentscroll.offsetHeight;
			else this.contentscroll.scrollTop -= this.contentscroll.offsetHeight;
			this.updateThumbFromcontentscrollScroll();
			event.stop();
		},

		start: function(event){
			this.mouse.start = event.page.y;
			this.position.start = this.thumb.getStyle('top').toInt();
			document.addEvent('mousemove', this.bound.drag);
			document.addEvent('mouseup', this.bound.end);
			this.thumb.addEvent('mouseup', this.bound.end);
			event.stop();
		},

		end: function(event){
			document.removeEvent('mousemove', this.bound.drag);
			document.removeEvent('mouseup', this.bound.end);
			this.thumb.removeEvent('mouseup', this.bound.end);
			event.stop();
		},

		drag: function(event){
			this.mouse.now = event.page.y;
			this.position.now = (this.position.start + (this.mouse.now - this.mouse.start)).limit(0, (this.trackSize - this.thumbSize));
			this.updatecontentscrollFromThumbPosition();
			this.updateThumbFromcontentscrollScroll();
			event.stop();
		}

	});