﻿/**
- autocomplete(idauto,idtextf,footer,header,msgnoelements)
** PARAMETROS **
** - idauto: [string] id que se le va a dar a la tabla de autocompletar
** - idtextf: [string] id del elmento caja de texto sobre el que se va a actuar
** - footer: [boolean] indica si se quiere boton de cerrar o no en el autocompletar
** - header: [boolean] indica si se quiere las cabeceras o no en el autocompletar
** VARIABLES **
** - t: [table] es la tabla que contiene el autocompletar
** - idauto: [string] id de la tabla autocompletar
** - idtextf: [string] id del elemento caja de texto sobre el que se va a actuar
** - JSONObject: [object] guarda el objeto json devuelto que contiene la estructura
** - lang: [string] lenguaje a usar
** - numelem: [int] numero de elemento actual (linea actual, TR)
** - len: [int] numero de datos (lineas)
** - pag: [int] pagina actual (no usado por ahora)
** - ocultada: [int] [0,1] indica el estado de la tabla, visible o no visible
** - footer: [bool] indica si ponemos o no el boton cerrar en la tabla
** - header: [bool] indica si ponemos o no las cabeceras
** - msgnoelements: [bool] indica si ponemos mensaje cuando no hay elementos
** PRIVATE METHOD **
** - constructorTable(idauto)
**** VARIABLES ****
**** - idauto: [string] id que se le va a dar a la tabla de autocompletar
**** RETURN ****
**** - t [table] retorna un objeto table, que es la tabla autocompletar
**/
function autocomplete(idauto, idtextf, footer, header, msgnoelements) {
    this.t = constructorTable(idauto);
    this.idauto = idauto;
    this.idtextf = idtextf;
    this.JSONObject = null;
    this.lang = 'es';
    this.numelem = -1;
    this.len = 0;
    this.pag = 0;
    this.ocultada = -1;
    this.cerrada = -1;
    this.footer = footer;
    this.header = header;
    this.msgnoelements = msgnoelements;
    
    function constructorTable(idauto) {
        var t = document.createElement("table");
        t.setAttribute("id", idauto);
        t.className = "sty_t";
        t.cellSpacing = (t.cellPadding = "0");
        t.style.display = 'none';
        document.body.appendChild(t);
        return t;
    }
}

/**
- METHOD ocultar()
** oculta la tabla de autocompletar y cambia el valor del flag ocultada
**/
autocomplete.prototype.ocultar = function() {
    $('#' + this.idauto).css('display', 'none');
    this.ocultada = 1;
}

/**
- METHOD mostrar()
** muestra la tabla de autocompletar y cambia el valor del flag ocultada
**/
autocomplete.prototype.mostrar = function() {
    $('#' + this.idauto).css('display', '');
    this.ocultada = 0;
}

/**
- METHOD ocultar()
** oculta la tabla de autocompletar y cambia el valor del flag ocultada
**/
autocomplete.prototype.cerrar = function() {
    $('#' + this.idauto).css('display', 'none');
    this.cerrada = 1;
}

/**
- METHOD mostrar()
** muestra la tabla de autocompletar y cambia el valor del flag ocultada
**/
autocomplete.prototype.abrir = function() {
    $('#' + this.idauto).css('display', '');
    this.cerrada = 0;
}

/**
- METHOD limpiar()
** elimina todo el contenido de la tabla autocompletar (tbody,tr,td,...)
**/
autocomplete.prototype.limpiar = function() {
    $('#' + this.idauto).empty();
    //while (this.t.rows.length) this.t.deleteRow(-1);
    /*var tb = document.getElementById("tbodyauto");
    if (tb && tb.hasChildNodes()) {
        while (tb.childNodes.length >= 1) tb.removeChild(tb.firstChild);
    }*/
}

