{% load i18n %}
{% load compress %}
{% load staticfiles %}
{% load core_tags %}

{% compress css %}
<link rel="stylesheet" type="text/x-scss" href="{% static 'core/css/upload_form.scss' %}" />
{% endcompress %}

<form class="upload-form" action="{% url import_url_name filetype %}" method="POST" enctype="multipart/form-data">
    {% csrf_token %}
    <div class="upload-form-field pull-left">
        <input type="file" name="uploaded_file" accept=".xml" />
        <p>{% trans "Select xml file" %}</p>
    </div>

    <button type="submit" name="submit-btn" class="btn btn-primary">{% trans "Upload" %}</button>
</form>

<script>
    $(document).ready(function() {
        $('button[name="submit-btn"]').prop('disabled', true)
        $('form input').change(function() {
            if (this.files[0] == null) {
                $('form p').text('{% trans "Select xml file" %}')
                $('button[name="submit-btn"]').prop('disabled', true)
            } else {
                $('form p').text(this.files[0].name);
                $('button[name="submit-btn"]').prop('disabled', false)
            }
        });
    });
</script>
