﻿DropDownList$BTD = function(idParent, list, myName, myStyle, isCbo)
{
	this.list = list;
	this.myName = myName;
	this.myStyle = typeof(myStyle) == "undefined" ? "" : myStyle;
	this.heightItem = 14;
	this.maxItem = 20;
	this.listLength = 0;
	this.oContainerList = null;
	this.oContainer = null;
	this.oTableList = null;
	if (typeof(isCbo) == "undefined" || !isCbo)
	{
		this.oContainerParent = utilObj.getElById(idParent);
	}
	else
	{
		var oCbo = utilObj.getElById(idParent);
		this.oContainerParent = oCbo.parentNode;
		this.list = [];
		this.createListFromCbo(oCbo);
		this.oContainerParent.removeChild(oCbo);
	}
	
	this.listEvent = new Array();
	this.item = {value: null, text: "" };
	this.oldValue = "";
	
	/*************** Properties ******************/
	this.isTextBoxReadOnly = false;
	this.enabledAutoCom = true;
	/*************** Properties ******************/
	
	if (this.oContainerParent != null) this.createMain();
	var self = this;
	this.alreadyKeyDown = false;
	
	this.whenKeyDown = function(e)
	{
		self.documentKeyDownDDL(e);
	};
};

DropDownList$BTD.prototype.createMain = function()
{
	try
	{
		this.createContainer();
		this.createContainerList();
		var self = this;
		utilObj.addEvent(document, "mousedown", function(e) { self.documentMouseDownDDL(e); });
	}
	catch (e)
	{ }
};

//************************Create Event************************************//

DropDownList$BTD.prototype.createListFromCbo = function(oCbo)
{
	try
	{
		for (var i = 0; i < oCbo.length; i++)
		{
			if (this.list[oCbo[i].value] == null) this.list[oCbo[i].value] = oCbo[i].text;
		}
	}
	catch (e)
	{ }
};

//************************Create Event************************************//

DropDownList$BTD.prototype.executeEvent = function(e, eventName)
{
	if (this.listEvent[eventName] != null)
	{
		for (var i = 0; i < this.listEvent[eventName].length; i++)
		{
			this.listEvent[eventName][i](e);
		}
	}
};

DropDownList$BTD.prototype.createContainer = function()
{
	var o = utilObj.createEl("DIV");
	o.id = "containerDropDownList_" + this.myName;
	o.className = "containerDropDownList" + this.myStyle;
	this.createInput(o);
	this.createButton(o);
	this.oContainerParent.appendChild(o);
	this.oContainer = o;
};

DropDownList$BTD.prototype.enableIextBox = function()
{
	this.isTextBoxReadOnly = false;
	this.oTextBox.readOnly = this.isTextBoxReadOnly;
};

DropDownList$BTD.prototype.disableIextBox = function()
{
	this.isTextBoxReadOnly = true;
	this.oTextBox.readOnly = this.isTextBoxReadOnly;
};

DropDownList$BTD.prototype.createInput = function(oParent)
{
	var o = utilObj.createEl("INPUT");
	o.id = "inputDropDownList_" + this.myName;
	o.className = "inputDropDownList" + this.myStyle;
	o.readOnly = this.isTextBoxReadOnly;
	var self = this;
	utilObj.addEvent(o, "mouseover", function(e) { self.mouseOverDDL(e); });
	utilObj.addEvent(o, "mouseout", function(e) { self.mouseOutDDL(e); });
	utilObj.addEvent(o, "click", function(e) { self.mouseClickDDL(e); });
	utilObj.addEvent(o, "keydown", function(e) { self.textBoxKeyDownDDL(e); });
	utilObj.addEvent(o, "focus", function(e) { self.mouseFocusDDL(e); });
	this.oTextBox = o;
	oParent.appendChild(o);
};