/**
- METHOD anadirLineas(result)
** añade todo el contenido del json a la tabla autocompletar
** PARAMETROS **
** - result: [string json] json en formato string
**/
autocomplete.prototype.anadirLineas = function(result, funcion) {
    var myJSONObject = eval('(' + result + ')');
    this.JSONObject = myJSONObject;
    this.limpiar();
    this.numelem = -1;
    this.t.style.display = 'none';
    //creo el tbody si no esta, solo la primera vez no estara
    var tb = document.getElementById("tbodyauto");
    if (!tb) {
        tb = document.createElement("tbody");
        tb.setAttribute("id", "tbodyauto");
        tb.setAttribute("name", "tbodyauto");
        //$('#tableauto').append(tb);
        this.t.appendChild(tb);
    }
    //
    if (this.header) {//Cabeceras
        var r = document.createElement("tr");
        var d = document.createElement("td");

        var theader = document.createElement("table");
        theader.cellSpacing = (theader.cellPadding = "0");
        theader.style.width = '100%';
        var tbheader = document.createElement("tbody");
        var rheader = document.createElement("tr");
        var dheader1 = document.createElement("td");
        dheader1.style.width = '50%';
        dheader1.className = "sty_tdheader1";
        var mheader1 = document.createElement("span");
        mheader1.appendChild(document.createTextNode("Nombre"));
        var dheader2 = document.createElement("td");
        dheader2.style.width = '50%';
        dheader2.className = "sty_tdheader2";
        var mheader2 = document.createElement("span");
        mheader2.appendChild(document.createTextNode("Actividad"));

        dheader2.appendChild(mheader2);
        dheader1.appendChild(mheader1);
        rheader.appendChild(dheader1);
        rheader.appendChild(dheader2);
        tbheader.appendChild(rheader);
        theader.appendChild(tbheader);
        d.appendChild(theader);
        r.appendChild(d);
        $('#tbodyauto').append(r);
    }

    var i = 0;
    var aut = this;
    this.len = myJSONObject.autocompletar.length;
    //Si esta vacio borramos
    if (this.len == 0) {
        if ((this.msgnoelements) && ($('#' + this.idtextf).val() != '')) {
            //this.ocultar();
            var r = document.createElement("tr");
            var d = document.createElement("td");
            d.appendChild(document.createTextNode('No existen elementos.'));
            r.appendChild(d);
            $('#tbodyauto').append(r);
            this.t.style.display = '';
        }
        else
            this.limpiar();
    }
    else
        this.t.style.display = '';
    for (i = 0; i < myJSONObject.autocompletar.length; i++) {
        var r = document.createElement("tr");
        r.setAttribute("id", "tr" + i);
        r.setAttribute("name", "tr" + i);
        r.style.height = "20%";
        r.onmouseover = function() { aut.marcaLinea(this); };
        r.onclick = function() { /*aut.marcaClick(this);*/if (funcion != "") { eval(funcion); } aut.ocultar(); /*aut.limpiar();*/ };
        var d = document.createElement("td");
        d.setAttribute("id", "td" + i);
        d.setAttribute("name", "td" + i);
        d.className = "sty_td_b";

        if (!this.header) { //Sin cabeceras ni indicadores
            d.appendChild(document.createTextNode(myJSONObject.autocompletar[i].desc));
        }
        else {
            var mtext = document.createElement("span");
            mtext.style.width = '90%';
            var mindica = document.createElement("span");
            mindica.style.width = '10%';
            if (myJSONObject.autocompletar[i].actividad == '') {
                mindica.className = "sty_indica_act";
                mindica.appendChild(document.createTextNode('A'));
                mtext.appendChild(document.createTextNode(myJSONObject.autocompletar[i].desc));
            }
            else {
                mindica.className = "sty_indica_raz";
                mindica.appendChild(document.createTextNode('N'));
                mtext.appendChild(document.createTextNode(myJSONObject.autocompletar[i].desc + ' - ' + myJSONObject.autocompletar[i].actividad));
            }
            mtext.className = "sty_mtext";
            d.appendChild(mindica);
            d.appendChild(mtext);
        }

        r.appendChild(d);

        $('#tbodyauto').append(r);
    }

    if (this.footer) {
        //Cerrrar
        var r = document.createElement("tr");
        r.className = "sty_trcerrar";
        //r.onmouseover = queFocus;
        var d = document.createElement("td");
        d.className = "sty_td_cerrar";
        var m = document.createElement("span");
        m.className = "sty_td_cerrar";
        m.appendChild(document.createTextNode("[x]"));
        m.onclick = function() { aut.cerrar(); aut.limpiar(); };
        d.appendChild(m);
        r.appendChild(d);
        $('#tbodyauto').append(r);
    }
}

