var iMaxTS=5,iMaxTBS=3;
var iReadStep=0;
var sLoDID=',';
var iDelay=200;
var iDisplayCateNo=0;
var iTSTimer=0;
var iTSCount,iTSCur,iTSFading,iTSPrev=0,iTSNext=0,iTSFastMove=0;
var iFadeDelay=50;
var iBoxCount = 0;
var Story = 'images/story.gif';
var video = 'images/video.gif';
var Photo = 'images/Photo.gif';
var Next ='images/Next.gif';
var Prev='images/Prev.gif';
var Next2 = 'images/Next2.gif';
var Prev2='images/Prev2.gif';

function showtopstoryitem(arItemTS) {
    iTSCount = arItemTS.length - 1;
    
	var sHTML='';
	sHTML=sHTML.concat('<div style="position:relative;width:236px;height:205px;">');
	sHTML=sHTML.concat('	<div style="left:0px;top:0px;width:238px;height:2px;" class="HomeTopStoryBorder"></div>');
	sHTML=sHTML.concat('	<div style="left:0px;top:219px;width:238px;height:2px;" class="HomeTopStoryBorder"></div>');
	sHTML=sHTML.concat('	<div style="left:0px;top:2px;width:2px;height:217px;" class="HomeTopStoryBorder"></div>');
	sHTML=sHTML.concat('	<div style="left:236px;top:2px;width:2px;height:217px; " class="HomeTopStoryBorder"></div>');
	for (var i=0;i<=iTSCount;i++){
		sHTML=sHTML.concat('	<div id="divTopStory').concat(i).concat('" onmousemove="cleartopstorycounter();" style="overflow:hidden;position:absolute;').concat((i==0?'left:0px':'left:-4000px')).concat(';top:0px;width:238px;height:221px;">');
		sHTML = sHTML.concat('		<a target="blank" title="').concat(arItemTS[i][2]).concat('" href="').concat(arItemTS[i][5]).concat('"><img border="0" src="').concat(arItemTS[i][1]).concat(arItemTS[i][4]).concat('" alt="').concat(arItemTS[i][2]).concat('" width="236" height="221"></a>');	
		
		sHTML=sHTML.concat('	</div>');
		sHTML=sHTML.concat('	<div id="divTopStoryLayer').concat(i).concat('" onmousemove="cleartopstorycounter();" style="').concat((i==0?'left:0px':'left:-4000px')).concat(';top:146px;width:238px;height:75px;" class="HomeTopStoryColorLayer"></div>');
		sHTML=sHTML.concat('	<div id="divTopStoryTitle').concat(i).concat('" onmousemove="cleartopstorycounter();" style="').concat((i==0?'left:0px':'left:-4000px')).concat(';top:146px;width:238px;height:75px;" class="HomeTopStoryColorLayerContent">');
		//sHTML=sHTML.concat('		<div style="left:3px;top:4px;width:236px;height:15px;" title="').concat(arItemTS[i][2]).concat('" class="HomeTopStoryTitle" onclick="window.open(\'').concat(arItemTS[i][5]).concat('\',\'mywindow\',\'width=900,height=700,status=1,scrollbars=1,toolbar=yes\');">').concat(arItemTS[i][2]).concat('</div>');	
		sHTML=sHTML.concat('		<a style="left:3px;top:4px;width:236px;height:15px;" target="_blank" title="').concat(arItemTS[i][2]).concat('" class="HomeTopStoryTitle" href="').concat(arItemTS[i][5]).concat('">').concat(arItemTS[i][2]).concat('</a>');	
		
		sHTML=sHTML.concat('		<div style="left:4px;top:5px;width:236px;height:18px;" class="HomeTopStoryTitleShadow">').concat(arItemTS[i][2]).concat('</div>');
		sHTML=sHTML.concat('		<div style="left:4px;top:'+(arItemTS[i][2].length>29?'43':'28')+'px;width:236px;height:18px;" class="HomeTopStoryLead">').concat(arItemTS[i][3]);
		
		sHTML = sHTML.concat('		</div>');
		sHTML=sHTML.concat('	</div>');
	}
	sHTML=sHTML.concat('<div style="left:215px;top:207px;width:25px;height:17px;" class="HomeTopStoryColorLayerSubImage">');
	sHTML = sHTML.concat('<img id="imgTSPrev" src="'+ Prev2 +'" hspace="2" vspace="0" onmouseover="iTSPrev=1;this.src=\''+ Prev +'\'" onmouseout="iTSPrev=0;this.src=\''+ Prev2 +'\'" style="cursor:pointer" onclick="changetopstory(-1,false);">');
	sHTML = sHTML.concat('<img id="imgTSNext" src="'+ Next2 +'" hspace="2" vspace="0" onmouseover="iTSNext=1;this.src=\''+ Next +'\'" onmouseout="iTSNext=0;if (!iTSFading) this.src=\''+ Next2 +'\'" style="cursor:pointer" onclick="changetopstory(1,false);">');
	sHTML=sHTML.concat('</div>');
	sHTML=sHTML.concat('</div>');
	$("tdTS").innerHTML=sHTML;
	iTSCur=0;
	//sua
	setInterval(function(){topstorycounter();},100)
}


