﻿/**
 * Array con los datos del autocompleta
 * @var array
 */
var __AutoComplete = new Array();
/**
 * Indica si es IE
 * @var bool
 */
var isIE = document.all ? true : false;
/**
 * Indica si es Mozilla y sus derivados
 * @var bool
 */
var isGecko = navigator.userAgent.toLowerCase().indexOf('gecko') != -1;
/**
 * Indica si es Opera
 * @var bool
 */
var isOpera = navigator.userAgent.toLowerCase().indexOf('opera') != -1;


/**
 * Crea el autocompletado
 * @param string formElement Nombre del elemento en el formulario
 * @param array data Array de datos
 * @param array options Array de opciones aducionales
 *		[keypress] = "funcion(parametros);" //Se evaluara
 *		[maxelements] = 10; //Numero de elementos maximos a mostrar
 */
function AutoComplete_Create (id, data, options)
{
    __AutoComplete[id] = {'data':data, // Datos a mostrar en el autocompletado
                          'isVisible':false, // Esta visible la capa
                          'element':document.getElementById(id), // Elemento del 
                          'dropdown':null, // Desplegable del autocompleta
                          'highlighted':null, // Elemento resaltado
                          'maxelements':10}; // Numero maximo de elementos a mostrar


    __AutoComplete[id]['element'].setAttribute('autocomplete', 'off');
    __AutoComplete[id]['element'].onkeydown  = function(e) {return AutoComplete_KeyDown(this.getAttribute('id'), e);}
    __AutoComplete[id]['element'].onkeyup    = function(e) {return AutoComplete_KeyUp(this.getAttribute('id'), e);}
    
    if(inArray(options, "keypress")) {
		__AutoComplete[id]['element'].onkeypress = function(e) {eval(options["keypress"]); if (!e) e = window.event; if (e.keyCode == 13) return false;}
    } else {
		__AutoComplete[id]['element'].onkeypress = function(e) {if (!e) e = window.event; if (e.keyCode == 13) return false;}
	}
    __AutoComplete[id]['element'].ondblclick = function() {AutoComplete_ShowDropdown(this.getAttribute('id'));}
    __AutoComplete[id]['element'].onclick    = function(e) {if (!e) e = window.event; e.cancelBubble = true; e.returnValue = false;}
    
    if(inArray(options, "maxelements")) {
		__AutoComplete[id]["maxelements"] = options["maxelements"];
    }
    
    if(inArray(options, "layerName")) {
		__AutoComplete[id]["layerName"] = options["layerName"];
    } else {
		 __AutoComplete[id]["layerName"] = null;
    }
    if(inArray(options, "layerWidth")) {
		__AutoComplete[id]["layerWidth"] = options["layerWidth"];
    } else {
		 __AutoComplete[id]["layerWidth"] = null;
    }
    

    // Hides the dropdowns when document clicked
    var docClick = function()
    {
       for (id in __AutoComplete) {
           AutoComplete_HideDropdown(id);
       }
    }

    if (document.addEventListener) {
        document.addEventListener('click', docClick, false);
    } else if (document.attachEvent) {
        document.attachEvent('onclick', docClick, false);
    }


    // Max number of items shown at once
    if (arguments[2] != null) {
        __AutoComplete[id]['maxitems'] = arguments[2];
        __AutoComplete[id]['firstItemShowing'] = 0;
        __AutoComplete[id]['lastItemShowing']  = arguments[2] - 1;
    }
    
    AutoComplete_CreateDropdown(id);
    
    // Prevent select dropdowns showing thru
    if (isIE) {
		__AutoComplete[id]['iframe'] = document.createElement('iframe');
        __AutoComplete[id]['iframe'].id = id +'_iframe';
        __AutoComplete[id]['iframe'].style.position = 'absolute';
        __AutoComplete[id]['iframe'].style.top = '0';
        __AutoComplete[id]['iframe'].style.left = '0';
        __AutoComplete[id]['iframe'].style.width = '0px';
        __AutoComplete[id]['iframe'].style.height = '0px';
        __AutoComplete[id]['iframe'].style.zIndex = '1598';
        __AutoComplete[id]['iframe'].style.visibility = 'hidden';
        
		//__AutoComplete[id]['element'].parentNode.insertAfter(__AutoComplete[id]['iframe'], document.getElementByTagName("body"));
		//document.getElementById("espera").insertBefore(__AutoComplete[id]['iframe'], document.body);
		document.body.appendChild(__AutoComplete[id]['iframe']);
    }
}


