
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 path = getUrl(location.href);
        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="${modulo[j].ico}"></i><span>${primeraLetraMayuscula(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>${primeraLetraMayuscula(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="${contextPath}vistas/${subcategoria[l].url}"><span>${primeraLetraMayuscula(subcategoria[l].nombre)}</span></a></li>`;
                            }
                            html += `</li></ul>`;
                        } else {
                            html += `<li class="${active}"><a href="${contextPath}vistas/${categoria[k].url}"><span>${primeraLetraMayuscula(categoria[k].nombre)}</span></a></li>`;
                        }
                    }
                    html += `</li></ul>`;
                } else {
                    html += `<li class="${active}"><a href="${contextPath}vistas/${modulo[j].url}"><i class="${modulo[j].ico}"></i><span>${primeraLetraMayuscula(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 = 75;
        $(".avatar").attr('src', `https://ui-avatars.com/api/?name=${letra}&background=3BA4CE&color=fff&rounded=true&size=${size}`);
        logOut();
    }
}
let getUrl = (path) => {
    let pattern = "^(?:.*)/vistas/(.*)$";
    let match = path.match(pattern);
    return match[1];
}

DOMSideBar.init();