{% extends "ui/base-devices.html" %}

{% load url from future %}
{% load icons %}
{% load bob %}

{% block sidebar %}
<div class="well">
    <ul class="unstyled">
    {% for d in devices %}
        <li>{{ d|device_icon }}&nbsp;{{ d }}</li>
    {% endfor %}
    </ul>
</div>
{% endblock %}

{% block contentarea %}
<div class="row-fluid"><div class="span10">
{% if formset %}
<form class="form form-inline" action="" method="POST">
{% csrf_token %}
{{ formset.management_form }}
<table class="table table-striped table-bordered table-condensed">
    <thead><tr>
    {% if formset.prefix == 'step2' %}
        <th>Old Address</th>
        <th>New Network</th>
        <th width="24">Fill</th>
    {% else %}
        <th>Old Address</th>
        <th>New IP Address</th>
        <th>New Hostname</th>
    {% endif %}
    </tr></thead>
    <tbody>
        {% for form in formset %}
        <tr>
            {% for f in form.visible_fields %}
            <td class="control-group {{ f.css_classes }} {% if f.errors %}error{% endif %}" style="vertical-align:middle">
                {{ f }}
                {% for e in f.errors %}
                    <div class="help-block">{{ e }}</div>
                {% endfor %}
            </td>
            {% endfor %}
            {% if formset.prefix == 'step2' %}
            <td style="vertical-align:middle">
                <a
                    href="#"
                    class="btn"
                    data-fill-down="step2-{{ forloop.counter0 }}-network"
                >
                    {% icon 'fugue-arrow-curve-270' %}
                </a>
            </td>
            {% endif %}
        </tr>
        {% endfor %}
    </tbody>
</table>
<div class="form-actions">
    {% if operations %}
    {% spaceless %}
    <button
        type="submit" name="move"
        value="Move" class="btn btn-inverse"
    >{% icon 'fugue-flag-checker' %}&nbsp;Move</button>
    {% endspaceless %}
    {% else %}
    {% spaceless %}
    <button
        type="submit"
        value="Next" class="btn btn-primary"
    >{% icon 'fugue-tick' %}&nbsp;Next</button>
    {% endspaceless %}
    {% endif %}
</div>
</form>
{% endif %}
{% if form %}{% form form fugue_icons=1 submit_label="Next" %}{% endif %}
{% for kind, message in operations %}
<div class="alert alert-{{ kind }}">{{ message }}</div>
{% endfor %}
</div><div class="span2 template-tabs">
        {% tab_menu template_menu_items template_selected side='right' %}
    </div>
</div>
{% endblock %}

