// JavaScript Document

function getElementsByClass(rootNode,classToSearch,tagName) {
    var elementsToReturn = new Array();
    var elementList = rootNode.getElementsByTagName(tagName);
    var nLen = elementList.length;
    var pattern = new RegExp("\\b"+classToSearch+"\\b");
    for(var i = 0; i < nLen; i++){
        if( pattern.test(elementList[i].className) ){
            elementsToReturn[elementsToReturn.length] = elementList[i];
        }
    }
    return elementsToReturn;
}

function addLoadEvent(func) {
	var userAgent = navigator.userAgent.toLowerCase();
	browser = {
		version: (userAgent.match( /.+(?:rv|it|ra|ie)[\/: ]([\d.]+)/ ) || [0,'0'])[1],
		safari: /webkit/.test( userAgent ),
		opera: /opera/.test( userAgent ),
		msie: /msie/.test( userAgent ) && !/opera/.test( userAgent ),
		mozilla: /mozilla/.test( userAgent ) && !/(compatible|webkit)/.test( userAgent )
	}
	if(browser.msie){
	   window.attachEvent('onload',func);
	}else if(browser.mozilla || browser.safari || browser.opera){
		 window.addEventListener('load',func,false);
	}
}

function GetStyleNumber(strArg) {
	if (null == strArg || "" == strArg) {
		return 0;
	}
	var i = 0;
	for (i = 0; i < strArg.length; i++) {
		if (strArg.charAt(i) != "-" && isNaN(strArg.charAt(i))) break;
	}
	if (0 == i) {
		return 0;
	}
	var strNum = strArg.substr(0, i);
	return parseFloat(strNum, 10);
}


