﻿var ComparePage =
{
	catIDParent : -1,
	catIDChild : -1,
	requestProID : "",
	strCatID : "",
	oListPro_1 : null,
	oListPro_2 : null,
	oListPro_3 : null,

	/*********************************List Parent*************************************/
	init : function()
	{
		var list = this.getListProIni();
		
		/*******************************Init****************************************/
		var regID = utilObj.getElById("CompareReID").innerHTML.trim();
		var catID = utilObj.getElById("CompareCatID").innerHTML.trim();
		this.requestProID = utilObj.getElById("requestProID").innerHTML.trim().split(",");
		/*******************************Init****************************************/
		
		this.oListPro_1 = new DropDownList$BTD("containerListPro_1", list, "ComparePage.oListPro_1");
		this.oListPro_1.addEvent("change", function() { ComparePage.showProTech(regID, ComparePage.oListPro_1.getValue(), 1); });
		this.oListPro_2 = new DropDownList$BTD("containerListPro_2", list, "ComparePage.oListPro_2");
		this.oListPro_2.addEvent("change", function() { ComparePage.showProTech(regID, ComparePage.oListPro_2.getValue(), 3); });
		this.oListPro_3 = new DropDownList$BTD("containerListPro_3", list, "ComparePage.oListPro_3");
		this.oListPro_3.addEvent("change", function() { ComparePage.showProTech(regID, ComparePage.oListPro_3.getValue(), 5); });
		if (catID != "")
		{
			this.catIDChild = catID;
			var item = listItemsCatAll[this.catIDChild];
			var arrID = this.getParentHasAtt(item).id.split("*");
			this.catIDParent = arrID[arrID.length - 1];
			this.changeChild(this.catIDParent, true);
			this.createMapLink(this.catIDChild);
			
			// Selected default value
			for (var i = 0; i < this.requestProID.length; i++)
			{
				if (this.requestProID[i].trim() == "" || isNaN(this.requestProID[i]))
				{
					continue;
				}
				if (i == 0)
				{
					this.oListPro_1.selectedValue(this.requestProID[i]);
				}
				else if (i == 1)
				{
					this.showProTech(regID, this.requestProID[i], 3);
					this.oListPro_2.selectedValue(this.requestProID[i]);
				}
				else if (i == 2)
				{
					this.showProTech(regID, this.requestProID[i], 5);
					this.oListPro_3.selectedValue(this.requestProID[i]);
				}
				else
				{
					break;
				}
			}
		}
		else
		{
			this.clearAll();
		}
		var oSel = utilObj.getElById("myListParentCat");
		utilObj.addEvent(oSel, "change", function() { ComparePage.changeChild(oSel.value, false); });
		
		oSel.appendChild(this.createOption("", "-1", "---None---"));
		this.loadParentHasAtt(oSel, listItemsCat, false);
	},
	
	/* ***************************** Create Map Link *************************************/
	createMapLink : function(catID)
	{
		if (listItemsCatAll[catID] != null)
		{
			var item = listItemsCatAll[catID];
			MapLink.resetList();
			while (item != null)
			{
				MapLink.addNode(item.content, item.url);
				item = item.parent;
			}
			MapLink.addNode("So sánh sản phẩm", "catSupport_Click('#Compare', true);");
			MapLink.addNode("Trang chủ", "otherLink_Click('#Home', false);");
			MapLink.buildMapLink();
		}
		else
		{
			MapLink.hide();
		};
	},
	/* ***************************** Create Map Link *************************************/
	
	getListProIni : function()
	{
		var re = [];
		var arrItem = utilObj.getElById("listPro").innerHTML.split(BKC.__sepAtt);
		for (var i = 0; i < arrItem.length; i++)
		{
			var temp = arrItem[i].split(BKC.__sepStart);
			if (re[temp[0]] == null) re[temp[0]] = temp[1];
		}
		return re;
	},
	
	loadParentHasAtt : function(oSel, list, checkIsChild)
	{
		for (var i = 0; i < list.length; i++)
		{
			var item = list[i];
			var chk = false;
			if (checkIsChild)
			{
				chk = item.hasAttribute && !item.isChild;
			}
			else
			{
				chk = item.hasAttribute;
			}
			if (chk)
			{
				oSel.appendChild(this.createOption(this.catIDParent, item.id, item.content));
				this.loadParentHasAtt(oSel, item.listChild, true);
			}
			else
				this.loadParentHasAtt(oSel, item.listChild, false);
		};
	},
	/*********************************List Parent*************************************/
	
	/*********************************List Child*************************************/
	changeChild : function(idParent, isInit)
	{
		var oSel_1 = utilObj.getElById("myListChildCat_1");
		var oSel_2 = utilObj.getElById("myListChildCat_2");
		var oSel_3 = utilObj.getElById("myListChildCat_3");
		utilObj.clearItemSelect(oSel_1);
		utilObj.clearItemSelect(oSel_2);
		utilObj.clearItemSelect(oSel_3);
		oSel_1.appendChild(this.createOption("", "-1", "---All---"));
		utilObj.addEvent(oSel_1, "change", function() { ComparePage.changeSingleProduct(oSel_1.value, ComparePage.oListPro_1); });
		oSel_2.appendChild(this.createOption("", "-1", "---All---"));
		utilObj.addEvent(oSel_2, "change", function() { ComparePage.changeSingleProduct(oSel_2.value, ComparePage.oListPro_2); });
		oSel_3.appendChild(this.createOption("", "-1", "---All---"));
		utilObj.addEvent(oSel_3, "change", function() { ComparePage.changeSingleProduct(oSel_3.value, ComparePage.oListPro_3); });
		this.strCatID = idParent;
		this.loadAllChildHasAtt(oSel_1, oSel_2, oSel_3, listItemsCatAll[idParent].listChild);
		if (!isInit)
		{
			this.changeProduct(this.strCatID);
			this.clearAll();
		};
	},
	
	loadAllChildHasAtt : function(oSel_1, oSel_2, oSel_3, list)
	{
		for (var i = 0; i < list.length; i++)
		{
			var item = list[i];
			if (item.hasAttribute)
			{
				oSel_1.appendChild(this.createOption(this.catIDChild, item.id, item.content));
				oSel_2.appendChild(this.createOption(this.requestProID.length == 2 ? this.catIDChild : "", item.id, item.content));
				oSel_3.appendChild(this.createOption(this.requestProID.length == 3 ? this.catIDChild : "", item.id, item.content));
				var arID = item.id.split("*");
				if (this.strCatID != "") this.strCatID += ",";
				this.strCatID += arID[arID.length - 1];
			}
			this.loadAllChildHasAtt(oSel_1, oSel_2, oSel_3, item.listChild);
		}
	},
	/*********************************List Child*************************************/
	
	/*********************************List Product*************************************/
	changeProduct : function(strCatID)
	{
		var listPro = oAjax.getListProduct(strCatID);
		this.oListPro_1.loadListItems(listPro);
		this.oListPro_2.loadListItems(listPro);
		this.oListPro_3.loadListItems(listPro);
	},
	
	changeSingleProduct : function(strCatID, o)
	{
		var listPro = oAjax.getListProduct(strCatID);
		o.loadListItems(listPro);
	},
	/*********************************List Product*************************************/
	
	createOption : function(firstID, id, text)
	{
		var arID = id.split("*");
		id = arID[arID.length - 1];
		var oOption = utilObj.createEl("OPTION");
		oOption.value = id;
		oOption.innerHTML = text;
		if (firstID == id) oOption.selected = true;
		return oOption;
	},
	
	getParentHasAtt : function(item)
	{
		while (item.parent != null && item.parent.hasAttribute)
		{
			item = item.parent;
		}
		return item;
	},
	
	clearAll : function()
	{
		var o = utilObj.getElById("idCompareTable").tBodies[0];
		for (var i = o.rows.length - 1; i >= 0; i--)
		{
			o.deleteRow(i);
		}
		var oF = utilObj.getElById("idCompareTable").tFoot;
		oF.style.display = "none";
		this.showProImg(null, 1);
		this.showProImg(null, 3);
		this.showProImg(null, 5);
		this.showProPrice(null, 1);
		this.showProPrice(null, 3);
		this.showProPrice(null, 5);
		this.showBtnDetailPro(-1, 1);
		this.showBtnDetailPro(-1, 3);
		this.showBtnDetailPro(-1, 5);
		
	},
	
	showProImg : function(v, col)
	{
		var idImg = "imgPro_1";
		switch(col)
		{
			case 3:
				idImg = "imgPro_2";
				break;
			case 5:
				idImg = "imgPro_3";
				break;
		}
		var o = utilObj.getElById(idImg);
		
		if (v != null)
		{
			o.src = v;
			o.style.display = "";
		}
		else
		{
			o.style.display = "none";
		}
	},
	
	showProPrice : function(v, col)
	{
		var idDisPrice = "pricePro_1";
		switch(col)
		{
			case 3:
				idDisPrice = "pricePro_2";
				break;
			case 5:
				idDisPrice = "pricePro_3";
				break;
		}
		var o = utilObj.getElById(idDisPrice);
		if (v != null)
		{
			o.innerHTML = v;
			o.style.display = "";
		}
		else
		{
			o.style.display = "none";
		}
	},
	
	showProComment : function(v, col)
	{
		var oF = utilObj.getElById("idCompareTable").tFoot;
		oF.style.display = "";
		oF.rows[1].cells[col].style.textAlign = "center";
		oF.rows[1].cells[col].style.padding = "2px";
		oF.rows[1].cells[col].innerHTML = v;
	},
	
	showBtnDetailPro : function(v, col)
	{
		var idBtn = "btnDetailPro_1";
		switch(col)
		{
			case 3:
				idBtn = "btnDetailPro_2";
				break;
			case 5:
				idBtn = "btnDetailPro_3";
				break;
		}
		var o = utilObj.getElById(idBtn);
		if (v != -1)
		{
			o.style.display = "";
		}
		else
		{
			o.style.display = "none";
		}
	},
	
	btnDetailPro : function(o, e)
	{
		catProduct_Click("#DetailProduct?ProID=" + o.getValue(), true, e);
	},
	
	showProTech : function(regID, proID, col)
	{
		this.showBtnDetailPro(proID, col);
		var listTech = oAjax.loadProTech(proID, regID);
		this.showProComment(listTech["ComparePro-Comment"], col);
		this.showProImg(listTech["ComparePro-UrlImg"], col);
		this.showProPrice(listTech["ComparePro-Price"], col);
		var o = utilObj.getElById("idCompareTable").tBodies[0];
		var r = o.rows;
		var listTemp = [];
		var listRemove = [];
		for (var i = 0; i < r.length; i++)
		{
			var c = r[i].cells;
			if (listTech[c[0].title] != null)
			{
				c[col].style.padding = "2px";
				c[col].innerHTML = listTech[c[0].title];
				c[col].style.textAlign = "left";
				listTemp[c[0].title] = 0;
			}
			else
			{
				if (i % 2 != 0)
				{
					c[col].innerHTML = "--None--";
					c[col].style.textAlign = "center";
					if ( (c[1].innerHTML == "--None--" || c[1].innerHTML.trim() == "")
						&& (c[3].innerHTML == "--None--" || c[3].innerHTML.trim() == "")
						&& (c[5].innerHTML == "--None--" || c[5].innerHTML.trim() == ""))
					{
						listRemove.push(r[i - 1]);
						listRemove.push(r[i]);
					}
				}
				else c[col].innerHTML = "";
			}
		}
		
		for (var name in listTech)
		{
			if (name != "extend" && 
				name != "ComparePro-UrlImg" && 
				name != "ComparePro-Price" && 
				name != "ComparePro-Comment" && 
				listTemp[name] == null)
			{
				this.insertNewLineSep(o.insertRow(r.length));
				var nr = o.insertRow(r.length);
				if ( (r.length / 2) % 2 == 0)
				{
					nr.style.backgroundColor = "#F7F7F7";
				}
				this.insertNewLineContent(nr, name, listTech[name], col);
			}
		}
		
		for (var i = 0; i < listRemove.length; i++)
		{
			o.removeChild(listRemove[i]);
		}
	},
	
	insertNewLineSep : function(r)
	{
		var c = r.insertCell(0);
		c.className = "bgLine";
		c.style.width = "90px";
		
		c = r.insertCell(1);
		c.className = "bgLineContent";
		c.style.width = "225px";
		
		c = r.insertCell(2);
		c.style.width = "1px";
		c.style.fontSize = "0px";
		c.style.backgroundColor = "#737373";
		
		c = r.insertCell(3);
		c.className = "bgLineContent";
		c.style.width = "225px";
		
		c = r.insertCell(4);
		c.style.width = "1px";
		c.style.fontSize = "0px";
		c.style.backgroundColor = "#737373";
		
		c = r.insertCell(5);
		c.className = "bgLineContent";
		c.style.width = "225px";
	},
	
	insertNewLineContent : function(r, name, content, col)
	{
		var c = r.insertCell(0);
		c.className = "titleAtt";
		c.style.width = "90px";
		c.title = name;
		c.innerHTML = name;
		
		c = r.insertCell(1);
		if (col == 1) this.updateContent(c, content);
		else c.innerHTML = "--None--";
		
		c = r.insertCell(2);
		c.style.width = "1px";
		c.style.fontSize = "0px";
		c.style.backgroundColor = "#737373";
		
		c = r.insertCell(3);
		if (col == 3) this.updateContent(c, content);
		else c.innerHTML = "--None--";
		
		c = r.insertCell(4);
		c.style.width = "1px";
		c.style.fontSize = "0px";
		c.style.backgroundColor = "#737373";
		
		c = r.insertCell(5);
		if (col == 5) this.updateContent(c, content);
		else c.innerHTML = "--None--";
	},
	
	updateContent : function(o, con)
	{
		o.style.width = "225px";
		o.style.textAlign = "left";
		o.style.padding = "2px";
		o.style.verticalAlign = "top";
		o.innerHTML = con;
	}
};