DropDownList$BTD.prototype.createButton = function(oParent)
{
	var o = utilObj.createEl("DIV");
	o.id = "imgDropDownList_" + this.myName;
	o.className = "imgDropDownList" + this.myStyle;
	var self = this;
	utilObj.addEvent(o, "mouseover", function(e) { self.mouseOverDDL(e); });
	utilObj.addEvent(o, "mouseout", function(e) { self.mouseOutDDL(e); });
	utilObj.addEvent(o, "click", function(e) { self.mouseClickDDL(e); });
	utilObj.addEvent(o, "focus", function(e) { self.mouseFocusDDL(e); });
	this.oBtn = o;
	oParent.appendChild(o);
};

//************************Create Event************************************//

DropDownList$BTD.prototype.documentMouseDownDDL = function(e)
{
	var o = utilObj.getTargetElement();
	if (o.className.indexOf("itemListDDL") != -1 ||
		o.className.indexOf("inputDropDownList") != -1 ||
		o.className.indexOf("imgDropDownList") != -1 ||
		o.className.indexOf("divListDDL") != -1)
	{
		return;
	}
	this.hideList();
};

DropDownList$BTD.prototype.mouseFocusDDL = function(e)
{
	if (!this.alreadyKeyDown)
	{
		this.alreadyKeyDown = true;
		utilObj.addEvent(document, "keydown", this.whenKeyDown);
	}
	this.executeEvent(e, "focus");
};

DropDownList$BTD.prototype.mouseOverDDL = function(e)
{
	this.oBtn.className = "imgDropDownList_over" + this.myStyle;
	this.executeEvent(e, "mouseover");
};

DropDownList$BTD.prototype.mouseOutDDL = function(e)
{
	this.oBtn.className = "imgDropDownList" + this.myStyle;
	this.executeEvent(e, "mouseout");
};

DropDownList$BTD.prototype.mouseClickDDL = function(e)
{
	this.showList(e);
	this.executeEvent(e, "click");
};

DropDownList$BTD.prototype.textBoxKeyDownDDL = function(e)
{
	if (!this.alreadyKeyDown)
	{
		this.alreadyKeyDown = true;
		utilObj.addEvent(document, "keydown", this.whenKeyDown);
	}
	if (this.oContainerList.style.display == "none")
	{
		this.mouseClickDDL(e);
	}
};

DropDownList$BTD.prototype.documentKeyDownDDL = function(e)
{
	var e = utilObj.getWindowEvent();
	switch (e.keyCode)
	{
		case 38:
			this.gotoItem(true);
			break;
		case 40:
			this.gotoItem(false);
			break;
		case 27:
			this.hideList();
			break;
		case 13: case 9:
			if (this.oldItem != null && this.enabledAutoCom)
			{
				this.clickItemDDL(this.oldItem, this.oldItem.keyItem, e);
			}
			else if (this.oTextBox.value != this.oldValue) // No Use AutoComplete
			{
				this.oldValue = this.oTextBox.value;
				this.hideList();
				this.executeEvent(e, "change");
			}
			utilObj.stopEvent();
			break;
		default:
			var self = this;
			if (!this.isTextBoxReadOnly)
			{
				setTimeout( function() { self.toComplete(); }, 50);
			}
			break;
	}
	return false;
};
//************************Create Event************************************//

DropDownList$BTD.prototype.toComplete = function()
{
	var row = 1;
	for (var value in this.list)
	{
		if (typeof(this.list[value]) == "string")
		{
			var v = this.list[value].toUpperCase();
			var vSearch = this.oTextBox.value.toUpperCase();
			if (v.indexOf(vSearch, 0) == 0)
			{
				if (this.oldItem != null)
				{	
					this.oldItem.className = "itemListDDL" + this.myStyle;
				}
				var id = "CellDDL_" + row + "_" + this.myName;
				var o = utilObj.getElById(id);
				if (o != null)
				{
					var curentPos = (row - 1) * this.heightItem;
					this.oContainerList.scrollTop = curentPos;
					o.className = "itemListDDL_over" + this.myStyle;
					this.oldItem = o;
				}
				break;
			}
			row++;
		}
	}
};

