{% extends "base.html" %}

{% block title %}Object Browser{% endblock %}
{% block footer %}
    <script type="text/javascript" xmlns="http://www.w3.org/1999/html">

    var currenttab = '#host';
    var currenttable = '#host-table';
    var BASE_URL = "{% url home %}";


    $(document).ready(function() {
        /* Default class modification */
        $.extend( $.fn.dataTableExt.oStdClasses, {
            "sSortAsc": "header headerSortDown",
            "sSortDesc": "header headerSortUp",
            "sSortable": "header"
        } );

        // Show service tab
        var anchor = document.location.href.split('#')[1];
        if (anchor == undefined) {
            anchor = 'host';
        }


        $('#objecttabs').find('a[href="#' + anchor + '-tab"]').tab('show');

        $('table#service-table').adagios_ob_configure_dataTable(
                [
                    { "sTitle": "Host" },
                    { "sTitle": "Name" },
                    { "sTitle": "Command" },
                    { "sTitle": "Shortname", "bVisible": false}
                ],
                [
                    {
                        "object_type": 'service',
                        "rows": [
                            { "cName": "host_name" },
                            {
                                "cName": "service_description",
                                "cAltName": "name",
                                "icon": "glyph-computer-service"
                            },
                            {
                                "cName": "check_command",
                                "truncate": 16
                            },
                            {
                                "cName": "shortname"
                            }

                        ]
                    },
                    {
                        "object_type": 'servicegroup',
                        "rows": [
                            { "cName": "host_name" },
                            {
                                "cName": "servicegroup_name",
                                "cAltName": "name",
                                "icon": "glyph-more-items"
                            },
                            { "cName": "check_command" },
                            { "cName": "shortname" }
                        ]
                    }

                ]
        );
        $('table#command-table').adagios_ob_configure_dataTable(
                [
                    { "sTitle": "Command Name" },
                    { "sTitle": "Command Line" }
                ],
                [
                    {
                        'object_type': 'command',
                        'rows': [
                            {
                                "cName": "command_name",
                                "icon": "glyph-computer-proces"
                            },
                            {
                                "cName": "command_line",
                                "truncate": 40
                            }
                        ]
                    }
                ]
        );

        $('table#contact-table').adagios_ob_configure_dataTable(
                [
                    { "sTitle": "Contact Name" },
                    { "sTitle": "Alias" },
                    { "sTitle": "E-Mail" }
                ],
                [
                    {
                        'object_type': 'contact',
                        'rows': [
                            {
                                "cName": "contact_name",
                                "cAltName": "name",
                                "icon": "glyph-woman"
                            },
                            { "cName": "alias" },
                            { "cName": "email" }
                        ]
                    },
                    {
                        'object_type': 'contactgroup',
                        'rows': [
                            {
                                "cName": "contactgroup_name",
                                "cAltName": "name",
                                "icon": "glyph-adress-book"
                            },
                            { "cName": "alias" },
                            { "cName": "email" }
                        ]
                    }
                ]
        );
        $('table#host-table').adagios_ob_configure_dataTable(
                [
                    { "sTitle": "Name" },
                    { "sTitle": "Address" },
                    { "sTitle": "Alias" }
                ],
                [
                    {
                        'object_type': 'host',
                        'rows': [
                            {
                                "cName": "host_name",
                                "cAltName": "name",
                                "icon": "glyph-computer-locked"
                            },
                            { "cName": "address" },
                            { "cName": "alias" }
                        ]
                    },
                    {
                        'object_type': 'hostgroup',
                        'rows': [
                            {
                                "cName": "hostgroup_name",
                                "cAltName": "name",
                                "icon": "glyph-more-items"
                            },
                            { "cName": "address" },
                            { "cName": "alias" }
                        ]
                    }
                ]
        );
        $('table#timeperiod-table').adagios_ob_configure_dataTable(
                [
                    { "sTitle": "Name" },
                    { "sTitle": "Alias" }
                ],
                [
                    {
                        'object_type': 'timeperiod',
                        'rows': [
                            {
                                "cName": "timeperiod_name",
                                "cAltName": "name",
                                "icon": "glyph-clock"
                            },
                            { "cName": "alias" }
                        ]
                    }
                ]
        );
        $('table#' + anchor + "-table").adagios_ob_render_dataTable();

        $(window).bind('resize', function() {
            $('table.objecttable.dataTable').ob_check_datatable_column_visibility();
        });
        $('a[data-toggle="tab"]').on('show', function (e) {
            var id = $(e.target).attr('href').split("-")[0];
            if ( ! $.fn.DataTable.fnIsDataTable($('table' + id + "-table")[0])) {
                console.log('Rendering datatable table' + id + "-table");
                $('table' + id + "-table").adagios_ob_render_dataTable();
            }
            return true;
        });
        $('a[data-toggle="tab"]').on('shown', function (e) {
            currenttab = $(e.target).attr('href');
            var id = $(e.target).attr('href').split("-")[0];
            currenttable = 'table' + id + "-table";
            document.location.hash = id;
            $('#log').append("Set current tab " + currenttable + '<br/>');
            // e.target // activated tab
            // e.relatedTarget // previous tab

            return true;
        });

        // Populate object statistics table
        populate_object_statistics_table();

    } );

    // This function will populate the object statistics table with statistics from all objects
    function populate_object_statistics_table() {
        adagios.rest.pynag.get_object_statistics()
                .done( function(data) {
                    var table=document.getElementById("objectoverview");
                    var object_type, total;
                    var row, cell1, cell2;
                    for (i=0;i<data.length;i++){
                        object_type = data[i].object_type;
                        total = data[i].total;

                        // Add a new row to our table
                        row = table.insertRow(i+1);
                        cell1 = row.insertCell(0);
                        cell2 = row.insertCell(1);

                        cell1.innerHTML = object_type;
                        cell2.innerHTML = total;
                    }
                    $("#objectoverview_loading").hide();

                });
    }

    </script>
{% endblock %}:
{% block content %}
    <div class="row-fluid">
        <div class="span12">
            <div class="block">
                <ul class="breadcrumb">
                    <li>
                        <a href="{% url home %}">Home</a> <span class="divider">/</span>
                    </li>
                </ul>
                <h2>
                    <i class="icon-th-large"></i> <small>Object</small> Browser
                </h2>

            </div>
        </div>
    </div>

        <div class="row-fluid">
            <div class="span9">
                <div id="objectbrowser" class="block">
                    <ul class="nav nav-tabs" id="objecttabs">
                        <li><a href="#host-tab" data-toggle="tab"><i class="glyph-computer-locked"></i> Hosts</a></li>
                        <li><a href="#service-tab" data-toggle="tab"><i class="glyph-computer-service"></i> Services</a></li>
                        <li><a href="#contact-tab" data-toggle="tab"><i class="icon-user"></i>Contacts</a></li>
                        <li><a href="#command-tab" data-toggle="tab"><i class="glyph-computer-proces"></i> Commands</a></li>
                        <li><a href="#timeperiod-tab" data-toggle="tab"><i class="glyph-clock"></i> Timeperiods</a></li>
                    </ul>
                    <div class="tab-content">
                        <div class="tab-pane" id="command-tab">
                            <div id="loading"><h3>Loading...</h3></div>
                            <table id="command-table" class="table table-striped objecttable">
                                <thead>
                                </thead>
                                <tbody>
                                </tbody>
                            </table>
                        </div>
                        <div class="tab-pane" id="contact-tab">
                            <div id="loading"><h3>Loading...</h3></div>
                            <table id="contact-table" class="table table-striped objecttable">
                                <thead>
                                </thead>
                                <tbody>
                                </tbody>
                            </table>
                        </div>
                        <div class="tab-pane" id="host-tab">
                            <div id="loading"><h3>Loading...</h3></div>
                            <table id="host-table" class="table table-striped objecttable">
                                <thead>
                                </thead>
                                <tbody>
                                </tbody>
                            </table>
                        </div>
                        <div class="tab-pane" id="service-tab">
                            <div id="loading"><h3>Loading...</h3></div>
                            <table id="service-table" class="table table-striped objecttable">
                                <thead>
                                </thead>
                                <tbody>
                                </tbody>
                            </table>
                        </div>
                        <div class="tab-pane" id="timeperiod-tab">
                            <div id="loading"><h3>Loading...</h3></div>
                            <table id="timeperiod-table" class="table table-striped objecttable">
                                <thead>
                                </thead>
                                <tbody>
                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>
            </div>

            <div class="span3">
                    <form name="bulk" action="{% url bulk_edit %}" method="post" class="hide">
                        {% csrf_token %}
                    </form>



                <div class="block">
                    <table class="table table-condensed" id="objectoverview">
                        <thead>
                        <tr>
                            <th>Object Statistics</th>
                            <th>#</th>
                        </tr>
                        </thead>
                        <tbody id="objectoverview_body">
                            <tr id="objectoverview_loading">
                            <td colspan=2><img src="{% url media path="select2/spinner.gif" %}"> Loading...</td>
                            </tr>
                       </tbody>
                    </table>

                </div>
                <div class="block hide" id="log" style="height: 150px;overflow: auto">

                </div>
            </div>

        </div>

{% endblock %}
