{% extends "base.html" %}
{% load i18n %}
{% load static %}
{% load template_filters %}
{% load template_tags%}

{% block title %}{% trans "oznameni.templates.oznameni.index_2.title" %}{% endblock %}

{% block head %}
  <script>
  var maxFiles = 40;
  var object_id = "{{ ident_cely }}";
  var addRemoveLinks = true;
  </script>
  <link rel="stylesheet" type="text/css" href="{% static 'css/dropzone.min.css' %}"/>
  <link rel="stylesheet" type="text/css" href="{% static 'css/bs-stepper.min.css' %}" />
{% endblock %}

{% block content %}

  {% include "oznameni/header.html" %}

  <div class="bs-stepper">
    <div class="bs-stepper-header">
      <div class="step">
        <button type="button" class="btn step-trigger" disabled="disabled">
          <span class="bs-stepper-circle">1</span>
          <span class="bs-stepper-label">{% trans "oznameni.templates.oznameni.index_2.stepper.vytvoreniOznameni" %}</span>
        </button>
      </div>
      <div class="line"></div>
      <div class="step active">
        <button type="button" class="btn step-trigger">
          <span class="bs-stepper-circle">2</span>
          <span class="bs-stepper-label">{% trans "oznameni.templates.oznameni.index_2.stepper.uploadProjDokumentace" %}</span>
        </button>
      </div>
      <div class="line"></div>
      <div class="step">
        <button type="button" class="btn step-trigger" disabled="disabled">
          <span class="bs-stepper-circle">3</span>
          <span class="bs-stepper-label">{% trans "oznameni.templates.oznameni.index_2.stepper.oznameno" %}</span>
        </button>
      </div>
    </div>
  </div>

  <table class="table table-sm table-striped table-hover mb-4">
    <tbody>
      <tr>
        <th scope="row">{% trans "oznameni.templates.oznameni.index_2.table.projekt" %}:</th>
        <td>{{ projekt.ident_cely }}</td>
      </tr>
      <tr>
        <th scope="row">{% trans "oznameni.templates.oznameni.index_2.table.ozanamovatel" %}:</th>
        <td>{{ projekt.oznamovatel.oznamovatel }}</td>
      </tr>
      <tr>
        <th scope="row">{% trans "oznameni.templates.oznameni.index_2.table.zastupceOznamovatele" %}:</th>
        <td>{{ projekt.oznamovatel.odpovedna_osoba }}</td>
      </tr>
      <tr>
        <th scope="row">{% trans "oznameni.templates.oznameni.index_2.table.adresa" %}:</th>
        <td>{{ projekt.oznamovatel.adresa }}</td>
      </tr>
      <tr>
        <th scope="row">{% trans "oznameni.templates.oznameni.index_2.table.telefon" %}:</th>
        <td>{{ projekt.oznamovatel.telefon }}</td>
      </tr>
      <tr>
        <th scope="row">{% trans "oznameni.templates.oznameni.index_2.table.email" %}:</th>
        <td>{{ projekt.oznamovatel.email }}</td>
      </tr>
      <tr>
        <th scope="row">{% trans "oznameni.templates.oznameni.index_2.table.katastralniUzemi" %}:</th>
        <td>{{ projekt.hlavni_katastr }}</td>
      </tr>
      <tr>
        <th scope="row">{% trans "oznameni.templates.oznameni.index_2.table.dalsiKatastry" %}:</th>
        <td>{{ projekt.katastry.all|katastry_to_list }}</td>
      </tr>
      <tr>
        <th scope="row">{% trans "oznameni.templates.oznameni.index_2.table.planovaneZahajeni" %}:</th>
        <td>{{ projekt.planovane_zahajeni|render_daterange }}</td>
      </tr>
      <tr>
        <th scope="row">{% trans "oznameni.templates.oznameni.index_2.table.podnet" %}:</th>
        <td>{{ projekt.podnet }}</td>
      </tr>
      <tr>
        <th scope="row">{% trans "oznameni.templates.oznameni.index_2.table.lokalizace" %}:</th>
        <td>{{ projekt.lokalizace }}</td>
      </tr>
      <tr>
        <th scope="row">{% trans "oznameni.templates.oznameni.index_2.table.parcelniCislo" %}:</th>
        <td>{{ projekt.parcelni_cislo }}</td>
      </tr>
      <tr>
        <th scope="row">{% trans "oznameni.templates.oznameni.index_2.table.oznaceniStavby" %}:</th>
        <td>{{ projekt.oznaceni_stavby }}</td>
      </tr>
    </tbody>
  </table>

  <form action="{% url 'core:post_upload' %}" class="dropzone mb-0" id="my-awesome-dropzone"
        enctype="multipart/form-data">
    {% csrf_token %}
    <div class="fallback">
      <input name="file" type="file" multiple/>
    </div>
  </form>
  <small class="form-text text-muted">{% trans "oznameni.templates.oznameni.index_2.file_upload.tooltip" %}</small>

  <form method="post">
    {% csrf_token %}
    <input name="ident_cely" type="hidden" value="{{ projekt.ident_cely }}">
    <a href="{% url 'oznameni:index' ident_cely=projekt.ident_cely %}" class="btn btn-secondary">{% trans "oznameni.templates.oznameni.index_2.upravitOznameni" %}</a>
    <button type="submit" class="btn btn-success btn-disable-when-running-upload" id="submit_btn">{% trans "oznameni.templates.oznameni.index_2.dokoncitOznameni" %}
      <span class="spinner-border spinner-border-sm" role="status" aria-hidden="true"
      style="display: none"></span>
    </button>
  </form>