/**
 * Crea la capa que hara de contenedor de datos para el autocompleta
 * 
 * @param string id El id del elemento.
 */
function AutoComplete_CreateDropdown(id)
{
    var left  = AutoComplete_GetLeft(__AutoComplete[id]['element']);
    var top   = AutoComplete_GetTop(__AutoComplete[id]['element']) + __AutoComplete[id]['element'].offsetHeight;
    var width = __AutoComplete[id]['element'].offsetWidth;

	if(__AutoComplete[id]["layerName"] == null) {
		__AutoComplete[id]['dropdown'] = document.createElement('div');
	} else {
		__AutoComplete[id]['dropdown'] = document.getElementById(__AutoComplete[id]["layerName"]);
	}
	//__AutoComplete[id]['dropdown'] = document.getElementById("layerAutocomplete");
    //__AutoComplete[id]['dropdown'] = document.createElement('div');
    __AutoComplete[id]['dropdown'].className = 'autocomplete'; // Don't use setAttribute()
    //__AutoComplete[id]['element'].parentNode.insertBefore(__AutoComplete[id]['dropdown'], __AutoComplete[id]['element']);
    if(__AutoComplete[id]["layerName"] == null) {
		__AutoComplete[id]['element'].parentNode.insertBefore(__AutoComplete[id]['dropdown'], __AutoComplete[id]['element']);
	}
	
	
	if(__AutoComplete[id]["layerWidth"] != null) {
		width = __AutoComplete[id]["layerWidth"];
	}
	
    
    // Position it
    __AutoComplete[id]['dropdown'].style.left       = left + 'px';
    __AutoComplete[id]['dropdown'].style.top        = top + 'px';
    __AutoComplete[id]['dropdown'].style.width      = width + 'px';
    __AutoComplete[id]['dropdown'].style.zIndex     = '1599';
    __AutoComplete[id]['dropdown'].style.visibility = 'hidden';
}


/**
 * Devuelve las coordenadas
 * 
 * @param object element Elemento de donde poder sacar las coordenadas
 */
function AutoComplete_GetLeft(element)
{
    var curNode = element;
    var left = 0;

    do {
        left += curNode.offsetLeft;
        if(curNode == null || curNode.offsetParent == null) {
			return left;
        }
        curNode = curNode.offsetParent;
	} while(curNode != null || curNode.tagName.toLowerCase() != 'body' || curNode.tagName.toLowerCase() != 'html');

    return left;
}


/**
 * Devuelve las coordenadas
 * 
 * @param object element Elemento de donde poder sacar las coordenadas
 */
function AutoComplete_GetTop(element)
{
    var curNode = element;
    var top = 0;

    do {
        top += curNode.offsetTop;
        if(curNode == null || curNode.offsetParent == null) {
			return top;
        }
        curNode = curNode.offsetParent;
    } while(curNode != null || curNode.tagName.toLowerCase() != 'body' || curNode.tagName.toLowerCase() != 'html');

    return top;
}


/**
 * Muestra la capa
 * 
 * @param string id El id del elemento de donde sacara los datos
 */
