//==========================================================================================================
//PC home Online 網路家庭的文字、圖片、資料、商標、標識、及網頁設計等皆受中華民國相關智慧財產權法令的保護。
//嚴禁任何未經事先同意的非法轉載和使用。若經查知，PC home Online 網路家庭將採取必要之法律行動
//==========================================================================================================

var CurrentStatus = {
	//Ranking
	RankingKeyControl: [],
	RankingAllowKeyArray: [37, 39],
	
	Browser: identifyBrowser(),
	BrowserPNGfix: 'ie5,ie5mac,ie5.5,ie6',
	//method
	GetKeyCode: function(e) {
		var KeyCode;
		if (window.event && window.event.srcElement)
			KeyCode = window.event.keyCode;
		else if (e && e.target)
			KeyCode = e.keyCode;
		return KeyCode;
	},
	KeydownEvent: function(e){
		var KeyCode = CurrentStatus.GetKeyCode(e);
		if (CurrentStatus.RankingAllowKeyArray.indexOf(KeyCode) != -1) for (var i=0; i<CurrentStatus.RankingKeyControl.length; ORanking['Ranking'+CurrentStatus.RankingKeyControl[i++]].KeyDownEvent(KeyCode));
	}
};

function Ranking(id, DataObj) {
	this.id = id;
	this.DataObj = DataObj;
	this.CodeSection = this.DataObj.CodeSection;
	this.BarInfoDefault = [
		{id:'Rank', value:'Rank', icon:'/img/Ranking/IconTB_0.png', width:30},
		{id:'RankID', value:'ID', icon:'/img/Ranking/IconTB_1.png', width:130}
	];
	this.BarInfo = (DataObj.BarInfo) ? DataObj.BarInfo : this.BarInfoDefault;
	var BarSet = [];
	for (var i=0; i<this.BarInfo.length; BarSet.push(this.BarInfo[i++].id));
	for (var i=0; i<this.BarInfo.length; i++) {
		if (!this.BarInfo[i].width) this.BarInfo[i].width = 50;
		BarSet.push(this.BarInfo[i].id);
	}//end for
	if (BarSet.indexOf('RankID') == -1) this.BarInfo = [this.BarInfoDefault[1]].concat(this.BarInfo.clone());
	if (BarSet.indexOf('Rank') == -1) this.BarInfo = [this.BarInfoDefault[0]].concat(this.BarInfo.clone());
	this.BarBlock = (this.DataObj.BarBlock) ? this.DataObj.BarBlock : 8;
	this.ContainerBlock = (this.DataObj.ContainerBlock) ? this.DataObj.ContainerBlock : 10;
	this.ContainerW = this.BarBlock * (this.BarInfo.length-1);//RankingTBB:8px * TitleElementAmount
	this.ContainerH = 30;
	for (var i=0; i<this.BarInfo.length; this.ContainerW += this.BarInfo[i++].width);
	this.FuncID = (this.DataObj.FuncID == undefined || this.DataObj.FuncID < 0 || this.DataObj.FuncID > (this.TotalAmt - 1)) ? 0 : this.DataObj.FuncID;//perpage first Icon
	this.TotalAmt = this.DataObj.IconInfo.length;
	this.MaxRows = (this.DataObj.MaxRows != undefined && parseInt(this.DataObj.MaxRows, 10) == this.DataObj.MaxRows && this.DataObj.MaxRows > 0) ? this.DataObj.MaxRows : 10;
	this.PageAmt = Math.ceil(this.TotalAmt/this.MaxRows);
	this.CurrentPage = Math.ceil((this.FuncID + 1)/this.MaxRows);
	this.CurrentPage--;
	this.TotalWidth = 4 + 4 + 10 + this.ContainerW + 10 + 4 + 4;//LeftBorder + Block + BarLeft + ContainerW + BarRight + Block + RightBorder
	this.TotalHeight = 33 + 8 + 20 + 8 + (this.ContainerH + this.ContainerBlock) * this.MaxRows - this.ContainerBlock + 3 + 11;//RankingTop + Block + TitleBar + (30 + this.ContainerBlock) * this.MaxRows - this.ContainerBlock + RankingBottom
	this.RankTop = (this.DataObj.RankTop) ? this.DataObj.RankTop : '';
	this.BGSet = (this.DataObj.BGSet) ? this.DataObj.BGSet : '#ffffff';
	this.KeyControlable = (this.DataObj.KeyControlable == undefined || (typeof(this.DataObj.KeyControlable) != 'boolean')) ? true : this.DataObj.KeyControlable;
	this.AutoPlay = (this.DataObj.AutoPlay == undefined || typeof(this.DataObj.AutoPlay) != 'boolean') ? true : this.DataObj.AutoPlay;
	this.Timer = 5000;
	this.FreezeFlag = false;
	this.getORankEns = [];
	this.IntervalID = '';
	this.TimerIntervalID = '';
	//method
	this.ArrowRollEffect = function(FuncID, Mode) {
		var IconPath = (Mode == 'Over') ? (FuncID.indexOf('Left') != -1) ? '/img/Ranking/BtnPageUpOver.png' : '/img/Ranking/BtnPageDownOver.png' : (FuncID.indexOf('Left') != -1) ? '/img/Ranking/BtnPageUpOut.png' : '/img/Ranking/BtnPageDownOut.png';
		if (CurrentStatus.BrowserPNGfix.indexOf(CurrentStatus.Browser) != -1) {
			$(FuncID).style.background = 'url(/img/transparent.gif)';
			$(FuncID).style.filter = 'progid:DXImageTransform.Microsoft.AlphaImageLoader(src='+IconPath+', sizingMethod=scale)';
		} else $(FuncID).style.background = 'url('+IconPath+') no-repeat';
	}
	this.ClickAction = function(FuncID) {
		if (!FuncID.Link) return;
		window.open(FuncID.Link, 'PChomePhoto');
	}
	this.GoAuto = function() {
		clearTimeout(this.TimerIntervalID);
		this.FreezeFlag = false;
		var IDSet = 'Ranking' + this.id;
		this.TimerIntervalID = setTimeout(function() { ORanking[IDSet].VaryAction(0); }, this.Timer);
	};
	this.KeyDownEvent = function(KeyCode) {
		clearTimeout(this.TimerIntervalID);
		switch (KeyCode) {
			case 37:
				this.VaryAction(1);
				break;
			case 39:
				this.VaryAction(2);
				break;
		}//end switch
	};
	this.VaryAction = function(Mode) {
		clearInterval(this.IntervalID);
		clearTimeout(this.TimerIntervalID);
		(Mode == 1) ? this.CurrentPage-- : this.CurrentPage++;
		if (this.CurrentPage <= 0 ) this.CurrentPage = this.PageAmt;
		if (this.CurrentPage > this.PageAmt) this.CurrentPage = 1;
		var StartID = (this.CurrentPage - 1) * this.MaxRows;
		var getInfo = this.DataObj.IconInfo.clone().slice(StartID, StartID+this.MaxRows);
		for (var i=0; i<this.MaxRows; i++) {
			this.getORankEns[i].MoveFlagX = false;
			this.getORankEns[i].MoveFlagY = false;
			this.getORankEns[i].PosX = 0;
			this.getORankEns[i].PosY = (Mode == 1) ? this.ContainerH * -1 : this.ContainerH;
			this.getORankEns[i].GoalX = 0;
			this.getORankEns[i].GoalY = 0;
			
			this.getORankEns[i].style.left = this.getORankEns[i].PosX + 'px';
			this.getORankEns[i].style.top = this.getORankEns[i].PosY + 'px';
			
			for (var j=0; j<this.BarInfo.length; j++) {
				if (this.BarInfo[j].id == 'Rank' || this.BarInfo[j].id == 'RankID' || this.BarInfo[j].id == 'Status') continue;
				this.getORankEns[i][this.BarInfo[j].id].innerHTML = (getInfo[i] && getInfo[i][this.BarInfo[j].id]) ? getInfo[i][this.BarInfo[j].id] : '';
			}//end for
			if (getInfo[i]) {
				this.getORankEns[i].Rank.innerHTML = (getInfo[i].Rank) ? getInfo[i].Rank : StartID + 1 + i;
				this.getORankEns[i].RankID.Link = getInfo[i].Link;
				
				if (typeof(getInfo[i].Status) != 'undefined') {
					var StatusSet = (getInfo[i].Status == -1000) ? '--' : (getInfo[i].Status == 0) ? '<span style="color:#00a0e9;">new</span>' : (getInfo[i].Status > 0) ? '<span style="color:#ff0000">↑</span>'+Math.abs(getInfo[i].Status) : '<span style="color:#007130">↓</span>'+Math.abs(getInfo[i].Status);
					this.getORankEns[i].Status.innerHTML = StatusSet;
				}//end if
				
				var Pattern = /DataSet\[(.*)\]/;
				var TitleSet = trim(getInfo[i].Title.replace(Pattern, "$1"));
				var TL = CalculateTxt(TitleSet);
				var IdPartW = 0;
				if (getInfo[i].Icon) {
					//IconPart
					Element.show(this.getORankEns[i].RankID.getIconPart);
					this.getORankEns[i].RankID.getIcon.src = getInfo[i].Icon;
					//IdPart
					IdPartW = this.getORankEns[i].RankID.getId.SW;
				} else {
					//IconPart
					Element.hide(this.getORankEns[i].RankID.getIconPart);
					//IdPart
					IdPartW = this.getORankEns[i].RankID.getId.EW;
				}//end if
				var TLimit = IdPartW/12 * 2 * Math.floor(this.ContainerH/14) - 3;
				this.getORankEns[i].RankID.getId.style.lineHeight = ((TL > TLimit) ? 14 : this.ContainerH) + 'px';
				this.getORankEns[i].RankID.getId.style.width = IdPartW + 'px';
				this.getORankEns[i].RankID.getId.innerHTML = TextLengthLimit(TitleSet, TLimit);
			} else {
				this.getORankEns[i].Rank.innerHTML = '';
				Element.hide(this.getORankEns[i].RankID.getIconPart);
				this.getORankEns[i].RankID.getId.innerHTML = '';
				this.getORankEns[i].RankID.Link = null;
			}//end if
		}//end if
		var IDSet = 'Ranking' + this.id;
		this.IntervalID = setInterval(function() { ORanking[IDSet].realMove(Mode); }, 15);
	}
	this.realMove = function(Mode) {
		var speed = 10;
		if (Mode == 0) {
			var DirectObj;
			for (var i=0; i<this.getORankEns.length; i++) {
				if (!this.getORankEns[i].MoveFlagX || !this.getORankEns[i].MoveFlagY) { DirectObj = this.getORankEns[i]; break; };
			}//end for
			
			if (!DirectObj) {
				clearInterval(this.IntervalID);
				if (!this.AutoPlay || this.FreezeFlag) return;
				clearTimeout(this.TimerIntervalID);
				var IDSet = 'Ranking' + this.id;
				this.TimerIntervalID = setTimeout(function() { ORanking[IDSet].VaryAction(0); }, this.Timer);
				return;
			}//end if
			
			if (!DirectObj.MoveFlagX) {
				var ObjX = DirectObj.PosX;
				var a = DirectObj.GoalX - ObjX;
				var speedx = a/speed;
				var SignX = (speedx < 0) ? -1 : 1;
				speedx = Number(SignX * ((Math.abs(speedx) <= 1) ? 1 : Math.abs(speedx)));
				
				if (Math.abs(ObjX-DirectObj.GoalX) <= Math.abs(speedx)) { DirectObj.PosX = DirectObj.GoalX; DirectObj.MoveFlagX = true;	}
				else DirectObj.PosX = ObjX + speedx;
			}//end if
			
			//check y position
			if (!DirectObj.MoveFlagY) {
				var ObjY = DirectObj.PosY;
				var b = DirectObj.GoalY - ObjY;
				var speedy = b/speed;
				var SignY = (speedy < 0) ? -1 : 1;
				speedy = Number(SignY * ((Math.abs(speedy) <= 1) ? 1 : Math.abs(speedy)));
				
				if (Math.abs(ObjY-DirectObj.GoalY) <= Math.abs(speedy)) { DirectObj.PosY = DirectObj.GoalY; DirectObj.MoveFlagY = true;	}
				else DirectObj.PosY = ObjY + speedy;
			}//end if
			
			DirectObj.style.left = DirectObj.PosX + 'px';
			DirectObj.style.top = DirectObj.PosY + 'px';
		} else {
			var DirectObj;
			var OMoveFlag = true;
			for (var i=0; i<this.getORankEns.length; i++) {
				DirectObj = this.getORankEns[i];
				if (!DirectObj.MoveFlagX) {
					var ObjX = DirectObj.PosX;
					var a = DirectObj.GoalX - ObjX;
					var speedx = a/speed;
					var SignX = (speedx < 0) ? -1 : 1;
					speedx = Number(SignX * ((Math.abs(speedx) <= 1) ? 1 : Math.abs(speedx)));
					
					if (Math.abs(ObjX-DirectObj.GoalX) <= Math.abs(speedx)) { DirectObj.PosX = DirectObj.GoalX; DirectObj.MoveFlagX = true;	}
					else DirectObj.PosX = ObjX + speedx;
				}//end if
				
				//check y position
				if (!DirectObj.MoveFlagY) {
					var ObjY = DirectObj.PosY;
					var b = DirectObj.GoalY - ObjY;
					var speedy = b/speed;
					var SignY = (speedy < 0) ? -1 : 1;
					speedy = Number(SignY * ((Math.abs(speedy) <= 1) ? 1 : Math.abs(speedy)));
					
					if (Math.abs(ObjY-DirectObj.GoalY) <= Math.abs(speedy)) { DirectObj.PosY = DirectObj.GoalY; DirectObj.MoveFlagY = true;	}
					else DirectObj.PosY = ObjY + speedy;
				}//end if
				
				DirectObj.style.left = DirectObj.PosX + 'px';
				DirectObj.style.top = DirectObj.PosY + 'px';
				
				OMoveFlag &= DirectObj.MoveFlagX & DirectObj.MoveFlagY;
			}//end for
			if (OMoveFlag) {
				clearInterval(this.IntervalID);
				if (!this.AutoPlay || this.FreezeFlag) return;
				clearTimeout(this.TimerIntervalID);
				var IDSet = 'Ranking' + this.id;
				this.TimerIntervalID = setTimeout(function() { ORanking[IDSet].VaryAction(0); }, this.Timer);
				return;
			}//end if
		}//end if
	}
	this.SwitchContent = function(DataObj) {
		clearInterval(this.IntervalID);
		clearTimeout(this.TimerIntervalID);
		this.DataObj.IconInfo = DataObj.IconInfo;
		this.FuncID = 0;
		this.TotalAmt = this.DataObj.IconInfo.length;
		this.PageAmt = Math.ceil(this.TotalAmt/this.MaxRows);
		this.CurrentPage = Math.ceil((this.FuncID + 1)/this.MaxRows);
		this.CurrentPage--;
		this.constructor();
	}
	this.constructor = RankingConstructor;
	this.constructor();
}

