/*
===============================================================================
====== Name: custom_textbox
====== Desc: Creates custom textboxes that can hold a dropdown list
====== Auth: Chris Barr
====== Date: 09/25/2008
===============================================================================
====== Change History
===============================================================================
====== Date:         Author:           Description:
====== ----------    --------          ----------------------------------------
	09/08/2009	CTB		Added Horizontal offset
	01/08/2010	CTB		tweaked MOZ layer offset to line up with IE
===============================================================================

textBox_TestForTab

function init_custom_text_boxes()
function create_textSelect(currentElementId)
function create_textSuggest(currentElementId)
function textBox_TestForTab(e)
function retrieveSuggestion(activeElement, e)
function retrieveSuggestion_return(fieldId, suggentions)
function textBox_DropArrowSwap(dropDownImage)
function textBox_DropDownDisplay(dropDownButton)
function textBox_DropDownSelect(dropDownRow, textElementId)
function set_TextBox_SelectedRowElement(textElementId, selectedValue, selectedContent)
function set_TextBox_Custom(textElementId, selectedContent)
function Set_rowcolor(currentRow)
function textBox_DropDownClose()
function textBox_DropDownClose_actual()
function getOffsetTop(elm)
function getOffsetLeft(elm)
*/
DynAPI.setLibraryPath('/includesJS');
DynAPI.include('dynapi.api.browser.js');
DynAPI.include('dynapi.api.dynlayer.js');
DynAPI.include('dynapi.api.dyndocument.js');
//DynAPI.include('dynapi.event.*');

var _downDownArrow_on = new Image();
var _downDownArrow_off = new Image();
var _dropDownContent = [];
var _dropDownLayer2 = [];
var _currentlyExpanded = "";
var _currentHighlitRow = "";
var _highlightColorOnBg = "#fcdba8";
var _highlightColorOnText = "#000000";
var _highlightColorOffBg = "#ffffff";
var _highlightColorOffText = "#000000";
var _selectTextStyle = "font-family:Verdana, Geneva, sans-serif; font-size:9pt; padding-left:3px; text-align:left;";
var _suggentionConfig = new Array();
var _dropDownLayer;
var _dropDownSuggest;
var _dynApiBrowser;

//_downDownArrow_on.src="/graphics/drop-on.gif";
//_downDownArrow_off.src="/graphics/drop-off.gif";

suggConfig = function(method, variable)
{
	this.method		= method || "";
	this.variable	= variable || "";
};

DynAPI.onLoad = function()
{
	init_custom_text_boxes();
	_dynApiBrowser = new Browser();
};

function init_custom_text_boxes()
{
	var spanRunner;
	
	_dropDownSuggest = new DynLayer();
	_dropDownSuggest.setVisible(false);
	DynAPI.document.addChild(_dropDownSuggest);
	
	//This loop runs backwards so that it does not pick up the new spans that are created.
	for(spanRunner = document.getElementsByTagName("span").length-1; spanRunner>=0; spanRunner--)
	{
		if(document.getElementsByTagName("span")[spanRunner].getAttribute('type')=='text-select')
			create_textSelect(document.getElementsByTagName("span")[spanRunner].id);
		if(document.getElementsByTagName("span")[spanRunner].getAttribute('type')=='text-suggest')
			create_textSuggest(document.getElementsByTagName("span")[spanRunner].id);
	};

	document.onclick=textBox_DropDownClose;
};