/**
- METHOD posicionar(ewidth, etop, eleft)
** posiciona la tabla autocompletar
** PARAMETROS **
** - ewidth: [int] pixels a sumar al tamaño de la tabla (esta coge por defecto el tamaño del textbox)
** - etop: [int] pixels a sumar a la posicion top de la tabla autocompletar
** - eleft: [int] pixels a sumar a la posicion left de la tabla autocompletar
**/
autocomplete.prototype.posicionar = function(ewidth, etop, eleft) {
    var v = this.t.style;
    var curleft = curtop = 0;
    //var obj = document.form1.tbxBusqueda1;
    var obj = document.getElementById(this.idtextf);
    var h = obj.offsetHeight - 1;
    var w = obj.offsetWidth;
    if (obj.offsetParent) {
        do {
            curleft += obj.offsetLeft;
            curtop += obj.offsetTop;
        }
        while (obj = obj.offsetParent);
    }
    v.top = (h + curtop) + etop + "px";
    v.left = curleft + eleft + "px";
    v.width = w + ewidth + "px";
}

/**
- METHOD addRule(ewidth, etop, eleft)
** añade estilo al tag styles de la pagina
** PARAMETROS **
** - s: [string] documento stylesheet de la pagina
** - l: [string] nombre del estilo
** - c: [string] valores del estilo
** RETURN
** - [boolean] retorna un booleano que indica si fue o no bien la insercion
**/
autocomplete.prototype.addRule = function(s, l, c) {
    if (!s) return false;
    if (s.insertRule) {
        s.insertRule(l + "{" + c + "}", s.cssRules.length);
        return true;
    }
    else if (s.addRule) {
        return s.addRule(l, c) ? true : false;
    }
    return false;
}

/**
- METHOD anadirEstilos(nombreDocStyle)
** añade los estilos, necesario para el autocompletar, a la pagina
** PARAMETROS **
** - nombreDocStyle: [string] nombre del documento stylesheet de la pagina
**/
autocomplete.prototype.anadirEstilos = function(nombreDocStyle) {
    var ss = false;
    if (document.styleSheets) ss = document.styleSheets[nombreDocStyle];
    if (!ss) ss = document.getElementById(nombreDocStyle);
    if (ss.sheet) ss = ss.sheet;
    if (ss.styleSheet) ss = ss.styleSheet;

    this.addRule.call(this, ss, ".sty_t", "text-align:left;font-size:10px;cursor:default;line-height:15px;border:1px solid black;z-index:99;background:white;position:absolute;margin:0;");
    this.addRule.call(this, ss, ".sty_t td", "padding-left:3px;");
    this.addRule.call(this, ss, ".sty_td_a", "background:#36c;color:white;padding-bottom:1px;");
    this.addRule.call(this, ss, ".sty_td_a td", "color:white;");
    this.addRule.call(this, ss, ".sty_trcerrar", "text-align:right;font-size:10px;color:#FFFFFF;padding:5px 0px 0px 3px;background:white;");
    this.addRule.call(this, ss, ".sty_td_cerrar td", "padding:0 3px 2px;text-align:right;font-size:10px;line-height:10px;background:white;");
    this.addRule.call(this, ss, ".sty_td_cerrar span", "padding-left:3px;color:#36c;text-decoration:none;cursor:pointer;background:white;");
    this.addRule.call(this, ss, ".sty_tdheader1", "padding-left:3px;background:#0099E9;color:#FFFFFF;");
    this.addRule.call(this, ss, ".sty_tdheader2", "padding-left:3px;background:#FEBD00;color:#FFFFFF;");
    this.addRule.call(this, ss, ".sty_indica_raz", "padding-left:2px;padding-right:2px;background:#0099E9;color:#FFFFFF;");
    this.addRule.call(this, ss, ".sty_indica_act", "padding-left:2px;padding-right:2px;background:#FEBD00;color:#FFFFFF;");
    this.addRule.call(this, ss, ".sty_mtext", "padding-left:2px;");
}

