PullQuotes = Class.create({
	container: null,
	items: null,
	dots: null,
	pauseLength: 11000,
	currentItem:0,
	jumpTo: null,
	isAnim: false,
	
	initialize:function() {
		this.container= $('quote_container');
		this.items= $('quote_container').childElements();
		this.dots = $('dots').getElementsByTagName('a');				
		this.items[this.currentItem].addClassName('active');
		this.dots[this.currentItem].addClassName('active');
		this.setupDots();
		this.start();			
	},
	
	setupDots: function() {
		$A(this.dots).each(function(dot, i) {
			dot.observe('click', function(e) {
				e.stop();
				if(!this.isAnim) {
					this.stop();
					this.jumpTo = i;
					this.showNext();							
				}
			}.bind(this))
		}.bind(this))
	},
				
	start: function() {
		this.interval = setInterval(this.showNext.bind(this), this.pauseLength);
	},

	stop: function() {
		clearInterval(this.interval);
	},
	
	showNext: function() {
		this.isAnim =  true;				
		new Effect.Fade(this.container, {
			afterFinish: function() {
				this.items[this.currentItem].removeClassName('active');
				this.dots[this.currentItem].removeClassName('active');

				if(typeof(this.jumpTo) == 'number') {
					this.currentItem = this.jumpTo;
				} else if(this.currentItem < this.items.length-1) {
					this.currentItem = this.currentItem+1;
				} else {
					this.currentItem = 0;
				}							

				this.items[this.currentItem].addClassName('active');
				this.dots[this.currentItem].addClassName('active');
				this.container.appear({ afterFinish: function() { this.isAnim = false }.bind(this) });			
			}.bind(this)
		});				
	},
			
});
Event.onDOMReady(function() { new PullQuotes() })