function create_textSelect(currentElementId)
{
	var tempContent = "";
	var tempMenuContent = "";
	var selectedWidth = 150;
	var tempSelectLayer = new DynLayer();
	var selectedDefault = null;
	var selectedValue = null;
	var selectedContent = null;
	var currentElement;
	var elementRunner;
	var tempValue;
	var tempText;
	var lastValidOption;
	
	currentElement = document.getElementById(currentElementId);
	currentElement.id = currentElementId + "_span";
	lastValidOption = currentElement.children.length;
	selectedDefault = currentElement.defaultValue;
	if(currentElement.width != undefined)
		selectedWidth = currentElement.width;
	
	tempMenuContent += "<table id='" + currentElementId + "_dropdown' border=0 cellpadding=0 cellspacing=0 style='border-left:1px solid #B2B2B2; border-top:1px solid #B2B2B2; border-right:1px solid #000000; border-bottom:1px solid #000000; width:" + selectedWidth + "px;'>";
	for(elementRunner = 0; elementRunner<lastValidOption; elementRunner++)
	{
		if(currentElement.childNodes[elementRunner].tagName!=undefined)
		{
			tempValue = currentElement.childNodes[elementRunner].value;
			tempText = currentElement.childNodes[elementRunner].innerHTML;
			
			if(tempValue==selectedDefault)
			{
				selectedValue = tempValue;
				selectedContent = tempText;
			};
			tempMenuContent += "	<tr id='row" + elementRunner + "_" + currentElementId + "' onMouseOver='JavaScript:Set_rowcolor(this.id);' style='cursor:default;'>";
			tempMenuContent += "		<td style='" + _selectTextStyle + "' onClick=JavaScript:textBox_DropDownSelect(this,'" + currentElementId + "') value='" + tempValue + "' >" + tempText + "</td>";
		}else
			lastValidOption++;
	};
	tempMenuContent += "	<tr id='row" + elementRunner + "_" + currentElementId + "' onMouseOver='JavaScript:Set_rowcolor(this.id);' style='cursor:default;'>";
	tempMenuContent += "		<td style='" + _selectTextStyle + " font-style:italic; text-align:center;' onClick=JavaScript:textBox_DropDownSelect(this,'" + currentElementId + "') value='custom' > -= CUSTOM =-</td>";
	tempMenuContent += "</table>";
	
	tempSelectLayer.setBgColor("#FFFFFF");
	tempSelectLayer.setHTML(tempMenuContent);
	tempSelectLayer.setVisible(false);
	_dropDownLayer2[currentElementId + '_display'] = tempSelectLayer;
	DynAPI.document.addChild(_dropDownLayer2[currentElementId + '_display']);
	
	tempContent += "<input type='text' id='" + currentElementId + "_display' onfocus='blur();' onclick='JavaScript:textBox_DropDownDisplay(this);' style='width:" + selectedWidth + "px; cursor:default;' />";
	tempContent += "<span style='position:relative; left:-17; top:2'><img id='" + currentElementId + "_arrow' src='/graphics/drop-off.gif' border='0' onClick='JavaScript:textBox_DropDownDisplay(this);' onMouseOver='JavaScript:textBox_DropArrowSwap(this);' onMouseOut='JavaScript:textBox_DropArrowSwap(this);' /></span>"
	tempContent += "<input type='hidden' id='" + currentElementId + "' name='" + currentElementId + "' />";
	currentElement.innerHTML = tempContent;

	if(selectedDefault!=undefined)
	{
		if(selectedValue!= null && selectedContent!=null)
			set_TextBox_SelectedRowElement(currentElementId, selectedValue, selectedContent);
		else
			set_TextBox_Custom(currentElementId, selectedDefault);
	};
};