function SwapTab(_swapTabName) {
	this.tabActive = "item xa_bar11 xa_tred1 active";
	this.tabUnActive = "item xa_bar1 xa_tblue1";
	this.slideDirLeft = "SlideTabItem left";
	this.slideDirRight = "SlideTabItem right";
	this.tabDivs = new Array();
	this.currTabDivIndex = 0;
	this.tabDivLefts = new Array();
	this.tabDivImgs = new Array();
	this.instName = _swapTabName || "swapTab";
	this.slideDir = true;
	this.scopeWidth = 545;
	this.stepNum = 5;
	
	this.setTabDivs = function (_tabDiv) {
		this.tabDivs.push(_tabDiv);
	}
	
	this.setTabDivLefts = function (_tabDivWidth) {
		this.tabDivLefts.push(_tabDivWidth);
	}
	
	this.setTabDivImgs = function (_tabDivImg) {
		this.tabDivImgs.push(_tabDivImg);
	}
	
	this.getTabDivsLength = function(){
		return this.tabDivs.length;
	}
	
	// Find a tab.
	this.findTabDiv = function(_tabDiv) {
		for (var i = 0; i < this.tabDivs.length; i++) {
			if (this.tabDivs[i] == _tabDiv) {
				return i;
			}
		}
		return -1;
	}
	
	// Find a tab.
	this.findTabDivImg = function(_tabDivImgs) {
		for (var i = 0; i < this.tabDivImgs.length; i++) {
			if (this.tabDivImgs[i] == _tabDivImgs) {
				return i;
			}
		}
		return -1;
	}
	
	this.setTabDivImgsUnActive = function(){
		for (var i = 0; i < this.tabDivImgs.length; i++) {
			this.tabDivImgs[i].className = this.tabUnActive;
		}
	}
	
	this.showTab = function(_tabDiv) {
		this.clean();
		if(_tabDiv.className.indexOf("left") != -1)
			this.slideDir = true;
		else if(_tabDiv.className.indexOf("right") != -1)
			this.slideDir = false;
		else 
			return;
		this.currTabDivIndex = this.findTabDiv(_tabDiv);
		this.timer = setInterval(this.instName + ".doSlide()", 50);
	}
	
	// Clean the playing effect.
	this.clean = function() {
		// Stop the playing effect.
		clearInterval(this.timer);
		this.timer = null;
		if (this.slideDir) {
			// A tab should go to the left.
			var i = 0;
			for (i = 0; i < this.tabDivs.length; i++) {
				if(this.currTabDivIndex > i){
					if (this.tabDivs[i].className.indexOf("left") != -1) {
						var item = this.tabDivs[i];
						item.style.left = (this.tabDivLefts[i] - this.scopeWidth) + "px";
						item.className = this.slideDirRight;
						this.tabDivLefts[i] = GetStyleNumber(item.style.left);
					}
				}
			}
		} else {
			// A tab should go to the right.
			var i = 0;
			for (i = 0; i < this.tabDivs.length; i++) {
				if(this.currTabDivIndex <= i){
					if (this.tabDivs[i].className.indexOf("right") != -1) {
						var item = this.tabDivs[i];
						item.style.left = (this.tabDivLefts[i] + this.scopeWidth) + "px";
						item.className = this.slideDirLeft;
						this.tabDivLefts[i] = GetStyleNumber(item.style.left);
					}
				}
			}
		}
		
	}
	
	// Do the slide action.
	this.doSlide = function() {
		var hasDone = false;
		if (this.slideDir) {
			// A tab should go to the left.
			var i = 0;
			for (i = 0; i < this.tabDivs.length; i++) {
				if(this.currTabDivIndex > i){
					if (this.tabDivs[i].className.indexOf("left") != -1) {
						var item = this.tabDivs[i];
						var curTabPosX = GetStyleNumber(item.style.left) - this.stepNum;
						if(curTabPosX <= (this.tabDivLefts[i] - this.scopeWidth))
							item.style.left = (this.tabDivLefts[i] - this.scopeWidth) + "px";
						else
							item.style.left = curTabPosX + "px";
						if (curTabPosX <= (this.tabDivLefts[i] - this.scopeWidth)) {
							hasDone = true;
							item.className = this.slideDirRight;
							this.tabDivLefts[i] = GetStyleNumber(item.style.left);
						}
					}
				}
			}
		} else {
			// A tab should go to the right.
			var i = 0;
			for (i = 0; i < this.tabDivs.length; i++) {
				if(this.currTabDivIndex <= i){
					if (this.tabDivs[i].className.indexOf("right") != -1) {
						var item = this.tabDivs[i];
						var curTabPosX = GetStyleNumber(item.style.left) + this.stepNum;
						if(curTabPosX >= (this.tabDivLefts[i] + this.scopeWidth))
							item.style.left = (this.tabDivLefts[i] + this.scopeWidth) + "px";
						else
							item.style.left = curTabPosX + "px";
						if (curTabPosX >= (this.tabDivLefts[i] + this.scopeWidth)) {
							hasDone = true;
							item.className = this.slideDirLeft;
							this.tabDivLefts[i] = GetStyleNumber(item.style.left);
						}
					}
				}
			}
		}

		// If done, clean the house.
		if (hasDone) {
			this.clean();
		}
	}
	
	this.init = function(){
	}
}

function onPageLoad(){
	swapTab = new SwapTab();
	swapTab.tabActive = "item xa_bar11 xa_tred1 active";
	swapTab.tabUnActive = "item xa_bar1 xa_tblue1";
	swapTab.slideDirLeft = "SlideTabItem left";
	swapTab.slideDirRight = "SlideTabItem right";
	swapTab.scopeWidth = 545;
	swapTab.stepNum = 25;
	
	var items = getElementsByClass(document,"SlideTabItem", "div");
	for(var i = 0 ; i < items.length; i++){
		var itemsImg = getElementsByClass(items[i],"item", "*");
		if(itemsImg.length <= 0){
			return;
		}
		swapTab.setTabDivs(items[i]);
		swapTab.setTabDivLefts(GetStyleNumber(items[i].style.left));
		swapTab.setTabDivImgs(itemsImg[0]);
		itemsImg[0].onmouseover = function(){
			if(this.className.indexOf("active") != -1){
				return;
			}
			swapTab.setTabDivImgsUnActive();
			this.className = swapTab.tabActive;
			swapTab.showTab(swapTab.tabDivs[swapTab.findTabDivImg(this)]);
		}
	}
}

addLoadEvent(onPageLoad);