var g_txtCountryID;
var g_txtPortID;
var g_txtRefID;

function filterCountry(selectorID)
{
    g_txtCountryID = selectorID;
    var textbox = $(selectorID);
    PageMethods.filterCountrySearch(textbox.value, filterCountry_callback, error_callback, error_callback, error_callback);
}

function filterCountry_callback(countries)
{
   removeContents("tdList");
   
   var show_auto_complete = false;
   
   if (countries.rows != null)
   {
       if (countries.rows.length > 0)
       {
           var ul = createHTMLElementUL("");
           
           for (var i = 0; i < countries.rows.length; i++)
           {
               var li = createHTMLElementLI("");
               var a = createHTMLElementAnchor("javascript:setCountryText('" + countries.rows[i]["Name"] + "')", "", countries.rows[i]["Name"]);
               li.appendChild(a);
               ul.appendChild(li);
           }
           $("tdList").appendChild(ul);
           show_auto_complete = true;
       }
   }
   if (show_auto_complete)
       showAutoComplete("country");
   else
       closeDropDown();
}

function error_callback()
{
    //neccessary to prevent a default error message
}

function setCountryText(country)
{
    $(g_txtCountryID).value = country;
    $(g_txtCountryID).focus();
    closeDropDown();
}

function submitOnEnter(btnID)
{
    var btn = $(btnID);
    if (btn) btn.click();
}

function filterPort(selectorID)
{
    g_txtPortID = selectorID;
    var textbox = $(selectorID);
    
    PageMethods.filterPortSearch(textbox.value, filterPort_callback, error_callback, error_callback, error_callback);    
}

function filterPort_callback(ports)
{
   removeContents("tdList");
   
   var show_auto_complete = false;
   
   if (ports.rows != null)
   {
       if (ports.rows.length > 0)
       {
           var ul = createHTMLElementUL("");
           
           for (var i = 0; i < ports.rows.length; i++)
           {
               var li = createHTMLElementLI("");
               var a = createHTMLElementAnchor("javascript:setPortText('" + ports.rows[i]["Name"] + "')", "", ports.rows[i]["PortNameAndCountry"]);
               li.appendChild(a);
               ul.appendChild(li);
           }
           $("tdList").appendChild(ul);
           show_auto_complete = true;
       }
   }
   
   if (show_auto_complete)
       showAutoComplete("port");
   else
       closeDropDown();
   
}

function setPortText(port)
{
    $(g_txtPortID).value = port;
    $(g_txtPortID).focus();
    closeDropDown();
}

function filterReferenceCode(selectorID)
{
    g_txtRefID = selectorID;
    var textbox = $(selectorID);
    PageMethods.filterReferenceCodeSearch(textbox.value, filterReferenceCode_callback, error_callback, error_callback, error_callback);
}

function filterReferenceCode_callback(reference_codes)
{
   removeContents("tdList");
   
   var show_auto_complete = false;
   
   if (reference_codes.rows != null)
   {
       if (reference_codes.rows.length > 0)
       {
           var ul = createHTMLElementUL("");
           
           for (var i = 0; i < reference_codes.rows.length; i++)
           {
               var li = createHTMLElementLI("");
               var a = createHTMLElementAnchor("javascript:setReferenceCodeText('" + reference_codes.rows[i]["ReferanceCode"] + "')", "", reference_codes.rows[i]["ReferanceCode"]);
               li.appendChild(a);
               ul.appendChild(li);
           }
           $("tdList").appendChild(ul);
           show_auto_complete = true;
       }
   }
   if (show_auto_complete)
       showAutoComplete("reference_code");
   else
       closeDropDown();
   
}

function setReferenceCodeText(reference_code)
{
    $(g_txtRefID).value = reference_code;
    $(g_txtRefID).focus();
    closeDropDown();
}

showAutoComplete = function(search_by)
{
	var offsetTop;
	var offsetLeft;
	
	var unit = "em";
	
	switch (search_by)
	{
		case "country":
	
			var offsetTop = "-3.2";
			var offsetLeft = "7.9";
	
		break;
	
		case "port":
	
			var offsetTop = "-3.2";
			var offsetLeft = "8.2";
	
		break;
	
		case "reference_code":
		
			var offsetTop = "-6.1";
			var offsetLeft = "3.5";
			
		break;
	}
	
	$("dropdown").setStyle
	(
		{
			marginTop: offsetTop + unit,
			marginLeft: offsetLeft + unit
		}
	);
	
    Effect.Appear("dropdown",
	{
		duration: 0.2,
		afterFinish:function()
		{
			var viewportListener = new Element("div",
			{
				"id": "viewport-listener"
			});
			
			$("viewport").insert(viewportListener);
			
			var unit = "px";
			var viewportListenerDimensions = $("viewport").getDimensions();
			var viewportListenerHeight = viewportListenerDimensions.height + unit;
			
			$("viewport-listener").setStyle
			(
				{
					height: viewportListenerHeight
				}
			);
			
			$("viewport-listener").observe("click",function()
			{
				closeDropDown();
				
			});
		}
	});
}


closeDropDown = function()
{
    if ($("viewport-listener") != null)
    {
        $("viewport-listener").stopObserving("click");
	    $("viewport-listener").remove();
    }

    if ($("dropdown").style.display != "none")
    {
        if ($("dropdown") != null)
        {
            if (Prototype.Browser.WebKit)
            {
    		   
                Effect.Fade("dropdown",
                {
	                duration: 0.4,
	                afterFinish:function()
	                {
		                //something();
	                }
                });
    			
            }
            else
            {
	            Effect.DropOut("dropdown",
	            {
		            duration: 0.6,
		            afterFinish:function()
		            {
			            //something();
		            }
	            });
            }
        }
    }
}

preLoadDropDownImages = function()
{
	var i = 0;
	imageObj = new Image();
	
	images = new Array();
	images[0]="/images/auto-complete-dropdown/top-left-trans.png"
	images[1]="/images/auto-complete-dropdown/top-right-trans.png"
	images[2]="/images/auto-complete-dropdown/middle-left-trans.png"
	images[3]="/images/auto-complete-dropdown/middle-right-trans.png"
	images[4]="/images/auto-complete-dropdown/bottom-left-trans.png"
	images[5]="/images/auto-complete-dropdown/bottom-center-trans.png"
	images[6]="/images/auto-complete-dropdown/bottom-right-trans.png"
	images[7]="/images/auto-complete-dropdown/anchor-trans.png"
	
	// start preloading
	for(i=0; i<images.length; i++) 
	{
		imageObj.src=images[i];
	}
}