function create_textSuggest(currentElementId)
{
	//var
	var tempContent = "";
	var tempMenuContent = "";
	var selectedWidth = "";
	var selectedDefault = null;
	var currentElement = "";
	var selectedMethod = "";
	var selectedVariable = "";
	var verticalOffset = 22;
	var horizontalOffset = 1;
	var defaultOnFocus = "";
	var defaultOnBlur = "";
	var defaultOnKeyUp = "";
	//var
	
	currentElement = document.getElementById(currentElementId);
	currentElement.id = currentElementId + "_span";
	
	selectedDefault = currentElement.getAttribute('defaultValue').replace("'","&#39");
	selectedVariable = currentElement.getAttribute('variable');
	selectedMethod = currentElement.getAttribute('method');
	if(currentElement.getAttribute('voffset') != undefined)
		verticalOffset = currentElement.getAttribute('voffset');
	if(currentElement.getAttribute('hoffset') != undefined)
		horizontalOffset =  currentElement.getAttribute('hoffset');
	if(currentElement.getAttribute('width') != undefined)
		selectedWidth = "style='width:" + currentElement.getAttribute('width') + "px;' ";
	if(typeof(currentElement.getAttribute('focus')) == 'string')
		defaultOnFocus = currentElement.getAttribute('focus');
	if(typeof(currentElement.getAttribute('blur')) == 'string')
		defaultOnBlur = currentElement.getAttribute('blur');
	if(currentElement.getAttribute('keyup') != undefined)
		defaultOnKeyUp = currentElement.getAttribute('keyup').replace(/'/g,'"');
	
	_suggentionConfig[currentElementId] = new suggConfig(selectedMethod, selectedVariable);
	tempContent += "<input type='text' value='" + selectedDefault + "' id='" + currentElementId + "' name='" + currentElementId + "' " + selectedWidth + "voffset='" + verticalOffset + "' hoffset='" + horizontalOffset + "' onKeyUp='retrieveSuggestion(this, event); " + defaultOnKeyUp + "' onFocus='JavaScript:textBox_DropDownClose_actual(); " + defaultOnFocus + "' onKeyDown='JavaScript:textBox_TestForTab(event);' onblur=' " + defaultOnBlur + "' />";
	currentElement.innerHTML = tempContent;
};

function textBox_TestForTab(e)
{
	//var
	var windowEvent = window.event;
	//var
	
	//keyCode 9 is the code for "tab"
	if(windowEvent && windowEvent.keyCode == '9')
		textBox_DropDownClose();
	else if(e.which == '9')
		textBox_DropDownClose();
};

function retrieveSuggestion(activeElement, e)
{
	//var
	var Js_post = new postback(_suggentionConfig[activeElement.id].method);
	var keyCode;
	var rows;
	var verticalOffset = 22;
	var horizontalOffset = 1;
	//var

	if(window.event)
		keyCode = window.event.keyCode;
	else if(e)
		keyCode = e.which;
	
	//keyCode 38 is the code for "arrow up"
	//keyCode 40 is the code for "arrow down"
	if(keyCode == 38)
	{
		//UP
		if(document.getElementById(activeElement.id + "_dropdown"))
		{
			rows = document.getElementById(activeElement.id + "_dropdown").children[0].children;
			
			if(rows.length > 0)
			{
				if(_currentHighlitRow == '' || _currentHighlitRow == "row0_" + activeElement.id)
					Set_rowcolor("row" + (rows.length-1) + "_" + activeElement.id);
				else if(rows.length > 0)
					Set_rowcolor("row" + (parseInt(_currentHighlitRow.match(/^row(\d)/)[1])-1) + "_" + activeElement.id);

				set_TextBox_SelectedRowElement(activeElement.id, document.getElementById(_currentHighlitRow).children[0].getAttribute('value'));
			};
		};
	}else if(keyCode == 40){
		//Down
		if(document.getElementById(activeElement.id + "_dropdown"))
		{
			rows = document.getElementById(activeElement.id + "_dropdown").children[0].children;

			if(rows.length > 0)
			{
				if(_currentHighlitRow == '' || _currentHighlitRow == "row" + (rows.length-1) + "_" + activeElement.id)
					Set_rowcolor("row0_" + activeElement.id);
				else if(rows.length > 0)
					Set_rowcolor("row" + (parseInt(_currentHighlitRow.match(/^row(\d)/)[1])+1) + "_" + activeElement.id);
				
				set_TextBox_SelectedRowElement(activeElement.id, document.getElementById(_currentHighlitRow).children[0].getAttribute('value'));
			};
		};
	}else{
		verticalOffset = parseInt(activeElement.getAttribute('voffset'));
		horizontalOffset = parseInt(activeElement.getAttribute('hoffset'));
		
		textBox_DropDownClose();
		_dropDownSuggest.setVisible(false);
		// original _dropDownSuggest.moveTo(getOffsetLeft(activeElement)+1,getOffsetTop(activeElement)+22);
		_dropDownSuggest.moveTo(getOffsetLeft(activeElement)+horizontalOffset,getOffsetTop(activeElement)+verticalOffset);
	
		if(activeElement.value != '')
		{
			Js_post.Parameters = "id=" + activeElement.id + "&content=" + activeElement.value;
			if(_suggentionConfig[activeElement.id].variable != '' && document.getElementById(_suggentionConfig[activeElement.id].variable))
			{
				//bad, bad, legacy pclass code
				Js_post.Parameters += "&pclass=" + document.getElementById(_suggentionConfig[activeElement.id].variable).value;
				Js_post.Parameters += "&variablevalue=" + document.getElementById(_suggentionConfig[activeElement.id].variable).value;
			};
			Js_post.Retrieve();
		};
	};
};

function retrieveSuggestion_return(fieldId, suggentions)
{
	var tempMenuContent = "";
	var suggestionResults = suggentions.split('|');
	var selectedWidth = 150;
	var currentValue = document.getElementById(fieldId).value;
	var highlightRegEx = new RegExp("(" + currentValue.replace(/\\/g,"\\\\") + ")", "i");
	var tempMenuContent;
	var suggestionRunner;
	var tempValue;
	var tempText;

	if(suggestionResults.length>0)
	{
		if(document.getElementById(fieldId).style.width != undefined)
			selectedWidth = document.getElementById(fieldId).style.width.replace('px','');
	
		tempMenuContent += "<table id='" + fieldId + "_dropdown' border=0 cellpadding=0 cellspacing=0 style='border-left:1px solid #B2B2B2; border-top:1px solid #B2B2B2; border-right:1px solid #000000; border-bottom:1px solid #000000; width:" + selectedWidth + "px;'>";
		for(suggestionRunner = 0; suggestionRunner<suggestionResults.length-1; suggestionRunner++)
		{
			tempValue = suggestionResults[suggestionRunner].replace("'","&#39");
			tempText = tempValue.replace(highlightRegEx,"<b>$1</b>");
			
			tempMenuContent += "	<tr id='row" + suggestionRunner + "_" + fieldId + "' onMouseOver='JavaScript:Set_rowcolor(this.id);' style='cursor:default;'>";
			tempMenuContent += "		<td style='" + _selectTextStyle + "' onClick=JavaScript:textBox_DropDownSelect(this,'" + fieldId + "'); value='" + tempValue + "' >" + tempText + "</td>";
		};
		tempMenuContent += "</table>";
		
		_currentlyExpanded = fieldId;
		_dropDownSuggest.setVisible(true);
		_dropDownSuggest.setBgColor("#FFFFFF");
		_dropDownSuggest.setHTML(tempMenuContent);
	};
};

function textBox_DropArrowSwap(dropDownImage)
{
	if(dropDownImage.src==_downDownArrow_on.src)
		dropDownImage.src = _downDownArrow_off.src;
	else
		dropDownImage.src = _downDownArrow_on.src;
};

function textBox_DropDownDisplay(dropDownButton)
{
	var rootElementId = dropDownButton.id.replace(/_arrow/,'').replace(/_display/,'') + '_display';
	var layerWidth = document.getElementById(rootElementId).style.width.replace(/px/,'');
	
	if(_currentlyExpanded!=rootElementId)
	{
		if(_currentlyExpanded!="")
			textBox_DropDownClose_actual();
		if(dropDownButton.tagName=="IMG")
			_dropDownLayer2[rootElementId].moveTo(getOffsetLeft(dropDownButton)-layerWidth+18,getOffsetTop(dropDownButton)+19);
		else
			_dropDownLayer2[rootElementId].moveTo(getOffsetLeft(dropDownButton)+1,getOffsetTop(dropDownButton)+22);
		_dropDownLayer2[rootElementId].setVisible(true);
		_currentlyExpanded = rootElementId;
	}else
		textBox_DropDownClose_actual();
};

function textBox_DropDownSelect(dropDownRow, textElementId)
{
	if(dropDownRow.value!='custom')
		set_TextBox_SelectedRowElement(textElementId, dropDownRow.getAttribute('value'), dropDownRow.innerHTML);
	else
		set_TextBox_Custom(textElementId, "");
	textBox_DropDownClose_actual();
};

function set_TextBox_SelectedRowElement(textElementId, selectedValue, selectedContent)
{
	if(document.getElementById(textElementId + '_display'))
	{
		//Custom select box
		document.getElementById(textElementId + '_display').value = selectedContent;
		document.getElementById(textElementId).value = selectedValue;
		document.getElementById(textElementId + '_display').onfocus = function(){blur();};
		document.getElementById(textElementId + '_display').onclick = function(){textBox_DropDownDisplay(this);};
		document.getElementById(textElementId + '_display').onkeyup = '';
		document.getElementById(textElementId + '_display').style.cursor='default';
	}else{
		//Suggest box
		document.getElementById(textElementId).value = selectedValue;
	};
};

function set_TextBox_Custom(textElementId, selectedContent)
{
	document.getElementById(textElementId + '_display').value = selectedContent;
	document.getElementById(textElementId).value = selectedContent;
	document.getElementById(textElementId + '_display').onfocus = function(){textBox_DropDownClose_actual();};
	document.getElementById(textElementId + '_display').onclick = function(){textBox_DropDownClose_actual();};
	document.getElementById(textElementId + '_display').onkeyup = function(){document.getElementById(textElementId).value = document.getElementById(textElementId + '_display').value};
	document.getElementById(textElementId + '_display').style.cursor='';
	document.getElementById(textElementId + '_display').focus();
};

function Set_rowcolor(currentRow)
{
	if(_currentHighlitRow!="")
	{
		document.getElementById(_currentHighlitRow).style.background = _highlightColorOffBg;
		document.getElementById(_currentHighlitRow).children[0].style.color = _highlightColorOffText;
	};
	document.getElementById(currentRow).style.background = _highlightColorOnBg;
	document.getElementById(currentRow).children[0].style.color = _highlightColorOnText;
	_currentHighlitRow = currentRow;
};

function textBox_DropDownClose()
{
	if(_currentlyExpanded!="" && _dropDownLayer2[_currentlyExpanded] && _dropDownLayer2[_currentlyExpanded].getVisible() && window.event.srcElement.tagName!='IMG' && window.event.srcElement.tagName!='INPUT')
		textBox_DropDownClose_actual();
	else if(_currentlyExpanded!="" && _dropDownSuggest.getVisible()==true)
		textBox_DropDownClose_actual();
		
};

function textBox_DropDownClose_actual()
{
	if(_currentlyExpanded!="" && _dropDownLayer2[_currentlyExpanded])
	{
		_dropDownLayer2[_currentlyExpanded].setVisible(false);
		_currentlyExpanded = "";
	};
	if(_currentlyExpanded!="" && _dropDownSuggest.getVisible()==true)
	{
		_dropDownSuggest.setVisible(false);
		_dropDownSuggest.setHTML("");
		_currentlyExpanded = "";
	};
	if(_currentHighlitRow!="")
	{
		if(document.getElementById(_currentHighlitRow))
		{
			document.getElementById(_currentHighlitRow).style.background = _highlightColorOffBg;
			document.getElementById(_currentHighlitRow).children[0].style.color = _highlightColorOffText;
		};
		_currentHighlitRow = "";
	};
};

function getOffsetTop(elm)
{
	//var
	var Topoffset = elm.offsetTop;
	var Parentoffset = elm.offsetParent;
	//var
	
	while(Parentoffset!=null)
	{
		Topoffset += Parentoffset.offsetTop;
		Parentoffset = Parentoffset.offsetParent;
	};
	
	return Topoffset;
};

function getOffsetLeft(elm)
{
	//var
	var Leftoffset = elm.offsetLeft;
	var Parentoffset = elm.offsetParent;
	//var
	
	while(Parentoffset!=null)
	{
		Leftoffset += Parentoffset.offsetLeft;
		Parentoffset = Parentoffset.offsetParent;
	};
	
	return Leftoffset;
};