var Rotator =
Class.create({
	initialize: function(targetElement, options)
	{
		// console.log($(targetElement));
		if($(targetElement))
		{
			// console.log('setting up rotator');
			this.targetElement = targetElement;
			this.anim = false;
			this.selectorId = false;
			this.nextPrevId = false;
			var interval = 5;
			var itemsPerFrame = 1;
			var duration = 0.5;
			if(options)
			{
				if(options.interval)
					interval = options.interval
				if(options.itemsPerFrame)
					itemsPerFrame = options.itemsPerFrame;
				if(options.duration)
					duration = options.duration;
				if(options.selectorId) 
					this.selectorId = options.selectorId;
				if(options.nextPrevId) 
					this.nextPrevId = options.nextPrevId;
			}
			this.duration = duration;
			this.interval = interval;
			this.itemsPerFrame = itemsPerFrame;
			this.count = $(targetElement).down('ul').childElements().length;
			if(this.count < (itemsPerFrame + 1)) // Not enough images to proceed, so return with false
				return false;
			this.index = 0;
			this.w = $(targetElement).down('li').getWidth();
			//console.log(this.w);
			var ulWidth = this.w * this.count;
			$(targetElement).down('ul').setStyle({width: ulWidth +'px'});
			// console.log($(targetElement).select('.previous_button'));
			if(this.count > 1) {
				if(this.selectorId)
					$$('#' + this.selectorId + ' li').invoke('observe', 'click', this.moveContainerToIndex.bind(this));
				else if (this.nextPrevId) {
					$(this.nextPrevId).select('.previous_button').invoke('observe', 'click', this.moveContainerPrevious.bind(this));
					$(this.nextPrevId).select('.next_button').invoke('observe', 'click', this.moveContainerNext.bind(this));
				}
				else {
					$(targetElement).select('.previous_button').invoke('observe', 'click', this.moveContainerPrevious.bind(this));
					$(targetElement).select('.next_button').invoke('observe', 'click', this.moveContainerNext.bind(this));
				}
				this.startPe();
			} else {
//				$(targetElement).select('.previous_button').invoke('hide');
//				$(targetElement).select('.next_button').invoke('hide');
			}
			// console.log(this.w);
			// console.log('rotator setup complete');
		}
	},
	
	moveContainerToIndex: function(e) {
		var element = Event.element(e);
		element.siblings().each(function(s) {s.removeClassName('selected')});
		element.addClassName('selected');
		var index = element.readAttribute('jsdata') - 1;
		var offset = index - this.index;
		if(offset == 0)
			return true;
		if(offset > 0) {
			for(var c=0;c<=offset;c++) {
				this.moveContainerNext();
			}
		} else {
			for(var c=0;c>=offset;c--) {
				this.moveContainerPrevious();
			}
		}
	},

	moveContainerNext: function(e) {
		var targetElement = this.targetElement;
		if(this.anim == false) {
			this.anim = true;
			this.pe.stop();
			this.trackIndex('next');
			/*
			console.log(this.index + this.itemsPerFrame - 1);
			console.log(this.count);
			*/
			if(this.selectorId) {
				$$('#' + this.selectorId + ' li.selected').each(function(e) {
					e.removeClassName('selected');
					if(e.next())
						e.next().addClassName('selected');
					else
						e.up('ul').firstDescendant('li').addClassName('selected');
				});
			}	
			if(this.index + this.itemsPerFrame - 1 >= this.count) {
				this.setFirstToLast();
				this.index--; // decrement the index so we're still on the last element
			}
			var _this = this;
			// console.log(this.w);
			new Effect.Move($(targetElement).down('ul'), {x: -this.w, mode: 'relative', duration: this.duration, afterFinish: function(e) {_this.anim = false;_this.startPe();}});
		}
	},

	moveContainerPrevious: function(e) {
		var targetElement = this.targetElement;
		
		if(this.anim == false) {
			this.anim = true;
			this.pe.stop();
			this.trackIndex('prev');
			var w = this.w;
			if(this.index < 0) {
				this.setLastToFirst();
				this.index++;
			}
			var _this = this;
			// console.log(this.w);
			new Effect.Move($(targetElement).down('ul'), {x: w, mode: 'relative', duration: this.duration, afterFinish: function(e) {_this.anim = false;_this.startPe();}});
		}
	},

	setLastToFirst: function()
	{
		var targetElement = this.targetElement;
		var lastLi = $(targetElement).down("ul li:last-child");
		var clone = lastLi.cloneNode(true);
		clone = $(clone);
		lastLi.remove();
		$(targetElement).down('ul').insert({top: clone});
		var pos = $(targetElement).down('ul').getStyle('left');
		var leftPos = parseInt(pos) - this.w;
		// console.log(leftPos);
		$(targetElement).down('ul').setStyle({left: leftPos + 'px'});
		if(this.selectorId)
			this.setLastToFirstJS();
	},

	setFirstToLast: function()
	{
		var targetElement = this.targetElement;
		var firstLi = $(targetElement).down('ul').firstDescendant();
		var clone = firstLi.cloneNode(true);
		clone = $(clone);
		firstLi.remove();
		$(targetElement).down('ul').insert(clone);
		var pos = $(targetElement).down('ul').getStyle('left');
		var leftPos = parseInt(pos) + this.w;
		// console.log(pos);
		// console.log('pos: ' + pos);
		// console.log('leftPos: ' + (pos.left + this.w));
		$(targetElement).down('ul').setStyle({left: leftPos + 'px'});
		if(this.selectorId)
			this.setFirstToLastJS();
	},
	
	setFirstToLastJS: function()
	{
		var count = this.count;
		$$('#' + this.selectorId + ' li').each(function(e) {
			var index = e.readAttribute('jsdata');
			if(index == 1)
				index = count;
			else
				index--;
			e.writeAttribute({jsdata: index});
		});
	},

	setLastToFirstJS: function()
	{
		var count = this.count;
		$$('#' + this.selectorId + ' li').each(function(e) {
			var index = e.readAttribute('jsdata');
			if(index == count)
				index = 0;
			else
				index++;
			e.writeAttribute({jsdata: index});
		});
	},

	trackIndex: function(dir) {
		(dir == "next") ? this.index++ : this.index--;
	},

	startPe: function() {
		this.pe = new PeriodicalExecuter(this.moveContainerNext.bindAsEventListener(this), this.interval);
	}
});
