var todoMenus;
var menus;
var menuNiveles;
$(document).ready(function(){
todoMenus = menujson.menu;
var menuGenerado = GenerarMenus(0, false);
$("#main-nav").append(menuGenerado);
//Si quieres pasar estos datos a un nuevo array:
menuNiveles=[];
$.each($("li"),function(i,v){
$(this).attr('data-idMenu', i+1);
var nivel = $(this).parents('ul').length;
var id = $(this).attr('id');
$(this).attr("data-nivel",nivel);
var padre = $(this).parents('li').attr('data-idMenu');
padre = padre == undefined ? 0 : padre;
$(this).attr("title","Nivel:" + nivel);
var texto = $(this).find("a:first").text();
var link = $(this).find("a:first").attr('href');
var menuNivel = {
"id": i+1,
"idPadre": padre,
"link": link,
"menu": texto,
"nivel": nivel
};
//JSON rearmado... con los niveles
menuNiveles.push(menuNivel);
});
console.log(menuNiveles);
});
function ObtenerMenus(codigoMenu) {
menus = [];
$.each(todoMenus, function (i, v) {
if (v.id_padre == codigoMenu) {
menus.push(v);
}
});
}
function GenerarMenus(codigoMenu, esSub) {
var menuGenrado = '';
if (esSub) {
menuGenrado = '<ul class="nav nav-stacked">';
}
else {
menuGenrado = '<ul class="nav nav-stacked">';
}
ObtenerMenus(codigoMenu);
if (menus != undefined) {
$.each(menus, function (i, v) {
var subMenu = GenerarMenus(v.id, true);
if (subMenu.length == 0) {
menuGenrado += '<li class=""><a href="' + v.link + '"><i class="' + v.icono + '"></i><span>' + v.titulo + '</span></a>';
} else {
menuGenrado += '<li class=""><a href="' + v.link + '" class="dropdown-collapse"><i class="' + v.icono + '"></i><span>' + v.titulo + '</span><i class="icon-angle-down angle-down"></i></a>';
menuGenrado += subMenu;
}
menuGenrado += '</li>';
});
}
menuGenrado += '</ul>'
if (menuGenrado == '<ul class="nav nav-stacked"></ul>' || menuGenrado == '<ul class="nav nav-stacked"></ul>') {
menuGenrado = '';
}
return menuGenrado;
}
var menujson = {
"menu": [
{
"id": 1,
"id_padre": 0,
"icono": "fa fa-dashboard fa-fw",
"link": "/",
"titulo": "Tablero"
},
{
"id": 2,
"id_padre": 0,
"icono": "fa fa-tasks fa-fw",
"link": "#",
"titulo": "Procesos"
},
{
"id": 3,
"id_padre": 2,
"icono": "fa fa-list-ol fa-fw",
"link": "/lotes",
"titulo": "Lotes"
},
{
"id": 4,
"id_padre": 2,
"icono": "fa fa-eraser fa-fw",
"link": "/limpieza",
"titulo": "Limpieza"
},
{
"id": 5,
"id_padre": 2,
"icono": "fa fa-stop fa-fw",
"link": "/paradasopera",
"titulo": "Paradas"
},
{
"id": 6,
"id_padre": 2,
"icono": "fa fa-wrench fa-fw",
"link": "#",
"titulo": "Mantenimiento"
},
{
"id": 7,
"id_padre": 6,
"icono": "fa",
"link": "/planes",
"titulo": "Planes"
},
{
"id": 8,
"id_padre": 6,
"icono": "fa",
"link": "/calendario",
"titulo": "Calendario"
},
{
"id": 9,
"id_padre": 0,
"icono": "fa fa-file-text-o fa-fw",
"link": "#",
"titulo": "Reportes"
},
{
"id": 10,
"id_padre": 9,
"icono": "fa fa-bar-chart-o fa-fw",
"link": "/estadisticos",
"titulo": "Estadisticos"
},
{
"id": 11,
"id_padre": 9,
"icono": "fa fa-building-o fa-fw",
"link": "/estaticos",
"titulo": "Estaticos"
},
{
"id": 12,
"id_padre": 9,
"icono": "fa fa-file fa-fw",
"link": "/parametrizados",
"titulo": "Parametrizados"
},
{
"id": 13,
"id_padre": 0,
"icono": "fa fa-wrench fa-fw",
"link": "#",
"titulo": "Opciones"
},
{
"id": 22,
"id_padre": 13,
"icono": "fa fa-industry fa-fw",
"link": "#",
"titulo": "Marcas de Equipos"
},
{
"id": 23,
"id_padre": 22,
"icono": "fa",
"link": "/marcas",
"titulo": "Marcas"
},
{
"id": 24,
"id_padre": 22,
"icono": "fa",
"link": "/modelos",
"titulo": "Modelos"
},
{
"id": 32,
"id_padre": 13,
"icono": "fa fa-clock-o fa-fw",
"link": "/turnos",
"titulo": "Turnos"
},
{
"id": 14,
"id_padre": 13,
"icono": "fa fa-flask fa-fw",
"link": "#",
"titulo": "Productos de Elaboración"
},
{
"id": 25,
"id_padre": 14,
"icono": "fa",
"link": "/productos",
"titulo": "Productos"
},
{
"id": 26,
"id_padre": 14,
"icono": "fa",
"link": "/unidadesdemedicion",
"titulo": "Unidades de Medición"
},
{
"id": 15,
"id_padre": 13,
"icono": "fa fa-arrows-alt fa-fw",
"link": "#",
"titulo": "Areas y Procesos de Producción"
},
{
"id": 30,
"id_padre": 15,
"icono": "fa",
"link": "/areas",
"titulo": "Areas"
},
{
"id": 31,
"id_padre": 15,
"icono": "fa",
"link": "/procesos",
"titulo": "Procesos "
},
{
"id": 16,
"id_padre": 13,
"icono": "fa fa-steam fa-fw",
"link": "#",
"titulo": "Registro de Equipos"
},
{
"id": 27,
"id_padre": 16,
"icono": "fa",
"link": "/equipos",
"titulo": "Equipos"
},
{
"id": 28,
"id_padre": 16,
"icono": "fa",
"link": "/partes",
"titulo": "Partes"
},
{
"id": 29,
"id_padre": 16,
"icono": "fa",
"link": "/subpartes",
"titulo": "Subpartes"
},
{
"id": 17,
"id_padre": 13,
"icono": "fa fa-user fa-fw",
"link": "/personas",
"titulo": "Personas"
},
{
"id": 18,
"id_padre": 0,
"icono": "fa fa-gears fa-fw",
"link": "#",
"titulo": "Configuración"
},
{
"id": 19,
"id_padre": 18,
"icono": "fa fa-users fa-fw",
"link": "/usuarios",
"titulo": "Usuarios"
},
{
"id": 20,
"id_padre": 18,
"icono": "fa fa-suitcase fa-fw",
"link": "/perfiles",
"titulo": "Perfiles"
},
{
"id": 21,
"id_padre": 18,
"icono": "fa fa-database fa-fw",
"link": "/respaldo",
"titulo": "Respaldo"
}
]
};
/*
* --------------------------------------------------------------------------------------------------------------------
* main navigation toggling
* --------------------------------------------------------------------------------------------------------------------
*/
(function() {
$(document).ready(function() {
var body, click_event, content, nav, nav_toggler;
nav_toggler = $("header .toggle-nav");
nav = $("#main-nav");
content = $("#content");
body = $("body");
click_event = (jQuery.support.touch ? "tap" : "click");
$("#main-nav .dropdown-collapse").on(click_event, function(e) {
var link, list;
e.preventDefault();
link = $(this);
list = link.parent().find("> ul");
if (list.is(":visible")) {
if (body.hasClass("main-nav-closed") && link.parents("li").length === 1) {
false;
} else {
link.removeClass("in");
list.slideUp(300, function() {
return $(this).removeClass("in");
});
}
} else {
if (list.parents("ul.nav.nav-stacked").length === 1) {
$(document).trigger("nav-open");
}
link.addClass("in");
list.slideDown(300, function() {
return $(this).addClass("in");
});
}
return false;
});
if (jQuery.support.touch) {
nav.on("swiperight", function(e) {
return $(document).trigger("nav-open");
});
nav.on("swipeleft", function(e) {
return $(document).trigger("nav-close");
});
}
nav_toggler.on(click_event, function() {
if (nav_open()) {
$(document).trigger("nav-close");
} else {
$(document).trigger("nav-open");
}
return false;
});
$(document).bind("nav-close", function(event, params) {
var nav_open;
body.removeClass("main-nav-opened").addClass("main-nav-closed");
return nav_open = false;
});
return $(document).bind("nav-open", function(event, params) {
var nav_open;
body.addClass("main-nav-opened").removeClass("main-nav-closed");
return nav_open = true;
});
});
this.nav_open = function() {
return $("body").hasClass("main-nav-opened") || $("#main-nav").width() > 50;
};
/*
* --------------------------------------------------------------------------------------------------------------------
* plugin initializations
* --------------------------------------------------------------------------------------------------------------------
*/
$(document).ready(function() {
var touch;
setTimeAgo();
setScrollable();
setSortable($(".sortable"));
setSelect2();
setAutoSize();
setCharCounter();
setMaxLength();
setValidateForm();
/*
* --------------------------------------------------------------------------------------------------------------------
* removes .box after click on .box-remove button
* --------------------------------------------------------------------------------------------------------------------
*/
$(".box .box-remove").on("click", function(e) {
$(this).parents(".box").first().remove();
e.preventDefault();
return false;
});
/*
* --------------------------------------------------------------------------------------------------------------------
* collapse .box after click on .box-collapse button
* --------------------------------------------------------------------------------------------------------------------
*/
$(".box .box-collapse").on("click", function(e) {
var box;
box = $(this).parents(".box").first();
box.toggleClass("box-collapsed");
e.preventDefault();
return false;
});
/*
* --------------------------------------------------------------------------------------------------------------------
* password strength
* --------------------------------------------------------------------------------------------------------------------
*/
if (jQuery().pwstrength) {
$('.pwstrength').pwstrength({
showVerdicts: false
});
}
/*
* --------------------------------------------------------------------------------------------------------------------
* check all checkboxes in table with class only-checkbox
* --------------------------------------------------------------------------------------------------------------------
*/
$(".check-all").on("click", function(e) {
return $(this).parents("table:eq(0)").find(".only-checkbox :checkbox").attr("checked", this.checked);
});
/*
* --------------------------------------------------------------------------------------------------------------------
* setting up responsive tabs
* --------------------------------------------------------------------------------------------------------------------
*/
if (jQuery().tabdrop) {
$('.nav-responsive.nav-pills, .nav-responsive.nav-tabs').tabdrop();
}
/*
* --------------------------------------------------------------------------------------------------------------------
* setting up datatables
* --------------------------------------------------------------------------------------------------------------------
*/
setDataTable($(".data-table"));
setDataTable($(".data-table-column-filter"));
/*
* --------------------------------------------------------------------------------------------------------------------
* setting up basic wysiwyg
* --------------------------------------------------------------------------------------------------------------------
*/
if (jQuery().wysihtml5) {
$('.wysihtml5').wysihtml5();
}
/*
* --------------------------------------------------------------------------------------------------------------------
* setting up sortable list
* --------------------------------------------------------------------------------------------------------------------
*/
if (jQuery().nestable) {
$('.dd-nestable').nestable();
}
/*
* --------------------------------------------------------------------------------------------------------------------
* affixing main navigation
* --------------------------------------------------------------------------------------------------------------------
*/
if (!$("body").hasClass("fixed-header")) {
if (jQuery().affix) {
$('#main-nav.main-nav-fixed').affix({
offset: 40
});
}
}
/*
* --------------------------------------------------------------------------------------------------------------------
* setting up bootstrap popovers
* --------------------------------------------------------------------------------------------------------------------
*/
touch = false;
if (window.Modernizr) {
touch = Modernizr.touch;
}
if (!touch) {
$("body").on("mouseenter", ".has-popover", function() {
var el;
el = $(this);
if (el.data("popover") === undefined) {
el.popover({
placement: el.data("placement") || "top",
container: "body"
});
}
return el.popover("show");
});
$("body").on("mouseleave", ".has-popover", function() {
return $(this).popover("hide");
});
}
/*
* --------------------------------------------------------------------------------------------------------------------
* setting up bootstrap tooltips
* --------------------------------------------------------------------------------------------------------------------
*/
touch = false;
if (window.Modernizr) {
touch = Modernizr.touch;
}
if (!touch) {
$("body").on("mouseenter", ".has-tooltip", function() {
var el;
el = $(this);
if (el.data("tooltip") === undefined) {
el.tooltip({
placement: el.data("placement") || "top",
container: "body"
});
}
return el.tooltip("show");
});
$("body").on("mouseleave", ".has-tooltip", function() {
return $(this).tooltip("hide");
});
}
/*
* --------------------------------------------------------------------------------------------------------------------
* replacing svg images for png fallback
* --------------------------------------------------------------------------------------------------------------------
*/
if (window.Modernizr && Modernizr.svg === false) {
$("img[src*=\"svg\"]").attr("src", function() {
return $(this).attr("src").replace(".svg", ".png");
});
}
/*
* --------------------------------------------------------------------------------------------------------------------
* color pickers
* --------------------------------------------------------------------------------------------------------------------
*/
if (jQuery().colorpicker) {
$(".colorpicker-hex").colorpicker({
format: "hex"
});
$(".colorpicker-rgb").colorpicker({
format: "rgb"
});
}
/*
* --------------------------------------------------------------------------------------------------------------------
* datetimepickers
* --------------------------------------------------------------------------------------------------------------------
*/
if (jQuery().datetimepicker) {
$(".datetimepicker-input").datetimepicker({
icons: {
time: "icon-time",
date: "icon-calendar",
up: "icon-arrow-up",
down: "icon-arrow-down"
}
});
$(".datepicker-input").datetimepicker({
pickTime: false,
icons: {
time: "icon-time",
date: "icon-calendar",
up: "icon-arrow-up",
down: "icon-arrow-down"
}
});
$(".timepicker-input").datetimepicker({
pickDate: false,
icons: {
time: "icon-time",
date: "icon-calendar",
up: "icon-arrow-up",
down: "icon-arrow-down"
}
});
}
/*
* --------------------------------------------------------------------------------------------------------------------
* setting bootstrap file input
* --------------------------------------------------------------------------------------------------------------------
*/
if (jQuery().bootstrapFileInput) {
$('input[type=file]').bootstrapFileInput();
}
/*
* --------------------------------------------------------------------------------------------------------------------
* modernizr fallbacks
* --------------------------------------------------------------------------------------------------------------------
*/
if (window.Modernizr) {
if (!Modernizr.input.placeholder) {
$("[placeholder]").focus(function() {
var input;
input = $(this);
if (input.val() === input.attr("placeholder")) {
input.val("");
return input.removeClass("placeholder");
}
}).blur(function() {
var input;
input = $(this);
if (input.val() === "" || input.val() === input.attr("placeholder")) {
input.addClass("placeholder");
return input.val(input.attr("placeholder"));
}
}).blur();
return $("[placeholder]").parents("form").submit(function() {
return $(this).find("[placeholder]").each(function() {
var input;
input = $(this);
if (input.val() === input.attr("placeholder")) {
return input.val("");
}
});
});
}
}
});
/*
* --------------------------------------------------------------------------------------------------------------------
* max length counter
* --------------------------------------------------------------------------------------------------------------------
*/
this.setMaxLength = function(selector) {
if (selector == null) {
selector = $(".char-max-length");
}
if (jQuery().maxlength) {
return selector.maxlength();
}
};
/*
* --------------------------------------------------------------------------------------------------------------------
* character counter
* --------------------------------------------------------------------------------------------------------------------
*/
this.setCharCounter = function(selector) {
if (selector == null) {
selector = $(".char-counter");
}
if (jQuery().charCount) {
return selector.charCount({
allowed: selector.data("char-allowed"),
warning: selector.data("char-warning"),
cssWarning: "text-warning",
cssExceeded: "text-error"
});
}
};
/*
* --------------------------------------------------------------------------------------------------------------------
* autosize feature for expanding textarea elements
* --------------------------------------------------------------------------------------------------------------------
*/
this.setAutoSize = function(selector) {
if (selector == null) {
selector = $(".autosize");
}
if (jQuery().autosize) {
return selector.autosize();
}
};
/*
* --------------------------------------------------------------------------------------------------------------------
* timeago feature converts static time to dynamically refreshed
* --------------------------------------------------------------------------------------------------------------------
*/
this.setTimeAgo = function(selector) {
if (selector == null) {
selector = $(".timeago");
}
if (jQuery().timeago) {
jQuery.timeago.settings.allowFuture = true;
jQuery.timeago.settings.refreshMillis = 60000;
selector.timeago();
return selector.addClass("in");
}
};
/*
* --------------------------------------------------------------------------------------------------------------------
* scrollable boxes
* --------------------------------------------------------------------------------------------------------------------
*/
this.setScrollable = function(selector) {
if (selector == null) {
selector = $(".scrollable");
}
if (jQuery().slimScroll) {
return selector.each(function(i, elem) {
return $(elem).slimScroll({
height: $(elem).data("scrollable-height"),
start: $(elem).data("scrollable-start") || "top"
});
});
}
};
/*
* --------------------------------------------------------------------------------------------------------------------
* jquery ui sortable
* --------------------------------------------------------------------------------------------------------------------
*/
this.setSortable = function(selector) {
if (selector == null) {
selector = null;
}
if (jQuery().sortable) {
if (selector) {
return selector.sortable({
axis: selector.data("sortable-axis"),
connectWith: selector.data("sortable-connect")
});
}
}
};
/*
* --------------------------------------------------------------------------------------------------------------------
* select 2 selects
* --------------------------------------------------------------------------------------------------------------------
*/
this.setSelect2 = function(selector) {
if (selector == null) {
selector = $(".select2");
}
if (jQuery().select2) {
return selector.each(function(i, elem) {
return $(elem).select2();
});
}
};
/*
* --------------------------------------------------------------------------------------------------------------------
* datatables
* --------------------------------------------------------------------------------------------------------------------
*/
this.setDataTable = function(selector) {
if (jQuery().dataTable) {
return selector.each(function(i, elem) {
var dt, sdom;
if ($(elem).data("pagination-top-bottom") === true) {
sdom = "<'row datatables-top'<'col-sm-6'l><'col-sm-6 text-right'pf>r>t<'row datatables-bottom'<'col-sm-6'i><'col-sm-6 text-right'p>>";
} else if ($(elem).data("pagination-top") === true) {
sdom = "<'row datatables-top'<'col-sm-6'l><'col-sm-6 text-right'pf>r>t<'row datatables-bottom'<'col-sm-6'i><'col-sm-6 text-right'>>";
} else {
sdom = "<'row datatables-top'<'col-sm-6'l><'col-sm-6 text-right'f>r>t<'row datatables-bottom'<'col-sm-6'i><'col-sm-6 text-right'p>>";
}
dt = $(elem).dataTable({
sDom: sdom,
sPaginationType: "bootstrap",
"iDisplayLength": $(elem).data("pagination-records") || 10,
oLanguage: {
sLengthMenu: "_MENU_ registros por página"
},
fnDrawCallback: function(oSettings) {
$(this).closest('.dataTables_wrapper').find('div[id$=_filter] input').css("width", "200px");
return $(this).closest('.dataTables_wrapper').find('div[id$=_filter] input').addClass("form-control input-sm").attr('placeholder', $(this).closest('.dataTables_wrapper').find('div[id$=_filter] label').text().replace(":", "..."));
}
});
if ($(elem).hasClass("data-table-column-filter")) {
return dt.columnFilter();
}
});
}
};
/*
* --------------------------------------------------------------------------------------------------------------------
* form validation
* --------------------------------------------------------------------------------------------------------------------
*/
this.setValidateForm = function(selector) {
if (selector == null) {
selector = $(".validate-form");
}
if (jQuery().validate) {
return selector.each(function(i, elem) {
return $(elem).validate({
errorElement: "span",
errorClass: "help-block has-error",
errorPlacement: function(e, t) {
return t.parents(".controls").first().append(e);
},
highlight: function(e) {
return $(e).closest('.form-group').removeClass("has-error has-success").addClass('has-error');
},
success: function(e) {
return e.closest(".form-group").removeClass("has-error");
}
});
});
}
};
}).call(this);
<link href="http://getbootstrap.com/dist/css/bootstrap.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="http://getbootstrap.com/dist/js/bootstrap.min.js"></script>
<html>
<head><title>titulo</title></head>
<body>
<div id="content">
<div id="main-nav"></div>
</div>
</body>
</html>