/*
 *
 * TNSlide Class: Replace element list by using fade transition
 * Written by: Karn Sakulsak <karn@thinknet.co.th>
 * Original code (Non-object) by: Ussawin Vongkancom <ussawin@thinknet.co.th>
 *
 * Version: 0.2
 * Status: Released
 * Last Update: 2008-04-25 12:45
 *
 * ChangeLog
 * =========
 * Version 0.1
 * -----------
 * - Initial Release
 * - Can move to previous or next element via transition
 * 
 * Version 0.2
 * -----------
 * - Can specify element number to change to
 *
 */

TN_SLIDE_MOVEPREVIOUS = -3;
TN_SLIDE_MOVENEXT = -1;

function TNSlide(targetElementId){
	var isie = navigator.userAgent.toLowerCase().match('msie');
	
	if(!TNSlide.Instances)
	{
	  TNSlide.Instances = new Array();
	}
	this.id = TNSlide.Instances.length;
  TNSlide.Instances[this.id] = this;
  
  if(document.getElementById(targetElementId))
  {
    var eTarget = document.getElementById(targetElementId);
    var divOpacity, divList = new Array();
    var i, eChild;
    
    // Find fading screen div and content divs
    for(i = 0; i < eTarget.childNodes.length; i++)
    {
      eChild = eTarget.childNodes[i];
      if((eChild.nodeType == 1) && (eChild.tagName.toLowerCase() == 'div'))
      {
        if(eChild.id.toLowerCase().match('opacity'))
          divOpacity = eChild;
        else
        {
          divList.push(eChild);
        }
      }
    }
    this.fadingScreen = divOpacity;
    this.contentList = divList;

    // Set visible content
  	this.contentList[0].style.display = 'block';
    for(i = 1; i < this.contentList.length; i++)
    {
    	this.contentList[i].style.display = 'none';
    }
  	this.contentIndex = 0;

  	this.disableSiteChange = false;
  	
  	this.changeContent = function (direction){
  		if(!this.disableSiteChange)
  		{
  			this.disableSiteChange = true;
  			this.direction = direction;
  			this.fadingScreen.style.zIndex = 0;
  			this.opacity = 0;
  			this.iTimer = setInterval("TNSlide.Instances[" + this.id + "].doFadeOut()", 1);
  		}
  	}
  	
  	this.setOpacity = isie ? function (){
  		this.fadingScreen.style.filter = 'alpha(opacity = ' + this.opacity + ')';
  	} : function (){
  		this.fadingScreen.style.opacity = this.opacity / 100;
  	}
  	
  	this.doFadeOut = function (){
  		this.setOpacity();
  		this.opacity += 10;
  		if(this.opacity >= 100)
  		{
  			this.contentList[this.contentIndex].style.display = 'none';
  			if(this.direction < 0)
  			{
    			this.contentIndex = (this.contentIndex + this.direction + 2) % this.contentList.length;
    			if(this.contentIndex < 0)
    			  this.contentIndex = this.contentList.length - 1;
  			}
  			else
			  {
			    if(this.direction >= this.contentList.length)
			      this.direction = this.contentList.length - 1;
			    this.contentIndex = this.direction;
			  }
  			this.contentList[this.contentIndex].style.display = 'block';
  			
  		  clearInterval(this.iTimer);
  		  this.opacity = 100;
  		  this.iTimer = setInterval("TNSlide.Instances[" + this.id + "].doFadeIn()", 1);
  		}
  		
  	}

  	this.doFadeIn = function (){
  		this.setOpacity();
  		this.opacity -= 10;
  		if(this.opacity <= 0)
  		{
  		  clearInterval(this.iTimer);
  			this.fadingScreen.style.zIndex = -1;
  			this.disableSiteChange = false;
  		}
  		
  	}

  }
  else
  {
    // May raise some exception!
  }
}