var CsScrollerWrapper = function() {
	return {
	inner: null,
	items: null,
	vertical: false,
	itemWidth: 0,
	itemHeight: 0,
	scaleOrigWidth: 0,
	scaleOrigHeight: 0,
	itemsVisible: 0,
	currentItem: 0,
	initialize: function() {
		Element.extend(this);
		this.inner = this.getElementsBySelector(".scroller-inner")[0];
		this.inner.wrapper = this;
		this.items = this.inner.getElementsBySelector(".scroller-item");
		if (this.hasClassName("vertical")) {
			this.vertical = true;
			this.itemHeight = this.items[0].getHeight();
			this.itemHeight += parseInt(this.items[0].getStyle("margin-top"));
			this.itemHeight += parseInt(this.items[0].getStyle("margin-bottom"));
			this.inner.setStyle({
				height: (this.itemHeight * this.items.length) + "px",
				overflow: "hidden",
				position: "absolute"
			});
			this.itemsVisible = Math.round(this.getHeight() / this.itemHeight);
		} else {
			this.itemWidth = this.items[0].getWidth();
			this.itemWidth += parseInt(this.items[0].getStyle("margin-left"));
			this.itemWidth += parseInt(this.items[0].getStyle("margin-right"));
			this.inner.setStyle({
				width: (this.itemWidth * this.items.length) + "px",
				overflow: "hidden"
			});
			this.itemsVisible = Math.round(this.getWidth() / this.itemWidth);
		}
	},
	moveBox: function() {
		if (this.vertical) {
			new Effect.Move(this.inner, { x: 0, y: (-1 * this.currentItem * this.itemHeight), mode: "absolute" });
		} else {
			new Effect.Move(this.inner, { x: (-1 * this.currentItem * this.itemWidth), y: 0, mode: "absolute" });
		}	
	},
	prev: function(num) {
		if (this.currentItem > 0) {
			this.currentItem -= num;
			this.moveBox();
		}
	},
	next: function(num) {
		if (this.currentItem < (this.items.length - this.itemsVisible)) {
			this.currentItem += num;
			this.moveBox();
		}
	},
	moveBoxFade: function(obj) {
		if (obj.element.wrapper.vertical) {
			obj.element.wrapper.inner.setStyle({ top: (-1 * obj.element.wrapper.currentItem * obj.element.wrapper.itemWidth) + "px" });
		} else {
			obj.element.wrapper.inner.setStyle({ left: (-1 * obj.element.wrapper.currentItem * obj.element.wrapper.itemWidth) + "px" });
		}
		new Effect.Appear(obj.element, { duration: 1 });
	},
	prevFade: function(num) {
		if (this.currentItem > 0) {
			this.currentItem -= num;
			new Effect.Fade(this.inner, { duration: 0.5, afterFinish: this.moveBoxFade });
		}
	},
	nextFade: function(num) {
		if (this.currentItem < (this.items.length - this.itemsVisible)) {
			this.currentItem += num;
			new Effect.Fade(this.inner, { duration: 0.5, afterFinish: this.moveBoxFade });
		}
	},
	moveBoxScale: function() {
		if (this.vertical) {
			new Effect.Move(this.inner, { x: 0, y: (-1 * this.currentItem * this.itemHeight), mode: "absolute", afterFinish: this.growItems.bind(this), duration: 0.5 });
		} else {
			new Effect.Move(this.inner, { x: (-1 * this.currentItem * this.itemWidth), y: 0, mode: "absolute", afterFinish: this.growItems.bind(this), duration: 0.5 });
		}
	},
	shrinkItems: function(callback) {
		var img = this.items[0].getElementsByTagName("img")[0];
		Element.extend(img);
		var dimensions = img.getDimensions()
		this.scaleOrigWidth = dimensions.width;
		this.scaleOrigHeight = dimensions.height;
		var newWidth = Math.round(dimensions.width * 0.95);
		var newHeight = Math.round(dimensions.height * 0.95);
		var leftBump = (dimensions.width - newWidth) / 2;
		var topBump = (dimensions.height - newHeight) / 2;
		var i = 0;
		this.items.each(function(item) {
			if (i > 0) {
				callback = function() {}
			}
			var img = item.getElementsByTagName("img")[0];
			new Effect.Morph(img, {
				style: {
					width: newWidth + "px",
					height: newHeight + "px",
					marginTop: topBump + "px",
					marginLeft: leftBump + "px"
				},
				duration: 0.2,
				afterFinish: callback
			});
			i++;
		});
	},
	growItems: function() {
		var newWidth = this.scaleOrigWidth;
		var newHeight = this.scaleOrigHeight;
		this.items.each(function(item) {
			var img = item.getElementsByTagName("img")[0];
			new Effect.Morph(img, {
				style: {
					width: newWidth + "px",
					height: newHeight + "px",
					marginTop: "0px",
					marginLeft: "0px"
				},
				duration: 0.2
			});
		});
	},
	prevScale: function(num) {
		if (this.currentItem > 0) {
			this.currentItem -= num;
			this.shrinkItems(this.moveBoxScale.bind(this));
		}
	},
	nextScale: function(num) {
		if (this.currentItem < (this.items.length - this.itemsVisible)) {
			this.currentItem += num;
			this.shrinkItems(this.moveBoxScale.bind(this));
		}
	}
}};

$$(".scroller").each(function(wrapperDiv) {
	Object.extend(wrapperDiv, new CsScrollerWrapper());
	wrapperDiv.initialize();
});