/* * Controles del menu lateral (principalmente responsive) */ $(document).ready(function () { /*$("#sidebar").niceScroll({ cursorcolor: '#53619d', cursorwidth: 4, cursorborder: 'none' });*/ // preparamos el overlay $("body").prepend('
'); // Duplicamos el menu normal en el desplegable $("#sidebar .menu").html( $("#navbarResponsive > ul").html() ); var menuProyecto = $(".menu-lateral.sidebar > li > ul").html(); if (menuProyecto !== undefined) { var aParentProyecto = $("#sidebar a[href*='#content']"); var parentProyecto = $(aParentProyecto).parent(); parentProyecto.append("") aParentProyecto.addClass("active"); parentProyecto.addClass("active"); } $('#dismiss, .overlay').on('click', function () { $('#sidebar').removeClass('active'); $('.overlay').fadeOut(); }); $('#sidebar-toggle').on('click', function () { if ($('#sidebar').hasClass('active')) { // Ocultamos el menu $(".overlay").click(); $(".masthead .logo-container.floater").show(); } else { // Mostrmaos el menu $('#sidebar').addClass('active'); $('.overlay').fadeIn(); $('.collapse.in').toggleClass('in'); $('a[aria-expanded=true]').attr('aria-expanded', 'false'); $(".masthead .logo-container.floater").hide(); } }); /*if ($(window).innerWidth() >= 1200) { $("body.home #sidebar-toggle").click(); }*/ $("#sidebar").css('transition', 'all 0.3s'); // // Funciones para desplegar submenus // /** * Abre/Cierra un submenu con efecto * @param {type} elemento * @returns {undefined} */ function toggleSubmenu(elemento) { elemento.toggle(200); } // Al cargar la web: // Desplegamos los padres $('#sidebar .active, .sidebar .active').parents('ul').each(function (k, el) { $(el).show(); }); $('#sidebar .active, .sidebar .active').parents('li').each(function (k, el) { $(el).addClass('active'); }); // Desplegamos los primeros niveles $('.sidebar > li > ul, .sidebar > li > ul > li > ul, #sidebar li.active > ul').each(function (k, el) { //Quitamos le show de los primeros niveles para que no se desplieguen todos //$(el).show(); }); $('.sidebar > li > ul, .sidebar > li > ul > li > ul').each(function (k, el) { //Quitamos le show de los primeros niveles para que no se desplieguen todos $(el).hide(); }); // Quitamos el primer elemento de las subcategorias $('.sidebar > li > ul > li > ul ul > li:first-child').each(function (k, el) { $(el).hide(); }); // Desplegamos el hijo $('#sidebar .active').next('ul').show(); $('.sidebar .active').children('ul').show(); // Al hacer clic en elementos $("#sidebar a > i").on('click', function (e) { toggleSubmenu($(this).parent().next('ul')); return false; }); $(".sidebar > li > ul > li > a").on('click', function (e) { //$(".sidebar > li > ul > li > ul").hide(); var currentIndex = $(".sidebar > li > ul > li > a").index(this); $(".sidebar > li > ul > li > ul").each(function (index) { // Evitamos que se cierre el actual (sino se volveria abrir en toogloe) // y el que tenga elementos activos if (currentIndex != index && $(this).find(".active").length <= 0) { $(this).hide(); } }); }); //$(".sidebar a").on('click', function (e) { $(".sidebar > li > ul > li > a").on('click', function (e) { //if (!$(this).is('[href]') || $(this).next('ul').length) { if ($(this).next('ul').length) { toggleSubmenu($(this).next('ul')); refreshMenuLateral(true); return false; } }); $("#sidebar a").on('click', function () { if (!$(this).attr('href')) { toggleSubmenu($(this).next('ul')); } else { $(".overlay").click(); } }); // Seguimiento scroll var menuScroll = $(".menu-lateral"); var menuParent = menuScroll.parent(); if (menuParent.length > 0) { var extraSpace = parseInt($("#mainNav").innerHeight()) + 10; menuScroll.css('position', 'absolute'); menuParent.css('min-height', menuScroll.innerHeight()); // Control del scroll para la direccion var previousScroll = 0; refreshMenuLateral(true); $(window).scroll(function () { refreshMenuLateral() }); } /** * * @param {type} forceRefresh Si es true readaptara el espacio que ocupa el menu (pasandolo de absolute a relative y viceversa) * @returns {undefined} */ function refreshMenuLateral(forceRefresh) { if ($(this).width() < 768) return; if (forceRefresh) { // Hacemos que la capa que contiene el menu se reajuste si es mas peque�a var currentPosition = menuScroll.css('position'); menuScroll.css('position', ''); menuScroll.css('position', currentPosition); } // PX de desplazamiento del scroll a�adiendo el espacio extra (un menu flotante, etc...) var currentScroll = $(this).scrollTop(); // // Variables que cambian al redimensionarse el navegador u otros casos // // Posicion en la que comienza el contenedor del menu (absoluta) var startMenuContainer = parseInt(menuParent.offset().top); // Posicion en la que termina el contenedor del menu (absoluta) var endMenuContainer = startMenuContainer + menuParent.innerHeight(); // Tama�o del menu var heightMenu = parseInt(menuScroll.innerHeight()); // Variable a asignar con la nueva posicion absoluta var newPosition = null; if ($(this).innerHeight() > heightMenu) { // Mostramos el menu en la pantalla si cabe siguiendo al usuario tal cual if (currentScroll + extraSpace > startMenuContainer) { newPosition = currentScroll + extraSpace - startMenuContainer; } else { newPosition = 0; } } else { // El menu no cabe en la ventana, tenemos que hacer que simular el seguimiento inteligente // // Variables dinamicas // // Calculamos donde termina la vista del navegador var windowBottom = currentScroll + $(this).innerHeight(); // Posicion TOP actual del menu var menuTop = menuScroll.css('top'); menuTop = (menuTop == 'auto') ? 0 : parseInt(menuTop); if (currentScroll > previousScroll) { // Scroll DOWN if (currentScroll > startMenuContainer) { // Posicion donde termina actualmente el menu superior (absoluta al navegador) var menuEndTop = menuTop + heightMenu + startMenuContainer + extraSpace; // El menu esta "oculto" if (windowBottom > menuEndTop) { newPosition = windowBottom - heightMenu - startMenuContainer - extraSpace; } } } else { var menuStartTop = menuTop + startMenuContainer + extraSpace; // Scroll UP if (currentScroll < menuStartTop) { newPosition = currentScroll - startMenuContainer + extraSpace; } } } // Actualizamos la posicion del elemento if (newPosition !== null) { // Evitamos que se sobresalga del menu if (newPosition < 0) { newPosition = 0; } else if (newPosition + heightMenu + startMenuContainer > endMenuContainer) { newPosition = endMenuContainer - heightMenu - startMenuContainer; } menuScroll.css('top', newPosition); } // Actualizamos el scroll anterior previousScroll = currentScroll; } });