var MilkSlide = new Class({
	Implements: [Options, Events],
	options: {
		steps: 3,
		navNext: null,
		navPrev: null,
		animTime: 600,
		ease: Fx.Transitions.Quad.easeInOut,
		navTimer: true,
		navTimerInterval: 6000,
		pauseOnHover: true
	},
	slideContainer: null,
	slideItems: null,
	viewport: null,
	tween: null,
	animating: false,
	navTimer: null,
	hovering: false,
	
	animateX: 0,
	
	initialize: function(viewport, slideContainer, slideItemsSelector, options) {
	
		this.viewport = $$(viewport)[0];
		this.slideContainer = $$(slideContainer)[0];
		this.slideItemsSelector = slideItemsSelector;
		this.refreshSlideItems();
	
		this.setOptions(options);
		
		this.tween = new Fx.Tween(this.slideContainer, {duration: this.options.animTime, ease: this.options.ease, property: 'left'});
		this.tween.addEvent('complete', function() { this.animating = false; }.bind(this));
		
		if(this.options.navNext) this.options.navNext = $$(this.options.navNext).addEvent('click', this.gotoNext.bind(this));
		if(this.options.navPrev) this.options.navPrev = $$(this.options.navPrev).addEvent('click', this.gotoPrev.bind(this));
		
		if(this.options.navTimer) this.navTimer = this.gotoNext.periodical(this.options.navTimerInterval, this, [null, true]);
		
		if(this.options.pauseOnHover) {
			this.viewport.addEvent('mouseenter', function(e) {
				this.hovering = true;
			}.bind(this));
			
			this.viewport.addEvent('mouseleave', function(e) {
				this.hovering = false;
			}.bind(this));
			
			//QUICK FIX
			if(this.options.navNext) {
				this.options.navNext.addEvent('mouseenter', function(e) {
					this.hovering = true;
				}.bind(this));
				
				this.options.navNext.addEvent('mouseleave', function(e) {
					this.hovering = false;
				}.bind(this));
			}
			
			if(this.options.navPrev) {
				this.options.navPrev.addEvent('mouseenter', function(e) {
					this.hovering = true;
				}.bind(this));
				
				this.options.navPrev.addEvent('mouseleave', function(e) {
					this.hovering = false;
				}.bind(this));
			}
		}
	},
	
	gotoNext: function(e, checkHover) {
		if(e) e.preventDefault();
		
		if(!this.options.pauseOnHover || (this.options.pauseOnHover && !checkHover) || (this.options.pauseOnHover && checkHover && !this.hovering))
			this.gotoItem(+this.options.steps);
	},
	
	gotoPrev: function(e, checkHover) {
		if(e) e.preventDefault();
		
		if(!this.options.pauseOnHover || (this.options.pauseOnHover && !checkHover) || (this.options.pauseOnHover && checkHover && !this.hovering))
			this.gotoItem(-this.options.steps);
	},
	
	gotoItem: function(i) {
		if(this.animating) return;
	
		var newX;
	
		if(i > 0) {
		
			if(this.getSlideContainerX() < 0) {
				this.slideItems.each(function(el, i) {
					if(el.getPosition(this.slideContainer).x + el.getSize().x < Math.abs(this.getSlideContainerX())) {
						this.slideContainer.grab(el, 'bottom');
						
						this.slideContainer.setStyle('left', this.getScX() + el.getSize().x);
					}
				}.bind(this));
			}
			
			this.refreshSlideItems();
			
			this.animateX = this.getScX();
			
			var i = 0;
			while(i < this.options.steps) {
				this.animateX -= this.slideItems[i].getSize().x;
				i++;
			}
				
		
		}else{
			
			this.slideItems.each(function(el, i) {
				if(el.getPosition(this.slideContainer).x >= this.viewport.getSize().x + Math.abs(this.getSlideContainerX())) {
					this.slideContainer.grab(el, 'top');
					
					newX = this.getScX() - el.getSize().x;
					this.slideContainer.setStyle('left', newX);
				}
			}.bind(this));
			
			this.refreshSlideItems();
			
			var firstVisibleItem = 0;
			var iii;
			
			for(iii=0;iii<this.slideItems.length;iii++) {
				if(this.slideItems[iii].getPosition(this.slideContainer).x >= Math.abs(this.getSlideContainerX())) {
					firstVisibleItem = iii;
					break;
				}
				
			}
					
			this.animateX = this.getScX();
			var ii = 1;	
			while(ii <= this.options.steps) {
				this.animateX += this.slideItems[firstVisibleItem-ii].getSize().x;
				ii++;
			}
						
		}
		
		this.animating = true;
		this.tween.start(this.animateX);
	},
	
	refreshSlideItems: function() {
		this.slideItems = $$(this.slideItemsSelector);
	},
	
	getSlideContainerX: function() {
		var pos = this.slideContainer.getPosition(this.viewport);
		return pos.x;
	},
	
	getScX: function() {
		return parseInt(this.slideContainer.getStyle('left'));
	}

});