gistfile1.js

document.addEventListener('DOMContentLoaded', function(event) {
    /* Función que carga el arbol taxonomico */
    cargarArbolTaxonomico();

    function cargarArbolTaxonomico() {
        /* Reinos */
        /* Llamada ajax para consultar Reinos */
        var codigoConsulta = {
            'codigoConsulta': 0
        };
        $.ajax({
            data: codigoConsulta,
            url: 'procesos_control_panel.php', //url de donde obtener los datos
            dataType: 'json', //tipo de datos retornados
            type: 'post' //enviar variables como post
        }).done(function(data) {
            /* convertir el objeto JSON a texto */
            var json_string = JSON.stringify(data);
            /* Convertir el texto a un nuevo objeto */
            var obj = $.parseJSON(json_string);
            /* Cuenta la cantidad de valores del array */
            var $countArray = obj.length;
            /* Asigna cantidad de hermanos al taxón según la cantidad del array */
            if ($('.li-reino-especie').length != $countArray) {
                for (var i = 1; i < $countArray; i++) {
                    $('.li-reino-especie:nth-of-type(1)').clone().appendTo('#ul-arbol-taxonomico-especie');
                }
            }
            /* Asigna nombres a los taxones */
            for (var i = 0; i < $countArray; i++) {
                $('.li-reino-especie div>span:nth-of-type(1) span:nth-of-type(2)').eq(i).html('Reino');
                $('.li-reino-especie div>span:nth-of-type(2)').eq(i).html(obj[i][1]);
                $('.li-reino-especie div>span:nth-of-type(2)').eq(i).attr('data-taxon', 'reino');
                $('.li-reino-especie div>span:nth-of-type(2)').eq(i).attr('data-id', obj[i][0]);
                $('.li-reino-especie div>span:nth-of-type(2)').eq(i).attr('data-jerarquia', obj[i][2]);
            }
        });

        /* Callbacks para ordenar la descarga de taxones */
        var callbacks = $.Callbacks();
        callbacks.add(cargarTaxon);
        callbacks.fire('División');
        callbacks.fire('Clase');
        callbacks.fire('Subclase');
        callbacks.fire('Orden');
        callbacks.fire('Familia');
        callbacks.fire('Subfamilia');
        callbacks.fire('Género');
        callbacks.fire('Especie');
    }

    function cargarTaxon(nombreTaxon) {
        /* Declara variables de la función */
        var $nombreTaxon;
        var $nombreSimpleTaxon;
        var $claseUlModeloTaxon;
        var $claseLiModeloTaxon;
        var $ulModeloTaxon;
        var $liModeloTaxon;
        /* Asigna variables según el parámetro 'nombreTaxón' */
        switch (nombreTaxon) {
            case 'División':
                $nombreTaxon = nombreTaxon;
                $nombreSimpleTaxon = 'division';
                $claseUlModeloTaxon = 'ul-arbol-division-especie';
                $claseLiModeloTaxon = 'li-arbol-division-especie';
                $codigoConsulta = 1;
                break;
            case 'Clase':
                $nombreTaxon = nombreTaxon;
                $nombreSimpleTaxon = 'clase';
                $claseUlModeloTaxon = 'ul-arbol-clase-especie';
                $claseLiModeloTaxon = 'li-arbol-clase-especie';
                $codigoConsulta = 2;
                break;
            case 'Subclase':
                $nombreTaxon = nombreTaxon;
                $nombreSimpleTaxon = 'subclase';
                $claseUlModeloTaxon = 'ul-arbol-subclase-especie';
                $claseLiModeloTaxon = 'li-arbol-subclase-especie';
                $codigoConsulta = 3;
                break;
            case 'Orden':
                $nombreTaxon = nombreTaxon;
                $nombreSimpleTaxon = 'orden';
                $claseUlModeloTaxon = 'ul-arbol-orden-especie';
                $claseLiModeloTaxon = 'li-arbol-orden-especie';
                $codigoConsulta = 4;
                break;
            case 'Familia':
                $nombreTaxon = nombreTaxon;
                $nombreSimpleTaxon = 'familia';
                $claseUlModeloTaxon = 'ul-arbol-familia-especie';
                $claseLiModeloTaxon = 'li-arbol-familia-especie';
                $codigoConsulta = 5;
                break;
            case 'Subfamilia':
                $nombreTaxon = nombreTaxon;
                $nombreSimpleTaxon = 'subfamilia';
                $claseUlModeloTaxon = 'ul-arbol-subfamilia-especie';
                $claseLiModeloTaxon = 'li-arbol-subfamilia-especie';
                $codigoConsulta = 6;
                break;
            case 'Género':
                $nombreTaxon = nombreTaxon;
                $nombreSimpleTaxon = 'genero';
                $claseUlModeloTaxon = 'ul-arbol-genero-especie';
                $claseLiModeloTaxon = 'li-arbol-genero-especie';
                $codigoConsulta = 7;
                break;
            case 'Especie':
                $nombreTaxon = nombreTaxon;
                $nombreSimpleTaxon = 'especie';
                $claseUlModeloTaxon = 'ul-arbol-especie-especie';
                $claseLiModeloTaxon = 'li-arbol-especie-especie';
                $codigoConsulta = 8;
                break;
            default:
                console.log('Error al cargar el taxón "' + nombreTaxon + '".');
                break;
        }
        /* Recoge el modelo Ul de los taxones */
        $ulModeloTaxon = $('#ul-arbol-taxonomico-especie').clone().removeAttr('id').removeAttr('class');
        /* Recoge el modelo Li de los taxones */
        $liModeloTaxon = $('.li-reino-especie').clone().removeAttr('class');

        /* Cambia la clase del taxón */
        $ulModeloTaxon.attr('class', $claseUlModeloTaxon);
        $ulModeloTaxon.find('li').attr('class', $claseLiModeloTaxon);
        /* Cambia la clase del taxón */
        $liModeloTaxon.attr('class', $claseLiModeloTaxon);

        /* Función AJAX para consultar el Taxón */
        var codigoConsulta = {
            'codigoConsulta': $codigoConsulta
        };
        $.ajax({
            data: codigoConsulta,
            url: 'procesos_control_panel.php',
            dataType: 'json',
            type: 'post'
        }).done(function(data) {
            /* Contador de padres */
            var $i = 0;
            var $j = 0;
            /* Contador de hijos por padre */
            var $l = 0;
            var $idParent = '';
            var $parentContieneHijos = false;
            var $parent;
            /* Asigna variables según el parámetro 'nombreTaxón' */
            switch (nombreTaxon) {
                case 'División':
                    $parent = $('.li-reino-especie');
                    break;
                case 'Clase':
                    $parent = $('.li-arbol-division-especie');
                    break;
                case 'Subclase':
                    $parent = $('.li-arbol-clase-especie');
                    break;
                case 'Orden':
                    $parent = $('.li-arbol-subclase-especie');
                    break;
                case 'Familia':
                    $parent = $('.li-arbol-orden-especie');
                    break;
                case 'Subfamilia':
                    $parent = $('.li-arbol-familia-especie');
                    break;
                case 'Género':
                    $parent = $('.li-arbol-subfamilia-especie');
                    break;
                case 'Especie':
                    $parent = $('.li-arbol-genero-especie');
                    break;
                default:
                    console.log('Error al cargar el taxón '' + nombreTaxon + ''.');
                    break;
            }
            /* convertir el objeto JSON a texto */
            var json_string = JSON.stringify(data);
            /* Convertir el texto a un nuevo objeto */
            var objArray = $.parseJSON(json_string);
            /* Cuenta los padres */
            var $countParent = $parent.length;

            /* Bucle para tomar el id de los parent */
            for ($i = 0; $i <= $countParent; $i++) {
                $idParent = $parent.find('>div>span:nth-of-type(2)').eq($i).data('id');
                /* Reinicia parametro a false */
                $parentContieneHijos = false;
                /* Reinicia parametro a 0 */
                $l = 0;
                /* Bucle comprueba si el Taxón Padre tiene hijos */
                for ($j = 0; $j < objArray.length; $j++) {
                    if ($idParent == objArray[$j][1]) {
                        $parentContieneHijos = true;
                    }
                }
                /* Condición si el taxón padre tiene hijos */
                if ($parentContieneHijos === true) {
                    $parent.eq($i).append($ulModeloTaxon.clone());
                }
                for ($j = 0; $j < objArray.length; $j++) {
                    if ($idParent == objArray[$j][1]) {
                        /* Si existe un solo hijo */
                        if ($l === 0) {
                            /* Asigna + 1 al contador */
                            $parent.eq($i).find('.' + $claseLiModeloTaxon).eq($l).find('>div>span:nth-of-type(1)>span:nth-of-type(2)').text($nombreTaxon);
                            $parent.eq($i).find('.' + $claseLiModeloTaxon).eq($l).find('>div>span:nth-of-type(2)').text(objArray[$j][2]);
                            $parent.eq($i).find('.' + $claseLiModeloTaxon).eq($l).find('>div>span:nth-of-type(2)').attr('data-taxon', $nombreSimpleTaxon);
                            $parent.eq($i).find('.' + $claseLiModeloTaxon).eq($l).find('>div>span:nth-of-type(2)').attr('data-id', objArray[$j][0]);
                            $parent.eq($i).find('.' + $claseLiModeloTaxon).eq($l).find('>div>span:nth-of-type(2)').attr('data-jerarquia', objArray[$j][3]);
                            $l++;
                        } else {
                            $('.' + $claseUlModeloTaxon).eq($i).append($liModeloTaxon.clone());
                            /* Asigna + 1 al contador */
                            $parent.eq($i).find('.' + $claseLiModeloTaxon).eq($l).find('>div>span:nth-of-type(1)>span:nth-of-type(2)').text($nombreTaxon);
                            $parent.eq($i).find('.' + $claseLiModeloTaxon).eq($l).find('>div>span:nth-of-type(2)').text(objArray[$j][2]);
                            $parent.eq($i).find('.' + $claseLiModeloTaxon).eq($l).find('>div>span:nth-of-type(2)').attr('data-taxon', $nombreSimpleTaxon);
                            $parent.eq($i).find('.' + $claseLiModeloTaxon).eq($l).find('>div>span:nth-of-type(2)').attr('data-id', objArray[$j][0]);
                            $parent.eq($i).find('.' + $claseLiModeloTaxon).eq($l).find('>div>span:nth-of-type(2)').attr('data-jerarquia', objArray[$j][3]);
                            $l++;
                        }
                    }
                }
            }
        });
    }
});