/**
- METHOD marcaLinea(objline)
** coloca la accion del mouseover sobre la linea
** PARAMETROS **
** - objline: [string] id de la linea sobre la que se realiza el mouseover
**/
autocomplete.prototype.marcaLinea = function(objline) {
    $('#tr' + this.numelem).removeClass('sty_td_a');
    var nametr = objline.id;
    $('#' + nametr).addClass('sty_td_a');
    this.numelem = parseInt(nametr.replace("tr",""));
}

/**
- METHOD marcaClick(objline)
** coloca la accion del click sobre la linea
** PARAMETROS **
** - objline: [string] id de la linea sobre la que se realiza el click
**/
autocomplete.prototype.marcaClick = function(objline) {
    var nametr = objline.id;
    this.numelem = parseInt(nametr.replace("tr", ""));
    $('#' + this.idtextf).val(this.JSONObject.autocompletar[this.numelem].desc);
}

/**
- METHOD marcaPrimero()
** marca el primer elemento de la lista
**/
autocomplete.prototype.marcaPrimero = function() {
    if (this.len == 0) return false;
    //$('tbody tr:first-child', $('#tableauto')).removeClass('sty_td_a').addClass('sty_td_a');
    $('#tr0').addClass('sty_td_a')
    //$('#' + this.idtextf).val($('tbody tr:first-child', $('#' + this.idauto)).text());
    //$('#' + this.idtextf).val($('#tr0').text());
    this.numelem = 0;
    if (!this.header) {
        $('#' + this.idtextf).val($('#tr' + this.numelem).text());
    }
    else {
        if (this.JSONObject.autocompletar[this.numelem].actividad == '')
            $('#' + this.idtextf).val(this.JSONObject.autocompletar[this.numelem].desc);
        else
            $('#' + this.idtextf).val(this.JSONObject.autocompletar[this.numelem].desc + ' - ' + this.JSONObject.autocompletar[this.numelem].actividad);
    }
}

/**
- METHOD marcaUltimo()
** marca el ultimo elemento de la lista
**/
autocomplete.prototype.marcaUltimo = function() {
    if (this.len == 0) return false;
    this.numelem = (this.len - 1);
    $('#tr' + this.numelem).addClass('sty_td_a')
    //$('tbody tr:last-child', $('#tableauto')).removeClass('sty_td_a').addClass('sty_td_a');
    //$('#' + objauto.idtextf).val($('tbody tr:last-child', $('#' + objauto.idauto)).text());
    //$('#' + this.idtextf).val($('#tr' + this.numelem).text());
    if (!this.header) {
        $('#' + this.idtextf).val($('#tr' + this.numelem).text());
    }
    else {
        if (this.JSONObject.autocompletar[this.numelem].actividad == '')
            $('#' + this.idtextf).val(this.JSONObject.autocompletar[this.numelem].desc);
        else
            $('#' + this.idtextf).val(this.JSONObject.autocompletar[this.numelem].desc + ' - ' + this.JSONObject.autocompletar[this.numelem].actividad);
    }
}

