{% extends "rest_framework/base.html" %}
{% block content %}
    {{ block.super }}
    {% if "POST" in allowed_methods and raw_data_post_form %}
        <div style="display:none">
            <li id="file-import-nav-tab">
                <a id='file-import-tab' href="#file-import-form" data-toggle="tab">File import</a>
            </li>
            <div class="tab-pane" id="file-import-form">
                <form action="{% url 'api_file_import' %}"
                      enctype="multipart/form-data"
                      class="form-horizontal"
                      method="POST"
                      novalidate>
                    <fieldset>
                        {% csrf_token %}
                        <input type="hidden" name="request_url" value="{{ request.get_full_path }}" />
                        <div class="form-group">
                            <label for="file_formats" class="col-lg-2 col-sm-3 control-label">Accepted file formats</label>
                            <div class="col-lg-10 col-sm-9">
                                <div class="form-control-static">
                                    {% for parser in api_settings.DEFAULT_PARSER_CLASSES %}
                                        {% if parser.media_type != "multipart/form-data" %}
                                            {{ parser.media_type }}
                                            {% if not forloop.last %},{% endif %}
                                        {% endif %}
                                    {% endfor %}
                                </div>
                            </div>
                        </div>
                        <div class="form-group">
                            <label for="import_file" class="col-lg-2 col-sm-3 control-label">File to import</label>
                            <div class="col-lg-10 col-sm-9">
                                <input type="file"
                                       id="import_file"
                                       name="import_file"
                                       class="form-control-static"
                                       style="border: none;
                                              box-shadow: none;
                                              background-color: transparent">
                            </div>
                        </div>
                        <div class="form-actions">
                            <button class="btn btn-primary js-tooltip" title="Make a POST request on the {{ name }} resource">POST</button>
                        </div>
                    </fieldset>
                </form>
            </div>
        </div>
    {% endif %}
{% endblock %}
{% block script %}
    {{ block.super }}
    <script>
            $("ul.nav.nav-tabs.form-switcher").prepend($("#file-import-nav-tab"))
            $("div.well.tab-content").append($("#file-import-form"))
    </script>
{% endblock %}
