var Offer = {
	element : null,
	container : null,
	previousButton : null,
	nextButton : null,
	scroller : null,
	boxWidth : 160,
	totalWidth : 0,
	currentIndex : 0,
	totalItem : 0,
	
	init : function(element,previous,next) {
		window.addEvent('load', function(){
			Offer._init(element,previous,next);
		});
		
		return;
	},
	_init : function (element,previous,next) {
		this.element = $(element);
		this.previousButton = $(previous);
		this.nextButton = $(next);
		
		if (!this.element || !this.previousButton || !this.nextButton) return false;
		
		this.element.setStyles({'position' : 'relative'});
		this.container = new Element('div');
		this.container.setStyles({'position' : 'relative'});
		
		this.totalWidth = 0;
		
		this.element.getChildren().forEach(function(item,index) {
			this.totalItem++;
			this.totalWidth += this.boxWidth;
			
			item.inject(this.container);
		}.bind(Offer));
		
		this.container.setStyles({'width' : this.totalWidth + 'px'});
		
		this.container.inject(element);
		
		this.previousButton.addEvent('click',Offer.previousItem.bindWithEvent(Offer));
		this.nextButton.addEvent('click',Offer.nextItem.bindWithEvent(Offer));
		
		this.scroller = new Fx.Morph(this.container, {duration: 2000, transition: Fx.Transitions.Expo.easeInOut});
		
		this.previousButton.setStyles({'display' : 'none'});
		
		if (this.totalWidth == this.boxWidth) {
			this.nextButton.setStyles({'display' : 'none'});
		}
		
		return true;
	},
	previousItem : function(event) {
		if (!window.ie) {
			event = new Event(event);
			event.preventDefault();
		}else {
		    event.cancelBubble = true;
		    event.returnValue = false;
		}
		
		this.scroller.cancel();
		
		var currentLeft = this.container.getStyle('margin-left').toInt();

		if (this.currentIndex > 0) {
			this.currentIndex--;
			
			var targetLeft = (-1)*this.boxWidth*this.currentIndex;
			
			this.scroller.start({'margin-left' : [currentLeft,targetLeft]});
			
			this.nextButton.setStyles({'display' : 'block'});
			
			if (targetLeft == 0)
				this.previousButton.setStyles({'display' : 'none'});
		}
	},
	nextItem : function(event) {
		if (!window.ie) {
			event = new Event(event);
			event.preventDefault();
		}else {
		    event.cancelBubble = true;
		    event.returnValue = false;
		}
		
		this.scroller.cancel();
		
		var currentLeft = this.container.getStyle('margin-left').toInt();
		
		//console.log(currentLeft + ' ' + this.boxWidth + ' ' + this.totalWidth);

		if (this.currentIndex < this.totalItem - 1) {
			this.currentIndex++;
			
			var targetLeft = -1*this.boxWidth*this.currentIndex;
			
			this.scroller.start({'margin-left' : [currentLeft,targetLeft]});
			
			if ((this.currentIndex + 1) * this.boxWidth == this.totalWidth) {
				this.nextButton.setStyles({'display' : 'none'});
			}
			
			this.previousButton.setStyles({'display' : 'block'});
		}
	}
}