{% endblock %}

{% block script %}
  <script src="{% static 'js/dropzone.min.js' %}"></script>
  <script>var object_id = "{{ projekt.ident_cely }}";</script>
  {% if file_id %}
        <script>var maxFiles = 1;</script>
        <script>var file_id = "{{ file_id }}";
          var typ_vazby = "{{ typ_vazby }}";
          var typ_uploadu = "nahradit";
        </script>
    {% else %}
        <script>var maxFiles = 40;</script>
        <script>
          var typ_vazby = "projekt";
          var typ_uploadu = "upload";
        </script>
    {% endif %}
  <script>
  var reject_dict = {
    "rejected_pas" : "{% get_message 'UPLOADFILE_REJECTED_PAS' %}",
    "rejected_dokument" : "{% get_message 'UPLOADFILE_REJECTED_DOKUMENT' %}",
    "rejected_dokument_model" : "{% get_message 'UPLOADFILE_REJECTED_DOKUMENT_MODEL' %}",
    "rejected_all" : "{% get_message 'UPLOADFILE_REJECTED_ALL' %}"
  };
  var upload_error = "{% get_message 'UPLOADFILE_ERROR' %}"
  const dz_trans = {
      descriptionUpload: '{% trans "core.templates.core.upload_file.dz.descriptionUpload" %}',
      descriptionNahradit: '{% trans "core.templates.core.upload_file.dz.descriptionNahradit" %}',
      cancelUpload: '{% trans "core.templates.core.upload_file.dz.cancelUpload" %}',
      cancelUploadConfirm: '{% trans "core.templates.core.upload_file.dz.cancelUploadConfirm" %}',
      removeFile: '{% trans "core.templates.core.upload_file.dz.removeFile" %}',
      alertsUploadSuccessfulPart1: '{% trans "core.templates.core.upload_file.dz.alertsUploadSuccessfulPart1" %}',
      alertsUploadSuccessfulPart2: '{% trans "core.templates.core.upload_file.dz.alertsUploadSuccessfulPart2" %}',
      alertsUploadRejectPart1: '{% trans "core.templates.core.upload_file.dz.alertsUploadRejectPart1" %}',
      alertsUploadRejectPart2: '{% trans "core.templates.core.upload_file.dz.alertsUploadRejectPart2" %}',
      alertsUploadErrorPart1: '{% trans "core.templates.core.upload_file.dz.alertsUploadErrorPart1" %}',
      alertsUploadErrorPart2: '{% trans "core.templates.core.upload_file.dz.alertsUploadErrorPart2" %}',
      fileTooBig: '{% trans "core.templates.core.upload_file.dz.fileTooBig" %}',
      maxFilesExceeded: '{% trans "core.templates.core.upload_file.dz.maxFilesExceeded" %}',
      alertsDeleteSuccessfulPart1: '{% trans "core.templates.core.upload_file.dz.alertsDeleteSuccessfulPart1" %}',
      alertsDeleteSuccessfulPart2: '{% trans "core.templates.core.upload_file.dz.alertsDeleteSuccessfulPart2" %}',
      alertsDeleteErrorPart1: '{% trans "core.templates.core.upload_file.dz.alertsDeleteErrorPart1" %}',
      alertsDeleteErrorPart2: '{% trans "core.templates.core.upload_file.dz.alertsDeleteErrorPart2" %}',
  }
  $(document).ready(function() {
    $('form').on('submit', function() {
        if (confirm('{% trans "oznameni.templates.oznameni.index_2.nahraliSteVsechnyDokumenty" %}')) {
          var submitButton = $(this).find('button[type=submit]');
          submitButton.prop('disabled', true); // Zablokuje tlačítko
          submitButton.find('.spinner-border').show(); // Zobrazí spinner
          $(".submit-remove").hide();
        }
        else return false;
    });
  });
  mock_str='{{seznam_mock|safe}}';
  </script>
  <script src="{% static 'js/dz.js' %}"></script>
{% endblock %}