function changetopstory(direction,fade){
    var iTop, iBot;
	var oTop, oBot, oTopLayer, oBotLayer, oTopTitle, oBotTitle;
	iTop=iTSCur;
	iBot=iTop+direction;
	if (iBot<0) iBot=iTSCount;
	if (iBot>iTSCount) iBot=0;
	//sua
	oTop = 'divTopStory'+iTop;
	oBot = 'divTopStory'+iBot;
	oTopLayer = 'divTopStoryLayer'+iTop;
	oBotLayer = 'divTopStoryLayer'+iBot;
	oTopTitle = 'divTopStoryTitle'+iTop;
	oBotTitle = 'divTopStoryTitle'+iBot;
	//alert(oBotLayer);
	
	if (iTSFading==1){
	    //sua thuoc tinh left cua top thanh right
		$('divTopStory'+(iTop+1)).style.right='-4000px';
		$('divTopStoryLayer'+(iTop+1)).style.right='-4000px';
		$('divTopStoryTitle'+(iTop+1)).style.right='-4000px';
		outdirectionimage();
		iTSFading=0;
	}
	iTSTimer=0;
	if (!fade){
		iTSFastMove=1;
		changeOpac(100,oBot);
		changeOpac(40,oBotLayer);
		changeOpac(100,oBotTitle);
		//sua thanh right
		$(oTop).style.zIndex=1;
		$(oBot).style.zIndex=2;
		$(oBot).style.left='0px';
		$(oTop).style.left='-4000px';
		$(oBotLayer).style.left='0px';
		$(oTopLayer).style.left='-4000px';
		$(oBotTitle).style.left='0px';
		//sua
		//$(oTopTitle).style.left='-4000px';
		$(oTopTitle).style.left='-4000px';
		iTSFading=0;
		iTSCur=iBot;
	}
	else{
		iTSFastMove=0;
		changeOpac(100,oBot);
		changeOpac(0,oBotLayer);
		changeOpac(0,oBotTitle);
		//sua
		$(oTop).style.zIndex=2;
		//$(oTop).style.zIndex=2;
		$(oBot).style.zIndex=1;
		//bot la thuc the hien tai
		//bang 0 sua lai 2000
		$(oBot).style.left='0px';
		$(oBotLayer).style.left='0px';
		$(oBotTitle).style.left='0px';
		iTSFading=1;
		changingdirectionimage(direction);
		changingtopstory(iTop,iBot,0,100);
	}
}

function changingtopstory(iTop,iBot,iStep,iCurOpac){
	var oTop, oBot, oTopLayer, oBotLayer, oTopTitle, oBotTitle;
//sua
	oTop = 'divTopStory'+iTop;
	oBot = 'divTopStory'+iBot;
	oTopLayer = 'divTopStoryLayer'+iTop;
	oBotLayer = 'divTopStoryLayer'+iBot;
	oTopTitle = 'divTopStoryTitle'+iTop;
	oBotTitle = 'divTopStoryTitle'+iBot;
	
	if (iTSFading==1){
		if (iStep==0){
			if (iCurOpac>=0){
				changeOpac(iCurOpac,oTopTitle);
				changeOpac(iCurOpac*40/100,oTopLayer);
				iCurOpac-=5;
				setTimeout(function(){changingtopstory(iTop,iBot,0,iCurOpac)},iFadeDelay);
			}
			else{
				setTimeout(function(){changingtopstory(iTop,iBot,1,100)},2000);
			}
		}
		else if (iStep==1){
			if (iCurOpac>=0){
				changeOpac(iCurOpac,oTop);
				iCurOpac-=5;
				setTimeout(function(){changingtopstory(iTop,iBot,1,iCurOpac)},iFadeDelay);
			}
			else{
				iTSCur=iBot;
				$(oTop).style.left='-4000px';
				$(oTopLayer).style.left='-4000px';
				$(oTopTitle).style.left='-4000px';
				setTimeout(function(){changingtopstory(iTop,iBot,2,0)},100);
			}
		}
		else if (iStep==2){
			if (iCurOpac<=100){
				changeOpac(iCurOpac,oBotTitle);
				changeOpac(iCurOpac*40/100,oBotLayer);
				iCurOpac+=5;
				setTimeout(function(){changingtopstory(iTop,iBot,2,iCurOpac)},iFadeDelay);
			}
			else{
				outdirectionimage();
				iTSFading=0;
				iTSTimer=0;
			}
		}
	}
	else if (iStep<2 && iTSFastMove==0) {
	//sua lai thanh right
		$(oBot).style.left='-4000px';
		$(oBotLayer).style.left='-4000px';
		$(oBotTitle).style.left='-4000px';
		outdirectionimage();
		iTSFading=0;
		iTSTimer=0;
	}
}

function changingdirectionimage(direction){
    //tu nhay thi su kien nay moi xay ra
    if (direction > 0) $('imgTSNext').src = Next;
	else $('imgTSPrev').src =Prev;
}

function outdirectionimage(){
    if (iTSNext == 0) $('imgTSNext').src = Next2;
	if (iTSPrev==0) $('imgTSPrev').src=Prev2;
}

function topstorycounter(){
	iTSTimer++;
	if (iTSTimer>70) {
		iTSTimer=0;
		changetopstory(1,true);
	}
}

function cleartopstorycounter(){
	changeOpac(100,'divTopStory'+iTSCur);
	changeOpac(40,'divTopStoryLayer'+iTSCur);
	changeOpac(100,'divTopStoryTitle'+iTSCur);
	iTSFading=0;
	iTSTimer=0;
}

function changeOpac(opacity, id) {
	$(id).style.opacity = (opacity / 100);
	$(id).style.MozOpacity = (opacity / 100);
	$(id).style.KhtmlOpacity = (opacity / 100);
	$(id).style.filter = "alpha(opacity=" + opacity + ")";
}