DropDownList$BTD.prototype.gotoItem = function(isUp)
{
	var row = 0;
	if (this.oldItem != null)
	{
		var id = parseInt(this.oldItem.id.split("_")[1]);
		if ((id == 1 && isUp) || (id == this.oTableList.rows.length && !isUp)) return;
		
		this.oldItem.className = "itemListDDL" + this.myStyle;
		row = isUp ? (id - 1) : (id + 1);
		
	}
	else
	{
		row = 1;
	}
	var id = "CellDDL_" + row + "_" + this.myName;
	var c = utilObj.getElById(id);
	if (c != null)
	{
		var curentPos = (row - 1) * this.heightItem;
		var startPos = this.oContainerList.scrollTop;
		var endPos = startPos + (this.maxItem * this.heightItem);
		
		if (startPos > curentPos || endPos <= curentPos)
		{
			var scrollDown = curentPos - (this.maxItem * this.heightItem) + this.heightItem;
			this.oContainerList.scrollTop = isUp ? curentPos : (scrollDown < 0 ? 0 : scrollDown);
		}
		//c.focus();
		c.className = "itemListDDL_over" + this.myStyle;
		this.oldItem = c;
		this.oTextBox.value = c.innerHTML;
		this.oTextBox.select();
	}
};

DropDownList$BTD.prototype.showList = function(e)
{
	this.oContainerList.style.display = "";
	var sizeTableList = utilObj.getElementSize(this.oTableList);
	var w = sizeTableList.width + 17 < 170 ? 170 : sizeTableList.width;
	
	if (sizeTableList.height > (this.maxItem * this.heightItem))
	{
		this.oContainerList.style.overflowY = "scroll";
		this.oContainerList.style.height = (this.maxItem * this.heightItem) + "px";
		this.oTableList.style.width = (utilObj.isEE ? w - 17 : w) + "px";
		w = w + 17;
	}
	else
	{
		this.oContainerList.style.overflowY = "";
		this.oContainerList.style.height = sizeTableList.height;
		this.oTableList.style.width = (w - 1 < 0 ? 0 : w - 1) + "px";
	}
	
	// Set width for container DDL
	this.oContainerList.style.width = w + "px";
	
	var pos = utilObj.coordsElChildByParentIntelligent(e, this.oContainerList, this.oContainer);
	this.oContainerList.style.top = pos.Y + "px";
	this.oContainerList.style.left = pos.X + "px";
	
};

DropDownList$BTD.prototype.hideList = function()
{
	if (this.oContainerList == null) return;
	this.oContainerList.style.display = "none";
	this.oContainerList.style.top = "-100px";
	this.oContainerList.style.left = "-100px";
	if (this.alreadyKeyDown)
	{
		this.alreadyKeyDown = false;
		utilObj.removeEvent(document, "keydown", this.whenKeyDown);
	}
};

//************************Create List Item************************************//
DropDownList$BTD.prototype.createContainerList = function()
{
	var o = utilObj.createEl("DIV");
	o.id = "DivListDDL_" + this.myName;
	o.className = "divListDDL" + this.myStyle;
	this.createList(o);
	utilObj.addChildToBody(o);
	this.oContainerList = o;
};

DropDownList$BTD.prototype.createList = function(oParent)
{
	this.oTableList = utilObj.createEl("TABLE");
	this.oTableList.id = "TableListDDL_" + this.myName;
	this.oTableList.style.visibility  = "visible";
	this.oTableList.style.width = "100%";
	this.oTableList.border = 0;
	this.oTableList.cellPadding = 0;
	this.oTableList.cellSpacing = 0;
	this.oTableList.style.textAlign = "left";
	oParent.appendChild(this.oTableList);
	this.loadListItems(this.list);
};

