Mys.relationList = function(config)
{
	Mys.relationList.superclass.constructor.call(this, config);
	
	this.on("move", function(start, maxRow){
		var boardID;
		
		this.onTab();
		this.startLoading();
		
		if(this.boardID)
			boardID = this.tab == "post" ? this.boardID : (parseInt(this.boardID) || 1) + 20;
		else if(this.tab != "post")
			boardID = [21,22,23,24,25,26,27,28,29,30,31];
		
		Global.modelItem.getList(boardID, this.tab == "post" ? 1 : 3, this.order, this.dir, null, null, null, null, null, null, start, maxRow, null, this.tab == "post" ? 1 : 0, null, null, function(data){
			if(data && data.response.code == 100)
				this.update(data.response.item, data.response.total);
			else
				this.empty();
		}, this)
	}, this);
};

Ext.extend(Mys.relationList, Mys.TemplateList, {
	dir : "desc",
	tab : "post",
	
	className : "mys-relation",
	maxRow : 3,
	elTemplate : (new Ext.Template([
		'<div class="{className}" width="160" style="" border="0" cellspacing="0" cellpadding="0">',
			'<div class="{headerClassName}"></div>',
			'<div>',
				'<div style="width=157px; padding: 5px 0px;margin : 0px; border-bottom : 1px solid #e1e1e1; border-right : 1px solid #e1e1e1; border-left : 1px solid #e1e1e1;"class="{bodyClassName}"></div>',
				'<div style="width=157px; padding: 5px 0px;margin : 0px; border-bottom : 1px solid #e1e1e1; border-right : 1px solid #e1e1e1; border-left : 1px solid #e1e1e1; text-align : center;" class="{emptyClassName}">내용이 없습니다.</div>',
				'<div class="{loadingClassName}"><img class="mys-loading-img" src="/images/common/loadinbar.gif"/></div>',
				'<div class="{pagerClassName}"></div>',
			'</div>',
		'</div>'
	])).compile(),
	
	headerTemplate : (new Ext.Template([
		'<a href="javascript:;" class="mys-custom-tab" onfocus="blur()" value="post" title="관련후기"><div style="border-top : 1px solid #e1e1e1; border-left : 1px solid #e1e1e1; border-right : 1px solid #e1e1e1;" class="review"><img src="/images/blank.gif" border="0" /></div></a>',
		'<a href="javascript:;" class="mys-custom-tab" onfocus="blur()" value="semina" title="관련동영상"><div style="border-top : 1px solid #e1e1e1; border-right : 1px solid #e1e1e1;" class="movie"><img src="/images/blank.gif" border="0" /></div></a>'
	])).compile(),
	
	itemClass : Mys.relationItem,
	
	setEvents : function()
	{
		this.tabEl = this.el.select(".mys-custom-tab");
		
		this.tabEl.on("click", this.onTabClick, this);
		this.tabEl.on("mouseover", this.onTabOverOut, this);
		this.tabEl.on("mouseout", this.onTabOverOut, this);
		
		this.onTab();
	},
	
	onTabOverOut : function(e, el)
	{
		Ext.fly(e.getTarget("a")).toggleClass("mys-tab-over");
	},
	
	onTabClick : function(e, el)
	{
		this.setTab(e.getTarget("a").getAttribute("value"));
	},
	
	setTab : function(tab)
	{
		this.tab = tab;
		
		this.refresh();
	},
	
	onTab : function()
	{
		this.tabEl.each(function(el){
			if(el.dom.getAttribute("value") == this.tab)
				el.addClass("active");
			else
				el.removeClass("active");
		}, this);
	},
	
	load : function(data)
	{
		if(data && (data.board_type == 1 || data.board_type == 3))
		{
			if(data.board_type == 3)
				this.boardID = (20 < data.board_id && data.board_id <= 31 ? data.board_id - 20 : null);
			else if(data.board_type == 1)
			{
				if(data.board_id >300)
					data.board_id = 3;
				this.boardID = data.board_id;
			}
			else
				this.boardID = null;
		}
		
		//관련 카테고리가 있으면 등록순, 없으면 인기순
		this.order = this.boardID ? "insert_date" : "agree_count";
		this.tab = "post";
		
		this.refresh();
	},
	
	
	updateData : function(data)
	{
		this.data = data;
		
		this.items = [];
		
		this.bodyEl.update('');
		
		for(var i = 0, inner = ''; i < data.length && i < this.maxRow; i++)
		{
			var item = new this.itemClass(data[i], Ext.apply(this.itemConfig, {list : this}));
			this.items.push(item);
			
			item.append(this.bodyEl);
			
			if(i != data.length - 1)
				this.bodyEl.dom.innerHTML += '<div class="mys-relation-list-partytion" style="border-bottom:1px dotted #e1e1e1;"></div>';
		}
	}
});