function AutoComplete_ShowDropdown(id)
{
    AutoComplete_HideAll();
    var value = __AutoComplete[id]['element'].value;
    var toDisplay = new Array();
    var newDiv    = null;
    var text      = null;
    var numItems  = __AutoComplete[id]['dropdown'].childNodes.length;

    // Remove all child nodes from dropdown
    while (__AutoComplete[id]['dropdown'].childNodes.length > 0) {
        __AutoComplete[id]['dropdown'].removeChild(__AutoComplete[id]['dropdown'].childNodes[0]);
    }

    for (i=0; i<__AutoComplete[id]['data'].length; ++i) {
		substrAutoName = __AutoComplete[id]['data'][i][0].substr(0, value.length);
		substrAutoIATA = __AutoComplete[id]['data'][i][1].substr(0, value.length);
		toDisplay[toDisplay.length] = __AutoComplete[id]['data'][i];
        /*if (substrAutoName.toLowerCase() == value.toLowerCase()) {
            toDisplay[toDisplay.length] = __AutoComplete[id]['data'][i];
        } else {
			if (substrAutoIATA.toLowerCase() == value.toLowerCase()) {
				toDisplay[toDisplay.length] = __AutoComplete[id]['data'][i];
			}
        }*/
    }
    
    // No matches?
    if (toDisplay.length == 0) {
        AutoComplete_HideDropdown(id);
        return;
    }
    
    // Add data to the dropdown layer
    if(toDisplay.length <= __AutoComplete[id]['maxelements']) {
		toDisplayLenght = toDisplay.length;
    } else {
		toDisplayLenght = __AutoComplete[id]['maxelements'];
    }
    
    for (i = 0; i < toDisplayLenght; ++i) {
        newDiv = document.createElement('div');
        newDiv.className = 'autocomplete_item'; // Don't use setAttribute()
        newDiv.setAttribute('id', 'autocomplete_item_' + i);
        newDiv.setAttribute('index', i);
        newDiv.style.zIndex = '1599';
        
         // Scrollbars are on display ?
        if (toDisplay.length > __AutoComplete[id]['maxitems'] && navigator.userAgent.indexOf('MSIE') == -1) {
            newDiv.style.width = __AutoComplete[id]['element'].offsetWidth - 22 + 'px';
        }

        newDiv.onmouseover = function() {AutoComplete_HighlightItem(__AutoComplete[id]['element'].getAttribute('id'), this.getAttribute('index'));};
        newDiv.onclick     = function() {AutoComplete_SetValue(__AutoComplete[id]['element'].getAttribute('id')); AutoComplete_HideDropdown(__AutoComplete[id]['element'].getAttribute('id'));}
        if(toDisplay[i][1] == "") {
			textNode = toDisplay[i][0];
        } else {
			textNode = toDisplay[i][0] + " (" + toDisplay[i][1] + ")";
        }
        
        //text   = document.createTextNode(textNode);
        text = document.createElement("span");
        text.setAttribute('id', 'autocomplete_item_span' + i);
        text.appendChild(document.createTextNode(textNode));
        
        img = document.createElement("img");
        img.setAttribute("src", "http://fotos.muchoviaje.com/images/flags/" + toDisplay[i][2].toLowerCase() + ".gif");
        img.setAttribute("style", "padding-right: 10px;");
        
        newDiv.appendChild(img);
        newDiv.appendChild(text);
        
        __AutoComplete[id]['dropdown'].appendChild(newDiv);
    }
    
    
    // Too many items?
    if (toDisplay.length > __AutoComplete[id]['maxitems']) {
        __AutoComplete[id]['dropdown'].style.height = (__AutoComplete[id]['maxitems'] * 15) + 2 + 'px';
    
    } else {
        __AutoComplete[id]['dropdown'].style.height = '';
    }

    
    /**
    * Set left/top in case of document movement/scroll/window resize etc
    */
    __AutoComplete[id]['dropdown'].style.left = AutoComplete_GetLeft(__AutoComplete[id]['element']);
    __AutoComplete[id]['dropdown'].style.top  = AutoComplete_GetTop(__AutoComplete[id]['element']) + __AutoComplete[id]['element'].offsetHeight;


    // Show the iframe for IE
    if (isIE) {
        __AutoComplete[id]['iframe'].style.top    = __AutoComplete[id]['dropdown'].style.top;
        __AutoComplete[id]['iframe'].style.left   = __AutoComplete[id]['dropdown'].style.left;
        __AutoComplete[id]['iframe'].style.width  = __AutoComplete[id]['dropdown'].offsetWidth;
        __AutoComplete[id]['iframe'].style.height = __AutoComplete[id]['dropdown'].offsetHeight;
        
        __AutoComplete[id]['iframe'].style.visibility = 'visible';
    }


    // Show dropdown
    if (!__AutoComplete[id]['isVisible']) {
        __AutoComplete[id]['dropdown'].style.visibility = 'visible';
        __AutoComplete[id]['dropdown'].style.display = 'block';
        __AutoComplete[id]['isVisible'] = true;
    }

    
    // If now showing less items than before, reset the highlighted value
    if (__AutoComplete[id]['dropdown'].childNodes.length != numItems) {
        __AutoComplete[id]['highlighted'] = null;
    }
}