DropDownList$BTD.prototype.loadListItems = function(list)
{
	this.clearListItems();
	this.list = list;
	var listLength = 0;
	for (var key in list)
	{
		if (typeof(list[key]) == "string")
		{
			listLength++;
			this.addItem(key, list[key]);
		}
	}
	this.listLength = listLength;
};

DropDownList$BTD.prototype.clearListItems = function()
{
	this.list = [];
	while (this.oTableList.rows.length > 0)
	{
		this.oTableList.deleteRow(0);
	}
	this.oTextBox.value = "";
};

DropDownList$BTD.prototype.addItem = function(key, value)
{
	// If not exist in list
	if (this.list[key] == null) this.list[key] = value;
	
	var o = this.oTableList;
	var r = o.insertRow(-1);
	r.id = "RowDDL_" + o.rows.length + "_" + this.myName;
	var c = r.insertCell(-1);
	c.className = "itemListDDL" + this.myStyle;
	c.innerHTML = value;
	c.style.width = "100%";
	c.style.paddingLeft = "3px";
	c.id = "CellDDL_" + o.rows.length + "_" + this.myName;
	utilObj.createAttribute(c, "keyItem", key);
	var self = this;
	utilObj.addEvent(c, "mouseover", function(e) { self.mouseOverItemDDL(c); });
	utilObj.addEvent(c, "click", function(e) { self.clickItemDDL(c, key, e); });
};

DropDownList$BTD.prototype.mouseOverItemDDL = function(item)
{
	if (this.oldItem != null && this.oldItem != item)
	{
		this.oldItem.className = "itemListDDL" + this.myStyle;
	}
	item.className = "itemListDDL_over" + this.myStyle;
	this.oldItem = item;
};

DropDownList$BTD.prototype.clickItemDDL = function(item, key, e)
{
	this.item.value = key;
	this.item.text = item.innerHTML;
	this.hideList();
	if (this.oTextBox.value != item.innerHTML || this.oTextBox.value != this.oldValue)
	{
		this.oldValue = this.oTextBox.value;
		this.oTextBox.value = item.innerHTML;
		this.executeEvent(e, "change");
	}
};

//************************Public Method************************************//
DropDownList$BTD.prototype.dispose = function()
{
	utilObj.d.body.removeChild(this.oContainerList);
	this.oContainerParent.removeChild(this.oContainer);
	this.oContainerList = null;
	this.oContainer = null;
};

DropDownList$BTD.prototype.addEvent = function(eventName, func)
{
	if(this.listEvent[eventName] == null)
	{
		this.listEvent[eventName] = [];
	}
	this.listEvent[eventName].push(func);
};

DropDownList$BTD.prototype.removeEvent = function(eventName, func)
{
	if(this.listEvent[eventName] == null)
	{
		return;
	}
	for (var i = 0; i < this.listEvent[eventName].length; i++)
	{
		if (func == this.listEvent[eventName][i])
		{
			this.listEvent[eventName].splice(i, 1);
			break;
		}
	}
};

DropDownList$BTD.prototype.getValue = function()
{
	return this.enabledAutoCom ? this.item.value : this.oTextBox.value;
};

DropDownList$BTD.prototype.getText = function()
{
	return this.enabledAutoCom ? this.item.text : this.oTextBox.value;
};

DropDownList$BTD.prototype.selectedValue = function(v)
{
	if (this.list[v] != null && this.oTableList != null)
	{
		this.item.value = v;
		this.item.text = this.list[v];
		this.oTextBox.value = this.list[v];
		var oRows = this.oTableList.rows;
		for (var i = 0; i < oRows.length; i++)
		{
			if (oRows[i].cells[0].keyItem != null && oRows[i].cells[0].keyItem == v)
			{
				this.oldItem = oRows[i].cells[0];
				this.oldItem.className = "itemListDDL_over" + this.myStyle;
				break;
			}
		}
	}
};
//************************Public Method************************************//
