{% extends "base_status.html" %}

{% block title %}Network Parents{% endblock %}
{% block nav2 %}<a href="{% url status.views.network_parents %}">Network Parents</a>{% endblock %}
{% block smallheader %}{% endblock %}
{% block largeheader %}
Network Parents
{% endblock %}


{% block content %}
{% if hosts %}

    <table class="table table-condensed well" style="line-height:6px; font-size: 12px" >
    <tr>
        <th>
            <div class="btn-group" id="select_bar">
                <a class="" data-toggle="dropdown" href="#">
                    <input style="margin-left: -2px; padding: 0px;" type="checkbox">
                </a>
                <ul class="dropdown-menu">
                    <li><a href=""> All</a></li>
                    <li><a href=""> None</a></li>
                    <li><a href=""> Unhandled Problems</a></li>
                    <li><a href=""> All Problems</a></li>
                </ul>
            </div>
        </th>
        <th>Host Name</th>
        <th>Address</th>
        <th>Status</th>
        <th>Children</th>
        <th>Child Host Health</th>
    </tr>

    {% for row in hosts %}
        <tr onclick='$(".host_{{ forloop.counter }}").toggle();'>
            <td class=small >
                <a href="#">
                    <div class="host_{{ forloop.counter }}">&#x25b7;</div>
                    <div class="host_{{ forloop.counter }} hide">&#x25bd;</div>
                </a>
            </td>

            <td><a style="color: black" href="{% url status.views.status_detail %}?host_name={{ row.name }}">{{ row.name }}</a></td>

            <td>{{ row.address }}</td>
            {% if row.state  == 0 %}
                <td class="alert alert-success">UP</td>
            {% else %}
                <td class="alert alert-danger">Down</td>
            {% endif %}
            <td>
                {{ row.childs|length }}
            </td>
            <td>
                <div class="progress">
                    <div class="bar bar-success" style="width: {{ row.percent_ok }}%;"></div>
                    <div class="bar bar-warning" style="width: {{ row.percent_warn }}%;"></div>
                    <div class="bar bar-danger" style="width: {{ row.percent_crit }}%;"></div>
                    <div class="bar bar-unknown" style="width: {{ row.percent_unknown }}%;"></div>
                </div>
            </td>
        </tr>


        {% for i in row.child_hosts %}
            <tr style="background-color: #fafaff; font-size: 90%;" class="{{ row.name }} host_{{ forloop.parentloop.counter }} hide">
                <td colspan=7><div style="margin-left: 10px;" class="circle state_{{ i.state }}"></div> <a href="{% url status.views.status_detail  %}?host_name={{ i.name }}">{{ i.name }}</a></td>
            </tr>
        {% endfor %}

    {% endfor %}


{% else %}
    No Network parents found.
{% endif %}

{% endblock %}