var currentItem = 0;
var nodes;

YAHOO.util.Event.addListener(window, "load", function() {

	nodes = YAHOO.util.Selector.query('#carouselContainer li');
	imgNodes = YAHOO.util.Selector.query('#carouselContainer li img');
	if ( nodes.length > 1 ) {
		setInterval(showNextItem,5000);
	}
});

function showNextItem()
{
	var oldNode = nodes[currentItem];
	
	if(currentItem < (nodes.length-1))
		currentItem++;
	else
		currentItem = 0;
	
	var attributesOut = { 
        opacity: { from: 1, to: 0 } 
	}; 

	var animOut = new YAHOO.util.Anim(oldNode, attributesOut, 2.5, YAHOO.util.Easing.easeOut);
	animOut.onStart.subscribe(function(){ fadeInNextItem(); });
	animOut.onComplete.subscribe(function() { yDOM.addClass(oldNode,"hide"); });
	animOut.animate();
		
}

function fadeInNextItem() {
	var newNode = nodes[currentItem];
	yDOM.removeClass(newNode,"hide");
	yDOM.setStyle(newNode,"opacity","0");	
	
	var attributesIn = { 
        opacity: { from: 0, to: 1 } 
	}; 
	var animIn = new YAHOO.util.Anim(newNode, attributesIn, 2.5, YAHOO.util.Easing.easeIn);
	animIn.animate();
}


YAHOO.namespace('imgSlider');

YAHOO.util.imgSlider = {
	IMG_INNER_CONT_ID : null,
	IMG_OUTER_CONT_ID : null,
	LEFT_ARROW : null,
	RIGHT_ARROW : null,
	ARROW_INACTIVE_CLASS : null,
	
	_totalImg : null,
	_imgWidth : null,
	_contWidth : null,
	_imgPerScroll : 2,
	_currentImg : 0,
	_sAttr : { marginLeft: { from: 0, to: 200 } },
	_sAnim : null,
	
	init : function(args) {
		this.IMG_INNER_CONT_ID = args && args.IMG_INNER_CONT_ID ? args.IMG_INNER_CONT_ID : "imgContainer";
		this.IMG_OUTER_CONT_ID = args && args.IMG_OUTER_CONT_ID ? args.IMG_OUTER_CONT_ID : "imgList";
		this.LEFT_ARROW = args && args.LEFT_ARROW ? args.LEFT_ARROW : "leftArrow";
		this.RIGHT_ARROW = args && args.RIGHT_ARROW ? args.RIGHT_ARROW : "rightArrow";
		this.ARROW_INACTIVE_CLASS = args && args.ARROW_INACTIVE_CLASS ? args.ARROW_INACTIVE_CLASS : "arrowInactive";
		this.setContainerWidth();
	},
	setContainerWidth : function() {
		var cList = yDOM.getChildren(this.IMG_INNER_CONT_ID);
		var listRegion = yDOM.getRegion(cList[0]);
		this._totalImg = cList.length;
		
		if (this._totalImg > 2 ) {
			this._imgWidth = listRegion.right - listRegion.left;
			this._contWidth = this._imgWidth * cList.length;
			yDOM.setStyle(this.IMG_INNER_CONT_ID, 'width', (this._contWidth) + 'px');
			this.setArrowEvent();
		}
	},
	setArrowEvent : function() {
		yDOM.setStyle(this.LEFT_ARROW, 'visibility', 'visible');
		yDOM.setStyle(this.RIGHT_ARROW, 'visibility', 'visible');
		yEvent.addListener(this.LEFT_ARROW, "click", function(e) {
			YAHOO.util.imgSlider.slideLeft();
		});
		yEvent.addListener(this.RIGHT_ARROW, "click", function(e){
			YAHOO.util.imgSlider.slideRight();
		});
	},
	
	slideLeft : function() {
		var currentMarginLeft = this.getCurrentMarginLeft();
		var trimLeft = Math.abs(Math.round(currentMarginLeft / this._imgWidth));
		
		if ( trimLeft > 0 ) {
			if ( trimLeft > this._imgPerScroll ) {
				trimLeft = this._imgPerScroll;
			}
			var newCurrentMarginLeft = currentMarginLeft + (this._imgWidth * trimLeft);
			if ( newCurrentMarginLeft == 0 ) {
				yDOM.addClass(this.LEFT_ARROW, this.ARROW_INACTIVE_CLASS);
			}
			this.scroll(currentMarginLeft, newCurrentMarginLeft);
		}
	
		yDOM.removeClass(this.RIGHT_ARROW, this.ARROW_INACTIVE_CLASS);			
	},

	getCurrentMarginLeft : function() {
		var currentMarginLeft = yDOM.getStyle(this.IMG_INNER_CONT_ID, "margin-left");
		if ( currentMarginLeft == '') {
			currentMarginLeft = 0;
		}
		return parseInt(currentMarginLeft);
	},
	slideRight : function() {
		var currentMarginLeft = this.getCurrentMarginLeft();
		this._currentImg = Math.abs(Math.round(currentMarginLeft / this._imgWidth));
		var trimLeft = this._totalImg - this._currentImg - this._imgPerScroll;
		var isActive = true;
		
		if ( trimLeft  >= 1 ) { 
			if ( trimLeft  > this._imgPerScroll ) {
				trimLeft = this._imgPerScroll;
			}
			if ( (this._currentImg + (this._imgPerScroll * 2)) >= this._totalImg) {
				yDOM.addClass(this.RIGHT_ARROW, this.ARROW_INACTIVE_CLASS);	
			}
			this.scroll(currentMarginLeft, (currentMarginLeft - (trimLeft * this._imgWidth)));
		}
		
		yDOM.removeClass(this.LEFT_ARROW, this.ARROW_INACTIVE_CLASS);			
	},

	scroll : function(sfrom, sto, arrow, isactive) {
		this._sAttr = {
			marginLeft: { from: sfrom, to: sto }
		};
		this._sAnim = new YAHOO.util.Anim(this.IMG_INNER_CONT_ID, this._sAttr);
	    this._sAnim.duration = 1.5;
	    this._sAnim.method = YAHOO.util.Easing.easeOut;
	
		this._sAnim.onComplete.subscribe(function() {
			if (!isactive) {
				yDOM.addClass(arrow, this.ARROW_INACTIVE_CLASS);
			}
			
			yEvent.addListener(YAHOO.util.imgSlider.LEFT_ARROW, "click", function(e) {
				YAHOO.util.imgSlider.slideLeft();
			});
			yEvent.addListener(YAHOO.util.imgSlider.RIGHT_ARROW, "click", function(e){
				YAHOO.util.imgSlider.slideRight();
			});						
		}); 
		
		this._sAnim.onStart.subscribe(function() {		
			YAHOO.util.Event.removeListener(YAHOO.util.imgSlider.LEFT_ARROW, 'click');
			YAHOO.util.Event.removeListener(YAHOO.util.imgSlider.RIGHT_ARROW, 'click');
		});
		
		this._sAnim.animate();
	}
};

var _cs;
//yEvent.onDOMReady(function() {
YAHOO.util.Event.addListener(window, 'load', function() {
	_cs = YAHOO.util.imgSlider;
	_cs.init({ 
		'IMG_INNER_CONT_ID': 'imgList', 
		'IMG_OUTER_CONT_ID' : 'imgContainer', 
		'LEFT_ARROW' : 'slideLeftArrow', 
		'RIGHT_ARROW' : 'slideRightArrow',
		'ARROW_INACTIVE_CLASS': 'arrowInactive'
	}); 
});