/**
 * Esconde la capa
 * 
 * @param string id
 */
function AutoComplete_HideDropdown(id)
{
    if (__AutoComplete[id]['iframe']) {
        __AutoComplete[id]['iframe'].style.visibility = 'hidden';
    }


    __AutoComplete[id]['dropdown'].style.visibility = 'hidden';
    __AutoComplete[id]['highlighted'] = null;
    __AutoComplete[id]['isVisible']   = false;
}


/**
* Hides all dropdowns
*/
function AutoComplete_HideAll()
{
    for (id in __AutoComplete) {
        AutoComplete_HideDropdown(id);
    }
}


/**
 * Resalta el elemento seleccionado
 * 
 * @param string id    The form elements id. Used to identify the correct dropdown.
 * @param int    index The index of the element in the dropdown to highlight
 */
function AutoComplete_HighlightItem(id, index)
{
    if (__AutoComplete[id]['dropdown'].childNodes[index]) {
        for (var i=0; i<__AutoComplete[id]['dropdown'].childNodes.length; ++i) {
            if (__AutoComplete[id]['dropdown'].childNodes[i].className == 'autocomplete_item_highlighted') {
                __AutoComplete[id]['dropdown'].childNodes[i].className = 'autocomplete_item';
            }
        }
        
        __AutoComplete[id]['dropdown'].childNodes[index].className = 'autocomplete_item_highlighted';
        __AutoComplete[id]['highlighted'] = index;
    }
}


/**
 * Highlights the menu item with the given index
 * 
 * @param string id    The form elements id. Used to identify the correct dropdown.
 * @param int    index The index of the element in the dropdown to highlight
 */
function AutoComplete_Highlight(id, index)
{
    // Out of bounds checking
    if (index == 1 && __AutoComplete[id]['highlighted'] == __AutoComplete[id]['dropdown'].childNodes.length - 1) {
        __AutoComplete[id]['dropdown'].childNodes[__AutoComplete[id]['highlighted']].className = 'autocomplete_item';
        __AutoComplete[id]['highlighted'] = null;
    
    } else if (index == -1 && __AutoComplete[id]['highlighted'] == 0) {
        __AutoComplete[id]['dropdown'].childNodes[0].className = 'autocomplete_item';
        __AutoComplete[id]['highlighted'] = __AutoComplete[id]['dropdown'].childNodes.length;
    }

    // Nothing highlighted at the moment
    if (__AutoComplete[id]['highlighted'] == null) {
        __AutoComplete[id]['dropdown'].childNodes[0].className = 'autocomplete_item_highlighted';
        __AutoComplete[id]['highlighted'] = 0;

    } else {
        if (__AutoComplete[id]['dropdown'].childNodes[__AutoComplete[id]['highlighted']]) {
            __AutoComplete[id]['dropdown'].childNodes[__AutoComplete[id]['highlighted']].className = 'autocomplete_item';
        }

        var newIndex = __AutoComplete[id]['highlighted'] + index;

        if (__AutoComplete[id]['dropdown'].childNodes[newIndex]) {
            __AutoComplete[id]['dropdown'].childNodes[newIndex].className = 'autocomplete_item_highlighted';
            
            __AutoComplete[id]['highlighted'] = newIndex;
        }
    }
}


/**
 * Sets the input to a given value
 * 
 * @param string id    The form elements id. Used to identify the correct dropdown.
 */