/**
- METHOD marcaSubir()
** marca el siguiente elemento por encima en la lista
**/
autocomplete.prototype.marcaSubir = function(line) {
    if (this.len == 0) return false;
    if (this.numelem == -1)
        this.marcaUltimo.call(this);
    else {
        $('#tr' + this.numelem).removeClass('sty_td_a')
        if (this.numelem > 0) {
            this.numelem--;
        } else { this.numelem = this.len - 1; }
        $('#tr' + this.numelem).addClass('sty_td_a');
        //$('#' + this.idtextf).val($('#tr' + this.numelem).text());
        if (!this.header) {
            $('#' + this.idtextf).val($('#tr' + this.numelem).text());
        }
        else{
            if (this.JSONObject.autocompletar[this.numelem].actividad == '')
                $('#' + this.idtextf).val(this.JSONObject.autocompletar[this.numelem].desc);
            else
                $('#' + this.idtextf).val(this.JSONObject.autocompletar[this.numelem].desc + ' - ' + this.JSONObject.autocompletar[this.numelem].actividad);
        }
    }
}

/**
- METHOD marcaBajar()
** marca el siguiente elemento por debajo en la lista
**/
autocomplete.prototype.marcaBajar = function(line) {
    if (this.len == 0) return false;
    if (this.numelem == -1)
        this.marcaPrimero.call(this);
    else {
        $('#tr' + this.numelem).removeClass('sty_td_a')
        if (this.numelem < this.len - 1) {
            this.numelem++;
        } else { this.numelem = 0; }
        $('#tr' + this.numelem).addClass('sty_td_a');
        //$('#' + this.idtextf).val($('#tr' + this.numelem).text());
        if (!this.header) {
            $('#' + this.idtextf).val($('#tr' + this.numelem).text());
        }
        else {
            if (this.JSONObject.autocompletar[this.numelem].actividad == '')
                $('#' + this.idtextf).val(this.JSONObject.autocompletar[this.numelem].desc);
            else
                $('#' + this.idtextf).val(this.JSONObject.autocompletar[this.numelem].desc + ' - ' + this.JSONObject.autocompletar[this.numelem].actividad);
        }
    }
}

/**
- METHOD cogerElementoActual()
** devuelve los datos del elemento actual
** RETURN **
** - [desc,actividad,cod,pag] [object] retorna un objeto con los datos del elemento
**/
autocomplete.prototype.cogerElementoActual = function() {
    if (this.numelem == -1) { this.numelem = 0; }
    //return { text: $('#tr' + this.numelem).text(), value: $('#tr' + this.numelem).val() }
    if (this.JSONObject == null) { return { desc: "", cod: "", pag: ""} }
    if (this.JSONObject.autocompletar.length == 0) { return { desc: "", cod: "", pag: ""} }
    return { desc: this.JSONObject.autocompletar[this.numelem].desc, actividad: this.JSONObject.autocompletar[this.numelem].actividad, cod: this.JSONObject.autocompletar[this.numelem].codigo, pag: this.JSONObject.autocompletar[this.numelem].pag, anuncio: this.JSONObject.autocompletar[this.numelem].anuncio, descseo: this.JSONObject.autocompletar[this.numelem].descseo }
}

/**
- METHOD cogerElemento(elem)
** devuelve los datos del elemento actual
** PARAMETROS **
** - elem: [int] numero del elemento a devolver
** RETURN **
** - [desc,actividad,cod,pag] [object] retorna un objeto con los datos del elemento pedido
**/
autocomplete.prototype.cogerElemento = function(elem) {
return { desc: this.JSONObject.autocompletar[elem].desc, actividad: this.JSONObject.autocompletar[elem].actividad, cod: this.JSONObject.autocompletar[elem].codigo, pag: this.JSONObject.autocompletar[elem].pag, anuncio: this.JSONObject.autocompletar[this.numelem].anuncio, descseo: this.JSONObject.autocompletar[this.numelem].descseo }
}
