{% load i18n fobi_tags %}
<div class="page-header">
  <h1>{% trans "Edit form" %}</h1>
</div>

<div class="row">
  <div class="col-12 col-sm-12 col-lg-12">
      <!-- Nav tabs -->
      <ul class="nav nav-tabs" role="tablist">
          <li class="active"><a href="#tab-form-elemenets" role="tab" data-toggle="tab">{% trans "Elements" %}</a></li>
          <li><a href="#tab-form-handlers" role="tab" data-toggle="tab">{% trans "Handlers" %}</a></li>
          <li><a href="#tab-form-properties" role="tab" data-toggle="tab">{% trans "Properties" %}</a></li>
      </ul>

    <!-- Tab panes -->
    <div class="tab-content">

        <!-- Form element plugins -->
        <div class="tab-pane active" id="tab-form-elemenets">
            <div>
              <h2 id="form_elements">{% trans "Add elements to your form" %}</h2>
            </div>

            <div class="panel panel-default">
              <div class="panel-body">
                <ul class="nav pull-right">
                  <li class="dropdown">
                    <a class="dropdown-toggle" data-toggle="dropdown" href="javascript:;">
                      {% trans "Choose form element to add" %} <span class="caret"></span>
                    </a>
                    <ul class="dropdown-menu">
                    {% for group, plugins in user_form_element_plugins.items %}
                      {% if not forloop.first %}
                      <li class="divider"></li>
                      {% endif %}
                      <li class="dropdown-header">{{ group }}</li>
                      {% for form_element_uid, form_element_name in plugins %}
                      <li><a href="{% url 'fobi.add_form_element_entry' form_entry.pk form_element_uid %}">{{ form_element_name }}</a></li>
                      {% endfor %}
                    {% endfor %}
                    </ul>
                  </li>
                </ul>

                <form method="post" action="{{ request.path }}?active_tab=tab-form-elements" novalidate="novalidate" class="{% block form_elements_html_class %}form-horizontal{% endblock %}">
                  {% csrf_token %}
                  {% with assembled_form as form %}
                    {% include fobi_theme.form_edit_snippet_template_name %}
                  {% endwith %}

                  {{ form_element_entry_formset.management_form }}

                  {% comment %}
                  {% with form_element_entry_formset as form %}
                    {% include fobi_theme.form_edit_snippet_template_name %}
                  {% endwith %}
                  {% endcomment %}

                  <div class="{% block form_elements_button_outer_wrapper_html_class %}control-group{% endblock %}">
                    <div class="{% block form_elements_button_wrapper_html_class %}controls{% endblock %}">
                      <input type="submit" name="ordering" class="{% block form_elements_button_html_class %}btn btn-primary pull-right{% endblock %}" value="{% trans 'Save ordering' %}"/>
                    </div>
                  </div>
                </form>

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

        <!-- Form handler plugins -->
        <div class="tab-pane" id="tab-form-handlers">

            <div>
              <h2 id="form_handlers">{% trans "Add handlers to your form" %}</h2>
            </div>

            <div class="panel panel-default">
              <div class="panel-body">
                <ul class="nav pull-right">
                  <li class="dropdown">
                    <a class="dropdown-toggle" data-toggle="dropdown" href="javascript:;">
                      {% trans "Choose form handler to add" %} <span class="caret"></span>
                    </a>
                    <ul class="dropdown-menu">
                      {% for form_handler_uid, form_handler_name in user_form_handler_plugins %}
                      <li><a href="{% url 'fobi.add_form_handler_entry' form_entry.pk form_handler_uid %}">{{ form_handler_name }}</a></li>
                      {% endfor %}
                    </ul>
                  </li>
                </ul>

                <div class="clearfix"></div>

                {% if form_handlers %}
                <table class="table table-striped">
                  <thead>
                    <tr>
                      <th>{% trans "Handler" %}</th>
                      {#<th>{% trans "Settings" %}</th>#}
                      <th>{% trans "Actions" %}</th>
                    </tr>
                  </thead>
                  <tbody>
                  {% for form_handler in form_handlers %}
                    {% with form_handler.get_plugin as plugin %}
                      {% if plugin %}
                    <tr>
                      <td>{{ form_handler.plugin_name }}
                        {% if form_handler.plugin_data or plugin.plugin_data_repr %}
                        <a class="popover-link" href="javascript:;" data-toggle="popover" data-content="{% spaceless %}{{ plugin.plugin_data_repr|safe }}{% endspaceless %}" role="button">
                          <span class="badge" title="{% trans 'Info' %}">?</span>
                        </a>
                        {% endif %}
                      </td>
                      <td>
                        <ul class="list-inline">
                          {% if form_handler.plugin_data %}
                          <li><a href="{% url 'fobi.edit_form_handler_entry' form_handler.pk %}"><span class="glyphicon glyphicon-edit"></span> {% trans "Edit" %}</a></li>
                          {% endif %}
                          <li><a href="{% url 'fobi.delete_form_handler_entry' form_handler.pk %}"><span class="glyphicon glyphicon-remove"></span> {% trans "Delete" %}</a></li>
                          {% get_fobi_form_handler_plugin_custom_actions plugin form_entry as form_handler_plugin_custom_actions %}
                          {#% for action in plugin.get_custom_actions %#}
                          {% for action in form_handler_plugin_custom_actions %}
                          <li><a href="{{ action.0 }}"><span class="{{ action.2 }}"></span> {{ action.1 }}</a></li>
                          {% endfor %}
                        </ul>
                      </td>
                    </tr>
                      {% endif %}
                    {% endwith %}
                  {% endfor %}
                  </tbody>
                </table>
                {% endif %}
              </div>
            </div>
            
        </div>

        <!-- Form properties -->
        <div class="tab-pane" id="tab-form-properties">

            <div>
              <h2 id="form_properties">{% trans "Form properties" %}</h2>
            </div>
            <div class="panel panel-default">
              <div class="panel-body">

                <form method="post" action="{{ request.path }}?active_tab=tab-form-properties" enctype="multipart/form-data" class="{% block form_properties_html_class %}form-horizontal{% endblock %}">
                  {% csrf_token %}
                  {% include fobi_theme.form_properties_snippet_template_name %}

                  <div class="{% block form_properties_button_outer_wrapper_html_class %}control-group{% endblock %}">
                    <div class="{% block form_properties_button_wrapper_html_class %}controls{% endblock %}">
                      <input type="submit" class="{% block form_properties_button_html_class %}btn btn-primary pull-right{% endblock %}" value="{% trans 'Submit changes' %}"/>
                    </div>
                  </div>
                </form>

              </div>
            </div>

        </div>


    </div>

  </div>
    

  <div class="col-4 col-sm-4 col-lg-4">




  </div>

</div>