// JavaScript Document
// MainMenu Static API
//<![CDATA[
var self = null;

/***** Ctor *****/
/*	duration : the duration of the transition
	pauseTime : the interval between 2 transition
	startPause : if the component stay on the first tab or rotate between tabs*/
WidgetFade = function(duration, pauseTime, startPause)
{
	self = this;
	this.mActiveImage = null;
	//this.mActiveTab = null;
	this.mActiveImgTab = null;
	this.mActiveInfo = null;
	this.mDuration = duration;
	this.mPauseTime = pauseTime;
	this.mPause = startPause;
	this.mCurrentIndex = null;
	this.mAnimation = setInterval(runAnimation, this.mPauseTime, this);
	this.mButtonEnable = true;

}

/*	Manage the tabClick
	index : wich tab has ben clicked*/
WidgetFade.prototype.tabClick = function(index)
{
	if(this.mButtonEnable)
	{
		if(index != this.mCurrentIndex)
		{
			if( this.mPause == false)
			{
				clearInterval(this.mAnimation);
				this.mAnimation = setInterval(runAnimation, this.mPauseTime);
			}
			
			this.showImage(index);
		}
	}
}

/*	Manage the transition between elements of the component
	index : the element to switch to*/
WidgetFade.prototype.showImage = function(index)
{
	

	this.mCurrentIndex = eval(index);
	//var tab = document.getElementById("wf_tab" + index);
	var imgTab = document.getElementById("wf_imgTab" + index);
	var info = document.getElementById("wf_info" + index);
	var image = document.getElementById("wf_image" + index);
	
	document.getElementById("wf_content").style.zIndex=4;
	
	if(index==1) {
		document.getElementById("wf_image1").style.zIndex=3;
		document.getElementById("wf_image2").style.zIndex=2;
		document.getElementById("wf_image3").style.zIndex=1;
	}
	if(index==2) {
		document.getElementById("wf_image1").style.zIndex=1;
		document.getElementById("wf_image2").style.zIndex=3;
		document.getElementById("wf_image3").style.zIndex=2;
	}
	if(index==3) {
		document.getElementById("wf_image1").style.zIndex=2;
		document.getElementById("wf_image2").style.zIndex=1;
		document.getElementById("wf_image3").style.zIndex=3;
	}
	
	
	//tab.className+="_enable";
	document.getElementById("wf_imgTab1").src=document.getElementById("wf_imgTab1").src.replace("enable","disable");
	document.getElementById("wf_imgTab2").src=document.getElementById("wf_imgTab2").src.replace("enable","disable");
	document.getElementById("wf_imgTab3").src=document.getElementById("wf_imgTab3").src.replace("enable","disable");
	
	imgTab.src = imgTab.src.replace("disable","enable");
	info.className+=" wf_active";
	
	if( this.mActiveImgTab != null )
	{
		//this.mActiveTab.className = this.mActiveTab.className.replace("_enable","");
		//this.mActiveImgTab.src = imgTab.src.replace("enable","disable");
	}

	if( this.mActiveInfo != null )
	{
		this.mActiveInfo.className = this.mActiveInfo.className.replace(" wf_active","");
	}

	if( this.mActiveImage != null )
	{
		this.mButtonEnable = false;
		
		var fadeIn = new Spry.Effect.Fade(image.id, {duration: this.mDuration, from: 0, to: 100, toggle: false});
		var fadeOut = new Spry.Effect.Fade(this.mActiveImage.id, {duration: this.mDuration, from: 100, to: 0, toggle: false});
		
		var obs = new Object;
		var self = this;
		obs.onPostEffect  = function(effect, data)
		{
			self.onAnimationComplete();
		}
		fadeIn.addObserver(obs);
		
		fadeIn.start();
		fadeOut.start();
	}
	else
	{
		image.style.opacity="1";
		image.style.filter="alpha(opacity=100)";
	}

	//this.mActiveTab = tab;
	this.mActiveImgTab = imgTab;
	this.mActiveInfo = info;
	this.mActiveImage = image;
}

/* Is Called on the post effect of the animation */
WidgetFade.prototype.onAnimationComplete = function()
{
	this.mButtonEnable = true;
}

/* is called by the setInterval passing by runAnimation() */
WidgetFade.prototype.onRunAnimation = function()
{
	var nextIndex = 1;
	
	if( this.mCurrentIndex >= 3 )
		nextIndex = 1;
	else
		nextIndex = this.mCurrentIndex + 1;
	
	this.showImage(nextIndex);
}

/* is called on the pause button click */
WidgetFade.prototype.pauseAnimation = function(button)
{
	if( this.mPause && this.mButtonEnable )
	{
		button.className = button.className.replace("wf_play","wf_pause");
		this.mPause = false;
		this.onRunAnimation();
		this.mAnimation = setInterval(runAnimation, this.mPauseTime);
	}
	else
	{
		button.className = button.className.replace("wf_pause","wf_play");
		this.mPause = true;
		clearInterval(this.mAnimation);
	}
}

/* is called by the setInterval function */
runAnimation = function()
{
	self.onRunAnimation();
}
//]]>