
var Hermes = new Class({
	Implements: [Options],
	initialize: function(sElement, cOptions){
		this.setOptions(cOptions);
		this.element = $(sElement);
		this.elementWrap = null;
		this.scrollFx = null;
		
		this.timeoutID = 0;
		
		if(this.element.tagName != 'UL' && this.element.tagName != 'OL') alert('List must use a UL or OL list');
	},
	
	options: {
		direction: 'up',
		displayItems: 3,
		height: 150,
		offsetLeft: 0,
		pause: 4000,
		scrollItems: 1,
		speed: 2000,
		target: '',
		transition: 'expo:out',
		width: 250
	},
	
	render: function(){
		this.element.addEvents({
			'mouseenter': function(){
				this.pause();
			}.bind(this),
			'mouseleave': function(){
				this.resume();
			}.bind(this)
		});
		
		var oList = this.element.clone().cloneEvents(this.element);
		oList.setStyles({
			position: 'relative',
			left: '0px'
		});
		
		oList.getChildren().setStyles({
			height: this.options.height + 'px',
			width: this.options.width + 'px',
			padding: '0px',
			border: 'solid 0px red'
		});
		
		if(this.options.direction == 'down' || this.options.direction == 'left') oList.getChildren().each(function(oItem, nIndex){
			oItem.inject(oList, 'top');
		});
		
		var oBlock = new Element('div').setStyles({
			border: 'solid 0px black',
			display: 'block',
			position: 'relative',
			overflow: 'hidden'
		}).inject(this.element.parentNode);
		
		this.options.offsetLeft = this.options.width * oList.getChildren().length - this.options.width * this.options.displayItems - 80;
		
		if(this.options.direction == 'up' || this.options.direction == 'down') oBlock.setStyles({
			width: this.options.width + 'px',
			height: (this.options.height * this.options.displayItems) + 'px'
		});
		
		if(this.options.direction == 'right' || this.options.direction == 'left'){
			this.options.direction == 'right' ? oList.setStyle('right', '0px') : oList.setStyle('left', this.options.offsetLeft + 'px');
			oList.setStyles({
				width: (this.options.width * oList.getChildren().length) + 'px',
				height: this.options.height + 'px'
			});
			oBlock.setStyles({
				width: (this.options.width * this.options.displayItems) + 'px',
				height: this.options.height + 'px'
			});
		}
		
		oList.inject(oBlock);
		this.element.destroy();
		this.element = oList;
		
		this.scrollFx = new Fx.Morph(this.element, {
			duration: this.options.speed, 
			transition: this.options.transition, 
			wait: true,
			onComplete: function(){
				this.resume();
			}.bind(this)
		});
		
		this.resume();
	},
	
	scroll: function(){
		var oBuffer = null;

		if(this.options.direction == 'up'){
			this.scrollFx.start({
				top: [0, ((this.options.height * this.options.scrollItems) * -1)]
			}).chain(function(){
				this.replaceItems();
			}.bind(this));
			
		}else if(this.options.direction == 'down'){
			this.scrollFx.start({
				top: [(this.element.getSize().y * -1) + (this.options.height * this.options.displayItems), (this.element.getSize().y * -1) + (this.options.height * this.options.displayItems) + this.options.height]
			}).chain(function(){
				this.replaceItems();
			}.bind(this));
		
		}else if(this.options.direction == 'left'){
			this.scrollFx.start({
				left: [this.options.offsetLeft, (this.options.offsetLeft - this.options.width)]
			}).chain(function(){
				this.replaceItems();
			}.bind(this));
		
		}else if(this.options.direction == 'right'){
			this.scrollFx.start({
				right: [0, (this.options.width * -1)]
			}).chain(function(){
				this.replaceItems();
			}.bind(this));
		}
	},
	
	replaceItems: function(){
		for(var nIndex = 0; nIndex < this.options.scrollItems; nIndex++){
			if(this.options.direction == 'up'){
				this.element.getFirst().inject(this.element, 'bottom');
				this.element.setStyle('top', '0px');
			}else if(this.options.direction == 'down'){
				this.element.getLast().inject(this.element, 'top');
				this.element.setStyle('top', ((this.element.getSize().y * -1) + (this.options.height * this.options.displayItems)) + 'px');
			}else if(this.options.direction == 'right'){
				this.element.getFirst().inject(this.element, 'bottom');
				this.element.setStyle('right', '0px');
			}else if(this.options.direction == 'left'){
				this.element.getLast().inject(this.element, 'top');
				this.element.setStyle('left', this.options.offsetLeft + 'px');
			}
		}
	},
	
	pause: function(){
		$clear(this.timeoutID);
		this.scrollFx.cancel();
	},
	
	resume: function(){
		this.timeoutID = this.scroll.bind(this).delay(this.options.pause);
		//this.scrollFx.resume();
	}
	
});
