/**
 * Se encarga de hacer un innerHTML en el div "content" de los diferentes productos (items del manú)
 * Tambíen colorea los items del menú seleccionados.
**/
function innerContent(where, what, padre)
{
    $("#" + where).html($("#" + what).html());   

    $('ul li a').each(function() {
        $("ul li a.linkMenu").css("color", "#9e9e9e");
        $("div ul li span").css("color", "#9e9e9e");
    });
    $("#link_" + what).css("color", "#e37768");
    $("#" + padre).css("color", "#323333");

    /**
     * Marca el item seleccionado del Menu de la izquierda.(En la HOME)
    */
    $('ul li').each(function() {
        $("ul li").removeClass("active");
    });
    $("#li_" + what).addClass("active");
    
    /**
     * Marca el item seleccionado del Menu de la izquierda. (En Productos y Comercial)
    */
    $('#productos ul li').each(function() {
        $("ul li").removeClass("active");
    });
    $("#li_" + padre).addClass("active");
}

/**
 * Se utiliza cuando el usuario hace click en un producto DESDE la imágen del mismo, esto hace que se pueda hacer el
 * innerHTML y además manejar el colapso del menu.
**/
function viewProductFromImage(li_id, span_id)
{
    if ($("div.menu ul li#" + li_id).hasClass("expandable"))
    {
        $("#" + span_id).click();
    }

}
$(document).ready(function(){
    // third example
    $("#red").treeview({
            animated: "fast",
            collapsed: true,
            unique: true,
            persist: "cookie",
            toggle: function() {
                    window.console && console.log("%o was toggled", this);
            }
    });
});