
const DOMSideBar = {
    init() {
        this.setMenu();
        this.setUsuario();
    },
    setMenu() {
        let location = window.location;
        let position = getUrl(location.pathname, "/");
        let path = location.pathname.substring(position + 1);//obtiene el nombre de la vista jsp para activar la clase .active
        let menu = document.getElementById("MENU");
        let c = window.sidebar;//obtiene el menu
        console.log(c)
        let contenido = c.menu;
        let html = "";
        let active = "";
        /* Recorrer titulos */
        for (var i in contenido) {
            let titulo = contenido[i].titulo;
            html += `<li class="navigation-header"><span><i class="fa ${titulo.ico} fa-lg" title="Main pages"></i> ${titulo.nombre}</span></li>`;
            let modulo = titulo.modulo;
            for (var j in modulo) {
                if (path === modulo[j].url) {
                    active = 'active';
                } else {
                    active = '';
                }
                if (modulo[j].tipo === "2") {
                    html += `<li><a href="${modulo[j].url}"><i class="fa ${modulo[j].ico} fa-lg"></i><span>${modulo[j].nombre}</span></a><ul>`;
                    var categoria = modulo[j].categoria;
                    for (var k in categoria) {
                        if (path === categoria[k].url) {
                            active = 'active';
                        } else {
                            active = '';
                        }
                        if (categoria[k].tipo === "2") {
                            html += `<li><a href="${categoria[k].url}"><span>${categoria[k].nombre}</span></a><ul>`;
                            let subcategoria = categoria[k].subCategoria;
                            for (var l in subcategoria) {
                                if (path === subcategoria[l].url) {
                                    active = 'active';
                                } else {
                                    active = '';
                                }
                                html += `<li class="${active}"><a href="${subcategoria[l].url}"><span>${subcategoria[l].nombre}</span></a></li>`;
                            }
                            html += `</li></ul>`;
                        } else {
                            html += `<li class="${active}"><a href="${categoria[k].url}"><span>${categoria[k].nombre}</span></a></li>`;
                        }
                    }
                    html += `</li></ul>`;
                } else {
                    html += `<li class="${active}"><a href="${modulo[j].url}"><i class="fa ${modulo[j].ico} fa-lg"></i><span>${modulo[j].nombre}</span></a></li>`;
                }
            }
        }
        menu.innerHTML = html;
    },
    setUsuario(){
        document.querySelector("#usuario-nombre").innerHTML = window.nombreUsuario;
        document.querySelector("#roles-usuario").innerHTML = window.rolesUsuario;
        let letra = nombreUsuario.charAt(0);
//        let size = $('body').hasClass('sidebar-xs')? 45 : 75;
        let size = 50;
        $(".avatar").attr('src', `https://ui-avatars.com/api/?name=${letra}&background=3BA4CE&color=fff&rounded=true&size=${size}`);
        logOut();
    }
}
let getUrl = (pathname, caracter) => {
    let position = 0;
    for (let i = pathname.length - 1; i > 0; i--) {
        if (pathname[i] === caracter) {
            position = i;
            break;
        }
    }
    return position;
}

DOMSideBar.init();