function RankingConstructor() {
	if (!$(this.CodeSection)) return;
	var Ranking = $(this.CodeSection);
	while (Ranking.childNodes.length > 0) Ranking.removeChild(Ranking.firstChild);
	Ranking.style.width = this.TotalWidth + 'px';
	Ranking.style.height = this.TotalHeight + 'px';
	//Ranking.style.background = '#ff0000';
	
	//RankingTopSet
	var RankingTopSet = document.createElement('div');
	RankingTopSet.className = 'RankingTopSet';
	Ranking.appendChild(RankingTopSet);
	//RankingTopSet - RankingTLeftSet
	var RankingTLeftSet = document.createElement('div');
	RankingTLeftSet.className = 'RankingTLeftSet';
	if (CurrentStatus.BrowserPNGfix.indexOf(CurrentStatus.Browser) != -1) {
		RankingTLeftSet.style.background = 'url(/img/transparent.gif)';
		RankingTLeftSet.style.filter = 'progid:DXImageTransform.Microsoft.AlphaImageLoader(src='+'/img/Ranking/BackRTLeft.png'+', sizingMethod=scale)';
	}//end if
	RankingTopSet.appendChild(RankingTLeftSet);
	//RankingTopSet - RankingTMidSet
	var RankingTMidSet = document.createElement('div');
	RankingTMidSet.className = 'RankingTMidSet';
	RankingTMidSet.style.width = this.TotalWidth - 16 + 'px';
	RankingTopSet.appendChild(RankingTMidSet);
	//RankingTopSet - RankingTMidSet - RankingTTitle
	var RankingTTitle = document.createElement('div');
	RankingTTitle.className = 'RankingTTitle';
	if (this.RankTop) {
		RankingTTitle.style.background = 'url(' + this.RankTop + ')';
		RankingTTitle.style.backgroundRepeat = 'no-repeat';
		RankingTTitle.style.backgroundPosition = 'center left';
	} else RankingTTitle.innerHTML = 'Ranking';
	RankingTMidSet.appendChild(RankingTTitle);
	//RankingTopSet - RankingTRightSet
	var RankingTRightSet = document.createElement('div');
	RankingTRightSet.className = 'RankingTRightSet';
	if (CurrentStatus.BrowserPNGfix.indexOf(CurrentStatus.Browser) != -1) {
		RankingTRightSet.style.background = 'url(/img/transparent.gif)';
		RankingTRightSet.style.filter = 'progid:DXImageTransform.Microsoft.AlphaImageLoader(src='+'/img/Ranking/BackRTRight.png'+', sizingMethod=scale)';
	}//end if
	RankingTopSet.appendChild(RankingTRightSet);
	
	//RankingMidSet
	var RankingMidSet = document.createElement('div');
	RankingMidSet.style.width = this.TotalWidth + 'px';
	RankingMidSet.style.height = this.TotalHeight - 33 - 3 + 'px';
	Ranking.appendChild(RankingMidSet);
	//RankingMidSet - RankingMLeftSet
	var RankingMLeftSet = document.createElement('div');
	RankingMLeftSet.className = 'RankingMLeftSet';
	RankingMLeftSet.style.height = parseInt(RankingMidSet.style.height, 10) - 8 + 'px';//RankingMidSet - ExtraSpace	
	if (CurrentStatus.BrowserPNGfix.indexOf(CurrentStatus.Browser) != -1) {
		RankingMLeftSet.style.background = 'url(/img/transparent.gif)';
		RankingMLeftSet.style.filter = 'progid:DXImageTransform.Microsoft.AlphaImageLoader(src='+'/img/Ranking/BackRMLeft.png'+', sizingMethod=scale)';
	}//end if
	RankingMidSet.appendChild(RankingMLeftSet);
	//RankingMidSet - RankingMMidSet
	var RankingMMidSet = document.createElement('div');
	RankingMMidSet.className = 'RankingMMidSet';
	RankingMMidSet.style.width = this.TotalWidth - 4 - 4 + 'px';//this.TotalWidth - LeftBorder - RightBorder
	RankingMMidSet.style.background = (this.BGSet.indexOf('#') != -1 && (this.BGSet.length >= 4 && this.BGSet.length <= 7)) ? this.BGSet : 'url('+this.BGSet+')';
	RankingMidSet.appendChild(RankingMMidSet);
	//RankingMidSet - RankingMRightSet
	var RankingMRightSet = document.createElement('div');
	RankingMRightSet.className = 'RankingMRightSet';
	RankingMRightSet.style.height = parseInt(RankingMidSet.style.height, 10) - 8 + 'px';//RankingMidSet - ExtraSpace	
	if (CurrentStatus.BrowserPNGfix.indexOf(CurrentStatus.Browser) != -1) {
		RankingMRightSet.style.background = 'url(/img/transparent.gif)';
		RankingMRightSet.style.filter = 'progid:DXImageTransform.Microsoft.AlphaImageLoader(src='+'/img/Ranking/BackRMRight.png'+', sizingMethod=scale)';
	}//end if
	RankingMidSet.appendChild(RankingMRightSet);
	
	//RankingBottomSet
	var RankingBottomSet = document.createElement('div');
	RankingBottomSet.className = 'RankingBottomSet';
	RankingBottomSet.style.width = this.TotalWidth + 'px';
	Ranking.appendChild(RankingBottomSet);
	//RankingBottomSet - RankingBLeftSet
	var RankingBLeftSet = document.createElement('div');
	RankingBLeftSet.className = 'RankingBLeftSet';
	if (CurrentStatus.BrowserPNGfix.indexOf(CurrentStatus.Browser) != -1) {
		RankingBLeftSet.style.background = 'url(/img/transparent.gif)';
		RankingBLeftSet.style.filter = 'progid:DXImageTransform.Microsoft.AlphaImageLoader(src='+'/img/Ranking/BackRBLeft.png'+', sizingMethod=scale)';
	}//end if
	RankingBottomSet.appendChild(RankingBLeftSet);
	//RankingBottomSet - RankingBMidSet
	var RankingBMidSet = document.createElement('div');
	RankingBMidSet.className = 'RankingBMidSet';
	RankingBMidSet.style.width = this.TotalWidth - 16 + 'px';
	RankingBottomSet.appendChild(RankingBMidSet);
	var RankingBMidSSet = document.createElement('div');
	RankingBMidSSet.className = 'RankingBMidSSet';
	RankingBMidSSet.style.width = this.TotalWidth - 16 + 'px';
	if (CurrentStatus.BrowserPNGfix.indexOf(CurrentStatus.Browser) != -1) {
		RankingBMidSSet.style.background = 'url(/img/transparent.gif)';
		RankingBMidSSet.style.filter = 'progid:DXImageTransform.Microsoft.AlphaImageLoader(src='+'/img/Ranking/BackRBMid.png'+', sizingMethod=scale)';
	}//end if
	RankingBMidSet.appendChild(RankingBMidSSet);
	//RankingBottomSet - RankingBRightSet
	var RankingBRightSet = document.createElement('div');
	RankingBRightSet.className = 'RankingBRightSet';
	if (CurrentStatus.BrowserPNGfix.indexOf(CurrentStatus.Browser) != -1) {
		RankingBRightSet.style.background = 'url(/img/transparent.gif)';
		RankingBRightSet.style.filter = 'progid:DXImageTransform.Microsoft.AlphaImageLoader(src='+'/img/Ranking/BackRBRight.png'+', sizingMethod=scale)';
	}//end if
	RankingBottomSet.appendChild(RankingBRightSet);
	
	//RankingTBSet
	var RankingTBSet = document.createElement('div');
	RankingTBSet.className = 'RankingTBSet';
	RankingTBSet.style.left = '4px';
	RankingTBSet.style.top = '8px';
	RankingTBSet.style.width = 10 + this.ContainerW + 10 +'px';
	RankingMMidSet.appendChild(RankingTBSet);
	//RankingTBSet - RankingTBL
	var RankingTBL = document.createElement('div');
	RankingTBL.className = 'RankingTBL';
	if (CurrentStatus.BrowserPNGfix.indexOf(CurrentStatus.Browser) != -1) {
		RankingTBL.style.background = 'url(/img/transparent.gif)';
		RankingTBL.style.filter = 'progid:DXImageTransform.Microsoft.AlphaImageLoader(src='+'/img/Ranking/BackRTitleBarL.png'+', sizingMethod=scale)';
	}//end if
	RankingTBSet.appendChild(RankingTBL);
	//RankingTBSet - RankingTBM
	var RankingTBM = document.createElement('div');
	RankingTBM.className = 'RankingTBM';
	RankingTBM.style.width = this.ContainerW + 'px';
	RankingTBSet.appendChild(RankingTBM);
	
	var RankingTBB = document.createElement('div');
	RankingTBB.className = 'RankingTBB';
	RankingTBB.style.width = this.BarBlock + 'px';
	for (var i=0; i<this.BarInfo.length; i++) {
		var BarElement = document.createElement('div');
		BarElement.className = 'RankingBarElement';
		BarElement.style.fontSize = '12px';
		BarElement.style.width = this.BarInfo[i].width + 'px';
		if (this.BarInfo[i].icon) {
			BarElement.style.background = 'url(' + this.BarInfo[i].icon + ')';
			BarElement.style.backgroundRepeat = 'no-repeat';
			BarElement.style.backgroundPosition = 'center left';
		} else BarElement.innerHTML = this.BarInfo[i].value;
		RankingTBM.appendChild(BarElement);
		RankingTBM.appendChild(RankingTBB.cloneNode(true));
	}//end for
	RankingTBM.removeChild(RankingTBM.lastChild);
	//RankingTBSet - RankingTBR
	var RankingTBR = document.createElement('div');
	RankingTBR.className = 'RankingTBR';
	if (CurrentStatus.BrowserPNGfix.indexOf(CurrentStatus.Browser) != -1) {
		RankingTBR.style.background = 'url(/img/transparent.gif)';
		RankingTBR.style.filter = 'progid:DXImageTransform.Microsoft.AlphaImageLoader(src='+'/img/Ranking/BackRTitleBarR.png'+', sizingMethod=scale)';
	}//end if
	RankingTBSet.appendChild(RankingTBR);
	
	//MainContainer
	this.getORankEns = [];
	var MainContainer = document.createElement('div');
	MainContainer.className = 'RankingMContainer';
	MainContainer.style.width = this.ContainerW + 'px';
	MainContainer.style.height = (this.ContainerH  + this.ContainerBlock) * this.MaxRows - this.ContainerBlock + 'px';
	MainContainer.ClassID = this.id;
	if (this.AutoPlay) {
		MainContainer.onmouseover = function() { clearTimeout(ORanking['Ranking' + this.ClassID].TimerIntervalID); ORanking['Ranking' + this.ClassID].FreezeFlag = true; };
		MainContainer.onmouseout = function() {	ORanking['Ranking' + this.ClassID].GoAuto(); };
	}//end if
	//MainContainer.style.background = '#ff0000';
	RankingMMidSet.appendChild(MainContainer);
	
	for (var i=0; i<this.MaxRows; i++) {
		var CElement = document.createElement('div');
		CElement.className = 'RankingCE';
		CElement.style.top = (this.ContainerH  + this.ContainerBlock) * i + 'px';
		CElement.style.width = this.ContainerW + 'px';
		CElement.style.height = this.ContainerH + 'px';
		CElement.style.clip = 'rect(0px, ' + this.ContainerW + 'px, ' + this.ContainerH + 'px, 0px)';
		MainContainer.appendChild(CElement);
		
		//RankingREns
		var RankEns = document.createElement('div');
		RankEns.className = 'RankingREns';
		RankEns.style.left = '0px';
		RankEns.style.top = this.ContainerH + 'px';
		RankEns.style.width = this.ContainerW + 'px';
		RankEns.style.height = this.ContainerH + 'px';
		RankEns.MoveFlagX = false;
		RankEns.MoveFlagY = false;
		RankEns.PosX = 0;
		RankEns.PosY = this.ContainerH;
		RankEns.GoalX = 0;
		RankEns.GoalY = 0;
		RankEns.ClassID = this.id;
		//RankEns.style.background = '#ff0000';
		CElement.appendChild(RankEns);
		this.getORankEns.push(RankEns);
		for (var j=0; j<this.BarInfo.length; j++) {
			var RankEnsElement = document.createElement('div');
			RankEnsElement.style.width = this.BarInfo[j].width + 'px';
			RankEnsElement.style.height = this.ContainerH + 'px';
			if (this.BarInfo[j].id != 'RankID') RankEnsElement.innerHTML = this.BarInfo[j].id;
			RankEns.appendChild(RankEnsElement);
			RankEns[this.BarInfo[j].id] = RankEnsElement;
			
			var BlockSet = RankingTBB.cloneNode(true);
			BlockSet.style.background = 'transparent';
			RankEns.appendChild(BlockSet);
			
			if (this.BarInfo[j].id == 'RankID') {
				RankEnsElement.ClassID = this.id;
				RankEnsElement.onmouseover = function() { this.style.color = '#0088cc'; this.getIcon.style.borderColor = '#ff0084'; };
				RankEnsElement.onmouseout = function() { this.style.color = '#797c80'; this.getIcon.style.borderColor = '#797c80'; };
				RankEnsElement.onclick = function() {
					var IDSet = 'Ranking' + this.ClassID;
					ORanking[IDSet].ClickAction(this); 
				}
				//IconPart
				var IconPart = document.createElement('div');
				IconPart.className = 'RankingIconPart';
				IconPart.style.width = this.ContainerH + 2 + 'px';//Icon width + block
				RankEnsElement.appendChild(IconPart);
				var IconSet = document.createElement('img');
				IconSet.src = '/img/transparent.gif';
				IconSet.style.width = this.ContainerH - 2 + 'px';
				IconSet.style.height = this.ContainerH - 2 + 'px';
				IconSet.onerror = function() { this.src = '/img/icon_p_default.gif'; };
				IconPart.appendChild(IconSet);
				RankEnsElement.getIconPart = IconPart;
				RankEnsElement.getIcon = IconSet;
				//IdPart
				var IdPart = document.createElement('div');
				IdPart.className = 'RankingIdPart';
				IdPart.EW = parseInt(RankEnsElement.style.width, 10);
				IdPart.SW = parseInt(RankEnsElement.style.width, 10) - this.ContainerH - 2 * 2;//IdPart.EW - IconPart - block * 2
				IdPart.style.width = IdPart.SW + 'px';
				IdPart.style.height = this.ContainerH + 'px';
				RankEnsElement.appendChild(IdPart);
				RankEnsElement.getId = IdPart;
			} else {
				RankEnsElement.style.lineHeight = this.ContainerH + 'px';
				RankEnsElement.style.textAlign = 'center';
			}//end if
		}//end for
		RankEns.removeChild(RankEns.lastChild);
		
		var RankingMCB = document.createElement('div');
		RankingMCB.className = 'RankingMCB';
		RankingMCB.style.height = this.ContainerBlock + 'px';
		RankingMCB.style.top = (this.ContainerH + this.ContainerBlock) * i + this.ContainerH + 'px';
		MainContainer.appendChild(RankingMCB);
	}//end for
	MainContainer.removeChild(MainContainer.lastChild);
	
	//RankingLeftArrow
	var TopSet = Math.floor((8 + 20 + 8 + (this.ContainerH + this.ContainerBlock) * this.MaxRows - this.ContainerBlock + 3)/2 - 15/2);
	var LeftArrow = document.createElement('div');
	LeftArrow.id = this.id + '#RankLeftArrow';
	LeftArrow.className = 'RankingLeftArrow';
	LeftArrow.ClassID = this.id;
	LeftArrow.style.top =  TopSet + 'px';
	if (CurrentStatus.BrowserPNGfix.indexOf(CurrentStatus.Browser) != -1) {
		LeftArrow.style.background = 'url(/img/transparent.gif)';
		LeftArrow.style.filter = 'progid:DXImageTransform.Microsoft.AlphaImageLoader(src=/img/Ranking/BtnPageUpOut.png, sizingMethod=scale)';
	} else LeftArrow.style.background = 'url(/img/Ranking/BtnPageUpOut.png) no-repeat';
	LeftArrow.onmouseover = function() { ORanking['Ranking'+this.ClassID].ArrowRollEffect(this.id, 'Over'); };
	LeftArrow.onmouseout = function() { ORanking['Ranking'+this.ClassID].ArrowRollEffect(this.id, 'Out'); };
	LeftArrow.onclick = function() { ORanking['Ranking'+this.ClassID].VaryAction(1); };
	RankingMMidSet.appendChild(LeftArrow);
	
	//RankingRightArrow
	var RightArrow = document.createElement('div');
	RightArrow.id = this.id + '#RankRightArrow';
	RightArrow.className = 'RankingRightArrow';
	RightArrow.ClassID = this.id;
	RightArrow.style.top = TopSet + 'px';
	if (CurrentStatus.BrowserPNGfix.indexOf(CurrentStatus.Browser) != -1) {
		RightArrow.style.background = 'url(/img/transparent.gif)';
		RightArrow.style.filter = 'progid:DXImageTransform.Microsoft.AlphaImageLoader(src=/img/Ranking/BtnPageDownOut.png, sizingMethod=scale)';
	} else RightArrow.style.background = 'url(/img/Ranking/BtnPageDownOut.png) no-repeat';
	RightArrow.onmouseover = function() { ORanking['Ranking'+this.ClassID].ArrowRollEffect(this.id, 'Over'); };
	RightArrow.onmouseout = function() { ORanking['Ranking'+this.ClassID].ArrowRollEffect(this.id, 'Out'); };
	RightArrow.onclick = function() { ORanking['Ranking'+this.ClassID].VaryAction(2); };
	RankingMMidSet.appendChild(RightArrow);
	
	//VaryAction
	this.VaryAction(0);//Mode: 0 / 1 / 2 => Normal / Left / Right
	if (!CurrentStatus.RankingKeyControl) CurrentStatus.RankingKeyControl = [];
	if (this.KeyControlable && CurrentStatus.RankingKeyControl.indexOf(this.id) == -1) CurrentStatus.RankingKeyControl.push(this.id);
}

function rank_init() {
	try {
	  document.execCommand("BackgroundImageCache", false, true);
	} catch(err) {}

	if(typeof(IconInfo) != "undefined" && IconInfo.length>0) {
    	
    	var BarInfoSet = [
    		{id:'Rank', value:'排名',  width:30},
    		{id:'RankID', value:'姓名(積分)', width:200},
    		{id:'Status', value:'異動', width:40}
    	];
    	
    	if (typeof(ORanking) == 'undefined') ORanking = {};
    	
    	ORanking.RankingPost = new Ranking('Post', {CodeSection:'PostSection', IconInfo:IconInfo, FuncID:1, BarInfo:BarInfoSet, MaxRows:5, ContainerBlock:10, BarBlock:8, RankTop:'./img/Ranking/RankingTitle.png', BGSet:'#f2f2f2', KeyControlable:true, AutoPlay:true});//FuncID: Start Rank; BGSet: color || img;
    }
	
	
}