
{% extends "layout.html" %}
{% block content %}
<script type="text/javascript">
    $(function() {
        $('#main').puifieldset();
        {% for section_id, section in form.fields.iteritems() %}
            $('#{{ section_id }}').puifieldset({
                toggleable: true
            });
        {% endfor %}
    });
</script>
<fieldset id="main" class="brome-field">
    <legend>Brome configuration</legend>

    <form id="configurationForm" class="form form-configuration" method="POST" action="" role="form">
        {% for section_id, section in form.fields.iteritems() %}
            <fieldset id="{{ section_id }}" class="brome-field">
                <legend>{{ section_id|replace("_", " ") }}</legend>

                    <div class="container-fluid">
                    {% for field_id, field in section.iteritems() %}
                        {% if field['visible'] %}
                            <div class="row brome-field">
                                <label for="{{ section_id }}_{{ field_id  }}">{{ field['title'] }}:</label>
                                {% if field['type'] == 'input' %}
                                    <input class="form-control" id="{{ section_id }}_{{ field_id }}" name="{{ section_id }}_{{ field_id }}" type="text" value="{{ field['value'] }}"/>
                                {% elif field['type'] == 'password' %}
                                    <input class="form-control" id="{{ section_id }}_{{ field_id }}" name="{{ section_id }}_{{ field_id }}" type="password" value="{{ field['value'] }}"/>
                                {% elif field['type'] == 'number' %}
                                    <input class="form-control" id="{{ section_id }}_{{ field_id }}" name="{{ section_id }}_{{ field_id }}" type="number" value="{{ field['value'] }}"/>
                                {% elif field['type'] == 'checkbox' %}
                                    <input type="checkbox" id="{{ section_id }}_{{ field_id }}" name="{{ section_id }}_{{ field_id }}" {% if field['value'] %} checked {% endif %}/>
                                {% elif field['type'] == 'dropdown' %}
                                    <select id="{{ section_id }}_{{ field_id }}" name="{{ section_id }}_{{ field_id }}" class="form-control">
                                        {% for value in field['options'] %}
                                            <option value="{{ value }}" {% if value == field['value'] %} selected {% endif %}>{{ value }}</option>
                                        {% endfor %}
                                    </select>
                                {% endif %}
                            </div>
                        {% endif %}
                    {% endfor %}
                    </div>

            </fieldset>
        {% endfor %}
        <p><input class="btn btn-default btn-submit" type="submit" value="Save"></p>
    </form>
</fieldset>
{% endblock %}
