{% extends "upload/layer_upload_base.html" %}
{% load i18n %}
{% load staticfiles %}

{% block title %}{{ block.super }} {% trans "Upload Layer" %}{% endblock %}
{% block page-title %}
  {% trans "Upload Layer" %}
  <div class="btn-group pull-right">
    <a class="btn btn-primary btn-icon" href="{% url "layer_browse" %}">
      <i class="fa fa-align-justify" title="Explore Layers"></i>
    </a>
    <a class="btn btn-primary" href="{% url "layer_browse" %}">
      {% trans "Explore Layers" %}
    </a>
  </div>
{% endblock %}

{% block body_class %}layers{% endblock %}

{% block head %}

{{ block.super }}
{% endblock %}

{% block body_outer %}
  <script language="javascript">
    var json_mosaics = [
          {% for mosaic in mosaics %}
            {
                "name" : "{{mosaic.name}}",
                "workspace" : "{{mosaic.workspace}}",
                "is_mosaic" : "{{mosaic.is_mosaic}}",
                "has_time" : "{{mosaic.has_time}}",
                "has_elevation" : "{{mosaic.has_elevation}}",
                "time_regex" : "{{mosaic.time_regex}}",
                "elevation_regex" : "{{mosaic.elevation_regex}}"
            },
          {% endfor %}
    ]
  </script>
<div class="row">
  <div class="col-md-8">
    {% if incomplete %}
    <section class="widget" id="incomplete-download-list">
      <h3>{% trans "Incomplete Uploads" %}</h3>
      <p>{% trans "You have the following incomplete uploads" %}:</p>
      {% for u in incomplete %}
      <div class="clearfix uip" id="incomplete-{{ u.import_id }}">
        <div class="pull-left">{{ u.name }}, {% trans "last updated on" %} {{ u.date }}</div>
        <div class="upload_actions pull-right">
          <a class="btn btn-mini" href="#" id="resume-{{ u.import_id }}">{% trans "Resume" %}</a>
          <a class="btn btn-mini" href="#" id="delete-{{ u.import_id }}"><i class="icon-trash"></i> {% trans "Delete" %}</a>
        </div>
      </div>
      {% endfor %}
    </section>
    <div id="confirm-delete" class="hidden alert alert-warning">
      {% trans "Are you sure you want to delete this upload?" %}
      <a href="#y" class="btn btn-danger">{% trans "Delete" %}</a>
      <a href="#n" class="btn btn-default">{% trans "Cancel" %}</a>
      <a href="#yy">{% trans "Delete, and don't ask me again." %}</a>
    </div>
    {% endif %}

    {% block additional_info %}{% endblock %}

    {% if errors %}
    <div id="errors" class="alert alert-danger">
      {% for error in errors %}
      <p>{{ error }}</p>
      {% endfor %}
    </div>
    {% endif %}

    <div id="upload-status"></div>

    <section id="drop-zone">
      <h3><i class="fa fa-cloud-upload"></i><br />{% trans "Drop files here" %}</h3>
    </section>

    <p>{% trans " or select them one by one:" %}</p>

    <form id="file-uploader" method="post" enctype="multipart/form-data">
      <!-- UI change to hide the list of previously uploaded files from the user -->
      <input type="file" id="file-input" style="display: none;" multiple>
      <input class="btn btn-default" type="button" value="Choose Files" onclick="document.getElementById('file-input').click();">
    </form>

    <section class="widget">
      <ul id="global-errors"></ul>
      <h4>{% trans "Files to be uploaded" %}</h4>
      <div id="file-queue"></div>
      <div class="checkbox" style="display:none;" id="metadata_uploaded_preserve_check">
          Preserve Metadata XML <input type="checkbox" name="metadata_uploaded_preserve" id="id_metadata_uploaded_preserve"/>
      </div>
    </section>

    <section class="charset">
      <p>{% trans "Select the charset or leave default" %}</p>
      <select id="charset">
        {% for charset in charsets %}
        {% if charset.0 == 'UTF-8' %}
        <option selected='selected' value={{ charset.0 }}>{{ charset.1 }}</option>
        {% else %}
        <option value={{ charset.0 }}>{{ charset.1 }}</option>
        {% endif %}
        {% endfor %}
      </select>
    </section>

    <section>
      <a href="{% url "layer_upload" %}" id="clear-button" class="btn btn-default">{% trans "Clear" %}</a>
      <a href="#" id="upload-button" class="btn btn-danger">{% trans "Upload files" %}</a>
    </section>
  </div>

  {% if GEONODE_SECURITY_ENABLED %}
  <div class="col-md-4">
    <h3>{% trans "Permissions"  %}</h3>
    <form id="permission_form">
      {% include "_permissions.html" %}
    </form>
  </div>
  {% endif %}
</div>
{% endblock %}


{% block extra_script %}
<script data-main="{% static 'geonode/js/upload/main' %}"
  src="{% static 'lib/js/require.js' %}">
</script>
<script type="text/javascript">
{% autoescape off %}

  csrf_token =  "{{ csrf_token }}",
  form_target = "{{ UPLOADER_URL }}",
  geogig_enabled = {{ GEOGIG_ENABLED|lower  }},
  time_enabled = {{ TIME_ENABLED|lower  }},
  mosaic_enabled = {{ MOSAIC_ENABLED|lower  }},
  userLookup = "{% url "geonode.views.ajax_lookup" %}"

{% endautoescape %}

</script>
{% if GEONODE_SECURITY_ENABLED %}
{% with resource=layer %}
{% include "_permissions_form_js.html" %}
{% endwith %}
{% endif %}
{% endblock extra_script %}