function AutoComplete_SetValue(id)
{
    //__AutoComplete[id]['element'].value = __AutoComplete[id]['dropdown'].childNodes[__AutoComplete[id]['highlighted']].innerHTML;
    __AutoComplete[id]['element'].value = __AutoComplete[id]['dropdown'].childNodes[__AutoComplete[id]['highlighted']].childNodes[1].innerHTML;
}


/**
 * Checks if the dropdown needs scrolling
 * 
 * @param string id    The form elements id. Used to identify the correct dropdown.
 */
function AutoComplete_ScrollCheck(id)
{
    // Scroll down, or wrapping around from scroll up
    if (__AutoComplete[id]['highlighted'] > __AutoComplete[id]['lastItemShowing']) {
        __AutoComplete[id]['firstItemShowing'] = __AutoComplete[id]['highlighted'] - (__AutoComplete[id]['maxitems'] - 1);
        __AutoComplete[id]['lastItemShowing']  = __AutoComplete[id]['highlighted'];
    }
    
    // Scroll up, or wrapping around from scroll down
    if (__AutoComplete[id]['highlighted'] < __AutoComplete[id]['firstItemShowing']) {
        __AutoComplete[id]['firstItemShowing'] = __AutoComplete[id]['highlighted'];
        __AutoComplete[id]['lastItemShowing']  = __AutoComplete[id]['highlighted'] + (__AutoComplete[id]['maxitems'] - 1);
    }
    
    __AutoComplete[id]['dropdown'].scrollTop = __AutoComplete[id]['firstItemShowing'] * 15;
}


/**
 * Function which handles the keypress event
 * 
 * @param string id    The form elements id. Used to identify the correct dropdown.
 */
function AutoComplete_KeyDown(id)
{
    // Mozilla
    if (arguments[1] != null) {
        event = arguments[1];
    }



    var keyCode = event.keyCode;

    switch (keyCode) {

        // Return/Enter
        case 13:
            if (__AutoComplete[id]['highlighted'] != null) {
                AutoComplete_SetValue(id);
                AutoComplete_HideDropdown(id);
            }
            
            event.returnValue = false;
            event.cancelBubble = true;
            break;

        // Escape
        case 27:
            AutoComplete_HideDropdown(id);
            event.returnValue = false;
            event.cancelBubble = true;
            break;
        
        // Up arrow
        case 38:
            if (!__AutoComplete[id]['isVisible']) {
                AutoComplete_ShowDropdown(id);
            }
            
            AutoComplete_Highlight(id, -1);
            AutoComplete_ScrollCheck(id, -1);
            return false;
            break;
        // Tab
        case 9:
            if (__AutoComplete[id]['isVisible']) {
				AutoComplete_SetValue(id);
                AutoComplete_HideDropdown(id);
            } 

            return;
        
        // Down arrow
        case 40:
            if (!__AutoComplete[id]['isVisible']) {
                AutoComplete_ShowDropdown(id);
            }
            AutoComplete_Highlight(id, 1);
            AutoComplete_ScrollCheck(id, 1);
            return false;
            break;
        default:
			//AutoComplete_HighlightItem(__AutoComplete[id]['element'].getAttribute('id'), 0);
    }
}


/**
 * Function which handles the keyup event
 * 
 * @param string id    The form elements id. Used to identify the correct dropdown.
 */
function AutoComplete_KeyUp(id)
{
    // Mozilla
    if (arguments[1] != null) {
        event = arguments[1];
    }
    
    

    var keyCode = event.keyCode;

    switch (keyCode) {
        case 13:
            event.returnValue = false;
            event.cancelBubble = true;
            break;

        case 27:
            AutoComplete_HideDropdown(id);
            event.returnValue = false;
            event.cancelBubble = true;
            break;
        
        case 38:
        case 40:
            return false;
            break;

        default:
            AutoComplete_ShowDropdown(id);
            AutoComplete_HighlightItem(__AutoComplete[id]['element'].getAttribute('id'), 0);
            break;
    }
}

/**
 * Comprueba si el autocompleta es visible o no
 * @param string id    The form elements id. Used to identify the correct dropdown.
 */
function AutoComplete_isVisible(id)
{
    return __AutoComplete[id]['dropdown'].style.visibility == 'visible';
}



