var ticker = new Class({
	initialize: function(element, options) {
		this.container = element;
		this.options = Object.extend(options || {},{
			pause: 8000,
			page: false
		});
        this.itemArray = Array()
		this.items = this.container.getElement('ul').getElements('li')
		this.reveal = new Element('span').addClass('reveal').setText('_');
		var title = this.container.getElement('h4').getText();
		this.container.getElement('h4').setHTML(title);
		this.item = new Element('ul').addClass('item').injectInside(this.container);


		this.revealfx = new Fx.Styles(this.reveal, {duration:2000, wait:true,link: 'cancel'});
		this.itemfx = new Fx.Styles(this.item, {duration:500, wait:true,link: 'cancel'});
		this.current = 0;
		this.start();
	},
	start: function() {
	    

		this.itemArray.extend(this.items)
		this.container.getElement('ul').remove()
        this.show()
	},
	stop: function() {

		this.revealfx.clearTimer();
		this.revealfx.clearChain();
		this.revealfx.set({'width': 10});
		this.itemfx.set({'opacity':'1'})  
		this.itemfx.stop()
		this.revealfx.stop()	
		this.item.removeEvents();	
this.item.addEvent('mouseleave', this.wipe.bind(this));		
	},
	show: function() {
			this.revealfx.clearTimer()
			this.revealfx.clearChain()
			this.itemfx.stop()
			this.revealfx.stop()
			//console.log('cleared ' + this.current)
            this.itemfx.set({'opacity':'1'})
            this.item.innerHTML = ''
			
            var clone = this.itemArray[this.current].clone().injectInside(this.item)
			var itemEle = this.item.getElement('li')

			this.revealwidth = itemEle.offsetWidth + 20;
			this.reveal.setStyle('width',this.revealwidth).setText('_');
			this.reveal.injectInside(this.item)

            this.showItem();
		    this.current = (this.current==this.items.length-1)?0:this.current+1; 

	},
	showItem: function(){

		this.revealfx.start({'width': 10}).chain(function(){this.wipe.bind(this).delay(5000)}.bind(this))
				this.item.addEvent('mouseleave', this.wipe.bind(this));
		this.item.addEvent('mouseenter', this.stop.bind(this));
	},

	wipe: function(){
		this.item.removeEvent('mouseleave')	
		this.revealfx.clearTimer()
		this.revealfx.clearChain()
		this.itemfx.stop()
		this.revealfx.stop()
		this.itemfx.start({'opacity':'0'})
		//console.log('wiped ' + this.current)
		this.item.removeEvents();	
		this.show.bind(this).delay(1000)
	}
});