

var CoolScroll = Class.create({
	
	initialize: function(wrapper, viewport, strip) {
		this.wrapper = $(wrapper);
		this.viewport = $(viewport);
		this.strip = $(strip);
		this.items = this.strip.select('li.select-item');
		this.selectedIndex = 0;
		this.elementHeight = 95;
		this.postitionFudgeFactor = 24;
		this.maxIndex = this.items.length - 2;
		this.prevButton = $('product-select-prev');
		this.nextButton = $('product-select-next');
		this.prevButton.observe('click', this.prev.bind(this));
		this.nextButton.observe('click', this.next.bind(this));
		var selected = this.items.find(function(el) {return el.hasClassName('selected')});
		var startIndex = Math.max(0, this.items.indexOf(selected));
		this.select(startIndex);
	},
	
	
	prev: function() {
		this.select(this.selectedIndex - 1);
	},
	
	next: function() {
		this.select(this.selectedIndex + 1);
	},
	
	select: function(index) {
		this.setIndex(index);
		var offset = -(this.selectedIndex) * this.elementHeight;
		offset += this.postitionFudgeFactor; 
		new Effect.Morph(this.strip, {
			style: {
				top: offset + 'px'
			},
			duration: 0.4
		});
	},
	
	setIndex: function(index) {
		index = Math.max(index, 1);
		this.selectedIndex = Math.min(this.maxIndex, index);
	}
	
});