<!--
/*
	By:				Johnny Tran
	Date Created:	10/11/2007

	Properties:
		targetControlId				- the id of the input control
		data						- an array list containing the data
		forceMatchOnly				- force the client to enter in only value that matches items in the result list (true or false)
		containerCssClass			- the css class name to use for the container
		itemBackgroundColor			- the background color to use for the item
		itemBackgroundColorHover	- the background color to use for the item when hovered
		itemBackgroundColorSelected	- the background color to use for the item when selected

	Usage:
		AV.Web.UI.Intellsense.RegisterTargetControl('targetControlId', data-list-object, false, '', '', '', '');
*/
if (AV == null || typeof(AV) != "object") { var AV = new Object(); }
if (AV.Web == null || typeof(AV.Web) != "object") { AV.Web = new Object(); }
if (AV.Web.UI == null || typeof(AV.Web.UI) != "object") { AV.Web.UI = new Object(); }

AV.Web.UI.Intellsense = {

	privateVar		: new function()
	{
		this.Intellsense				= null;
	},

	MatchCount			: 0,

	SelectedIndex		: -1,

	TargetControl			: function()
	{
		this.ContainerCssClass				= '';
		this.ItemBackgroundColor			= '#FFFFFF';
		this.ItemBackgroundColorHover		= '#FFCC00';
		this.ItemBackgroundColorSelected	= '#CCCCCC';

		this.Data					= null;
		this.ForceMatchOnly			= '';
		this.TargetControl			= null;
	},

	// Method
	Hide		: function()
	{
		AV.Util.Dom.Hide(this.getIntellsenseControl());
	},

	ItemOut				: function(prop, index)
	{
		if (prop == null) return false;

		var obj = AV.Util.Dom.getControl("IntellsenseItem" + index);
		if (obj == null) return false;

		if (this.SelectedIndex == index)
			obj.style.backgroundColor = prop.ItemBackgroundColorSelected;
		else
			obj.style.backgroundColor = prop.ItemBackgroundColor;
		return true;
	},

	ItemOver			: function(prop, index)
	{
		if (prop == null) return false;

		var obj = AV.Util.Dom.getControl("IntellsenseItem" + index);
		if (obj == null) return false;

		obj.style.backgroundColor = prop.ItemBackgroundColorHover;

		return true;
	},

	ItemSelect			: function(prop, index)
	{
		if (prop == null) return false;

		// Make sure that item is not out of range
		if (index < 0)
			index = this.MatchCount - 1;
		else if (index > this.MatchCount - 1)
			index = 0;

		var oldIndex = this.SelectedIndex;

		// Update selected index
		this.SelectedIndex = index;

		// Unselect the previous item
		this.ItemOut(prop, oldIndex)

		// Select this item
		this.ItemOut(prop, index)

		return true;
	},

	ItemSelected		: function(prop)
	{
		if (prop == null) return false;

		var obj = AV.Util.Dom.getControl("IntellsenseItem" + this.SelectedIndex);
		if (obj == null) return false;

		prop.TargetControl.value = obj.innerHTML;

		this.Hide();
		return true;
	},

	KeyUp				: function(e, prop)
	{
		if (prop == null || this.getIntellsenseControl() == null) return false;

		if (!e) e = window.event;
		var keyCode = e.keyCode ? e.keyCode : e.which;
		switch(keyCode)
		{
			case 9: // Tab
				this.Hide();
				return true;
			case 13: // Enter
				if (this.getIntellsenseControl().style.display != 'none') {this.ItemSelected(prop); return true;}
			case 27: // Esc
				this.Hide();
				return true;
			case 38: // Up arrow
				return this.ItemSelect(prop, this.SelectedIndex - 1);
			case 40: // Down arrow
				return this.ItemSelect(prop, this.SelectedIndex + 1);
		}

		// Get the current value
		var inputValue				= prop.TargetControl.value;

		// Exit intellsense if no value exist
		if (inputValue.length == 0) {this.Hide(); return false;}

		// Try to find some matching items
		var dataValue;

		this.Hide();
		this.getIntellsenseControl().innerHTML = '';
		this.MatchCount = 0;
		for (var i = 0; i < prop.Data.length; i++)
		{
			dataValue = prop.Data[i];

			if (AV.String.Equal(dataValue.substring(0, inputValue.length).toLowerCase(), inputValue.toLowerCase()))
			{
				// Add to intellsense list
				this.RenderItem(prop, this.MatchCount, dataValue);

				this.MatchCount++;

				// Hide intellsense when exact match found
				if (AV.String.Equal(dataValue, inputValue)) {return true;}
			}
		}

		if (this.MatchCount == 0)
		{
			if (prop.ForceMatchOnly)
			{
				// Undo last key if no match found
				prop.TargetControl.value = inputValue.substring(0, inputValue.length - 1);

				// Redisplay the last intellsense match list
				return this.KeyUp(e, prop);
			}
		}
		else
		{
			this.Position(prop);

			// Select the first item
			this.ItemSelect(prop, 0);

			this.Show(prop);
		}

		return true;
	},

	Position			: function(prop)
	{
		var dom = this.getIntellsenseControl();
		var offSetLeft = 20;
		var offSetTop = 20;

			// Position the intellsense match list with offset from the input box
		dom.style.left		= AV.Util.Dom.ControlX(prop.TargetControl) + offSetLeft + 'px';
		dom.style.top		= AV.Util.Dom.ControlY(prop.TargetControl) + offSetTop + 'px';
	},

	RegisterTargetControl	: function(targetControlId, data, forceMatchOnly, containerCssClass, itemBackgroundColor, itemBackgroundColorHover, itemBackgroundColorSelected)
	{
		var prop = new AV.Web.UI.Intellsense.TargetControl();
		prop.Data							= data;
		prop.ForceMatchOnly					= forceMatchOnly;
		prop.TargetControl					= AV.Util.Dom.getControl(targetControlId);
		prop.ContainerCssClass				= containerCssClass;
		if (!AV.String.IsNullOrEmpty(itemBackgroundColor)) prop.ItemBackgroundColor = itemBackgroundColor;
		if (!AV.String.IsNullOrEmpty(itemBackgroundColorHover)) prop.ItemBackgroundColorHover = itemBackgroundColorHover;
		if (!AV.String.IsNullOrEmpty(itemBackgroundColorSelected)) prop.ItemBackgroundColorSelected = itemBackgroundColorSelected;

		prop.TargetControl.onkeyup = function(e)
		{
			AV.Web.UI.Intellsense.KeyUp(e, prop);
		}
	},

	RenderItem		: function(prop, index, text)
	{
		var dom = document.createElement('div');
		dom.id = 'IntellsenseItem' + index;
		dom.style.minWidth = '100px';
		dom.style.padding = '1px 2px';
		dom.style.whiteSpace = 'nowrap';
		
		dom.innerHTML = text;

		dom.onclick = function()
		{
			if (AV.Web.UI.Intellsense.ItemSelect(prop, index))
				AV.Web.UI.Intellsense.ItemSelected(prop);
		}

		dom.onmouseout = function()
		{
			AV.Web.UI.Intellsense.ItemOut(prop, index);
		}

		dom.onmouseover = function()
		{
			AV.Web.UI.Intellsense.ItemOver(prop, index);
		}

		this.getIntellsenseControl().appendChild(dom);
	},

	Show		: function(prop)
	{
		AV.Util.Dom.Show(this.getIntellsenseControl());
	},

	// Property
	getIntellsenseControl	: function()
	{
		if (this.privateVar.IntellsenseControl == null)
		{
			this.privateVar.IntellsenseControl = document.createElement('div');
			this.privateVar.IntellsenseControl.id = 'intellsensePanel';
			this.getIntellsenseControl().style.backgroundColor = "#FFFFFF";
			this.privateVar.IntellsenseControl.style.borderColor = '#000000';
			this.privateVar.IntellsenseControl.style.borderStyle = 'solid';
			this.privateVar.IntellsenseControl.style.borderWidth = '1px';
			this.privateVar.IntellsenseControl.style.display = 'none';
			this.privateVar.IntellsenseControl.style.maxHeight = '150px';
			this.privateVar.IntellsenseControl.style.overflow = 'auto';
			this.privateVar.IntellsenseControl.style.padding = '3px';
			this.privateVar.IntellsenseControl.style.position = 'absolute';
			this.privateVar.IntellsenseControl.style.textAligh = 'left';
			document.body.appendChild(this.privateVar.IntellsenseControl);
		}
		return this.privateVar.IntellsenseControl;
	}
}
-->