var SideRoller = new Class({
	initialize: function(element, options) {
		this.element = $(element);
		this.options = options;
		this.children = this.element.getFirst().getChildren();
		this.buttonRight = $(this.options.right);
		this.buttonLeft = $(this.options.left);
		this.currentPosition = 0;
		if (this.children.length > this.options.visibleChildren) {
			this.buttonRight.show();
			this.buttonRight.onclick = this.scrollRight.bindWithEvent(this);
			this.buttonLeft.show();
			this.buttonLeft.onclick = this.scrollLeft.bindWithEvent(this);	
			this.update();
		}
	},
	isAtFirst: function() {
		return this.currentPosition == 0;
	}, 
	isAtLast: function() {
		return this.currentPosition + this.options.visibleChildren >= this.children.length;
	}, 
	update: function() {
		if (this.isAtFirst()) {
			this.buttonLeft.addClass('disabled').addClass('disabled-previous');
		} else {
			this.buttonLeft.removeClass('disabled').removeClass('disabled-previous');
		} 
		if (this.isAtLast()) {
			this.buttonRight.addClass('disabled').addClass('disabled-next');
		} else {
			this.buttonRight.removeClass('disabled').removeClass('disabled-next');
		}
		var scroller = this.element.getFirst();
		var start = parseInt(scroller.getStyle('left'));
		var end = -this.currentPosition * this.options.positionSize;
		if (start != end)
			new Fx.Style(this.element.getFirst(), 'left').start(start, end);
	},
	scrollRight: function(e){
		if (!this.isAtLast()) {
			this.currentPosition++;
			this.update();
		}
		return false;
	},
	scrollLeft: function(e){
		if (!this.isAtFirst()) {
			this.currentPosition--;
			this.update();
		}
		return false;
	}
});
window.onDomReady(function() {
    if ($('categories-secondary'))
		  new SideRoller($('categories-secondary'), {right: 'stories-next', left: 'stories-prev', visibleChildren: 5, positionSize: 145});
});