{% extends 'webui/base.html' %}

{% block content %}
<div id="mymodal" class="modal fade">
    <div class="modal-dialog">
        <form action="/api/host/add" method="post">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close"
                            data-dismiss="modal"
                            aria-hidden="true">&times;</button>
                    <h4 class="modal-title">Add host</h4>
                </div>
                <div class="modal-body">
                    <table class="table">
                        {{ host_form.as_table }}
                    </table>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default"
                            data-dismiss="modal">Close
                    </button>
                    <input type="submit" class="btn btn-primary"
                           value="Save changes">
                    {% csrf_token %}
        </form>
    </div>
</div>
</div>
</div>
<div class="controls">
    <button class="btn btn-primary add-host" data-toggle="modal"
            data-target="#mymodal">Add host
    </button>
</div>
<div class="row">
    <div class="hosts col-md-7">
        <form class="hosts-form" action="/api/profile/apply" method="post">
            <table class="table">
                <thead>
                <tr>
                    <th>
                        <a href="#" class="check-all-hosts">
                            <span class="glyphicon glyphicon-ok"></span>
                        </a>
                    </th>
                    <th>Hostname</th>
                    <th>MAC</th>
                    <th>Status</th>
                    <th>Profile</th>
                </tr>
                </thead>
                <tbody>
                {% for host in hosts %}
                <tr class="{{ host.color }}">
                    <td>
                        <input type="checkbox" class="checkbox-host"
                               name="hosts[]" value="{{ host.pk }}"/>
                    </td>
                    <td>
                        <a href="/host/{{ host.hostname }}">{{ host.hostname }}</a>
                    </td>
                    <td>{{ host.mac }}</td>
                    <td>{{ host.status }}</td>
                    <td>{{ host.installations.all.0 }}</td>
                </tr>
                {% endfor %}
                </tbody>
                <tfoot>
                <tr>
                    <td colspan="5">
                        <select name="profile">
                            <option> ---</option>
                            {% for profile in profiles %}
                            <option value="{{ profile }}">{{ profile }}
                            </option>
                            {% endfor %}
                        </select>
                        <input type="submit" class="btn btn-xs btn-primary" value="Apply"/>
                        <input type="button" class="btn btn-xs btn-danger button-delete-hosts" value="Delete" />
                    </td>
                </tr>
                </tfoot>
            </table>
            {% csrf_token %}
        </form>
    </div>
    <div class="profiles col-md-3">
        <table class="table">
            <thead>
            <tr>
                <th>#</th>
                <th>Profile name</th>
            </tr>
            </thead>
            <tbody>
            {% for profile in profiles %}
            <tr>
                <td>
                    {{ forloop.counter }}
                </td>
                <td>
                    {{ profile }}
                </td>
                <td></td>
                <td></td>
            </tr>
            {% endfor %}
            </tbody>
        </table>
    </div>
</div>
</div>
{% endblock %}