{% extends "base.html" %}

{% load i18n %}
{% load static %}
{% load crispy_forms_tags %}

{% block styles %}
    <!-- for autocomplete -->
    <link rel="stylesheet" type="text/css" href="//code.jquery.com/ui/1.12.1/themes/smoothness/jquery-ui.css">
    <!-- https://datatables.net/ -->
    <link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/v/bs4/dt-1.12.1/sc-2.0.3/datatables.min.css"/>
    <!--link rel="stylesheet" type="text/css" href="{% static 'entries/css/panels.css' %}"-->
    <link rel="stylesheet" type="text/css" href="{% static 'entries/css/entries.css' %}">
    <link rel="stylesheet" type="text/css" href="{% static 'common/css/role_colours.css' %}">
    <link rel="stylesheet" href="{% static 'entries/css/jquery-impromptu.min.css' %}" type="text/css" media="screen" charset="utf-8" />
{% endblock %}

{% block scripts %}
    <!-- https://www.cssscript.com/split-view/ -->
    <script src="{% static 'common/js/split.min.js' %}"></script>
    <!-- https://datatables.net/ -->
    <script type="text/javascript" src="https://cdn.datatables.net/v/bs4/dt-1.12.1/sc-2.0.3/datatables.min.js"></script>
    <script type="text/javascript" src="https://cdn.datatables.net/plug-ins/1.12.1/features/scrollResize/dataTables.scrollResize.min.js"></script>
    <script src="{% static 'common/js/csrf.js' %}"></script>
    <script src="{% static 'entries/js/forms.js' %}"></script>
    <script src="{% static 'entries/js/utils.js' %}"></script>
    <script src="{% static 'entries/js/entries.js' %}"></script>
{% endblock %}

{% block additional-nav-items %}
{% if request.user.is_authenticated %}
    <li class="nav-item mr-1"><a href="{% url 'entries:unification' %}" class="nav-link">{% trans "Unifikacja" %}</a></li>
    <li class="nav-item mr-1"><a
                            onclick='window.location.replace(window.currUnifiedFrameId ? "/pl/entries/hierarchy/?unified_frame_id="+window.currUnifiedFrameId : "/pl/entries/hierarchy")'
                            class="nav-link cursor-pointer">{% trans "Hierarchia" %}</a></li>

{% endif %}
<li class="nav-item dropdown mr-1">
    <a class="nav-link dropdown-toggle mr-1" href="#" id="nav-filters" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
        {% trans "Filtrowanie" %}
    </a>
    <div class="dropdown-menu mr-1" id="filters-visited-dropdown" aria-labelledby="nav-filters">
        <a href="#" class="dropdown-item mr-1 font-weight-bold text-dark text-uppercase" id="filter-button" data-toggle="modal" data-target="#entry-filters">
            {% trans "Hasła" %}
        </a>
        <a href="#" class="dropdown-item mr-1 font-weight-bold text-dark text-uppercase" id="filter-unified-frames-button" data-toggle="modal" data-target="#unified-frame-filters">
            {% trans "Ramy zunifikowane" %}
        </a>
    </div>
</li>
<li class="nav-item dropdown mr-1">
    <a class="nav-link dropdown-toggle mr-1" href="#" id="nav-filters-local" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
        {% trans "Filtrowanie lokalne" %}
    </a>
    <div class="dropdown-menu" id="filters-local-visited-dropdown" aria-labelledby="nav-filters-local">
        <a href="#" class="dropdown-item mr-1 font-weight-bold text-dark text-uppercase" id="filter-local-frames-button" data-toggle="modal" data-target="#frame-filters-local">
            {% trans "Ramy" %}
        </a>
        <a href="#" class="dropdown-item mr-1 font-weight-bold text-dark text-uppercase" id="filter-local-schemata-button" data-toggle="modal" data-target="#schema-filters-local">
            {% trans "Schematy" %}
        </a>
    </div>
</li>
<li class="nav-item dropdown mr-1">
    <a class="nav-link dropdown-toggle" href="#" id="nav-last" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
        {% trans "Ostatnio oglądane" %}
    </a>
    <div class="dropdown-menu" id="last-visited-dropdown" aria-labelledby="nav-last">
    {% for lemma, eid in request.session.last_visited|slice:":-1" %}
        <a class="dropdown-item font-weight-bold text-dark text-uppercase last-visited" data-entry="{{ eid }}" href="#">{{ lemma }}</a>
    {% endfor %}
    </div>
</li>
<li class="nav-item dropdown mr-1">
    <a class="nav-link dropdown-toggle" href="#" id="nav-options" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
        {% trans "Opcje" %}
    </a>
    <div class="dropdown-menu px-1" id="options-dropdown" aria-labelledby="nav-options">
        <div class="form-check custom-control custom-checkbox">
            <input type="checkbox" class="custom-control-input" id="show-realisation-descriptions"{% if request.session.show_reals_desc %} checked{% endif %}>
            <label class="custom-control-label" for="show-realisation-descriptions">
            {% trans "Wyświetlaj opisy realizacji" %} <span data-toggle="tooltip" data-placement="bottom" title="{% trans "Po wybraniu ramy wyświetlaj opisy jej realizacji składniowych. Opisy (dla całej realizacji i dla poszczególnych fraz) są wyświetlane wewnątrz schematów." %}"><img src="{% static 'common/img/info.svg' %}" alt="info" width="10" height="10"/></span>
            </label>
        </div>
        <div class="form-check custom-control custom-checkbox">
            <input type="checkbox" class="custom-control-input" id="show-linked-entries"{% if request.session.show_linked_entries %} checked{% endif %}>
            <label class="custom-control-label" for="show-linked-entries">
            {% trans "Wyświetlaj powiązane hasła" %} <span data-toggle="tooltip" data-placement="bottom" data-html="true" title="{% trans "Przy filtrowaniu haseł wyświetlaj, oprócz haseł spełniających kryteria filtrowania, hasła powiązane z nimi znaczeniowo (np. <i>podarować</i> – <i>podarunek</i> – <i>podarek</i>). Hasła powiązane niespełniające kryteriów filtrowania są wyróżnione jaśniejszym kolorem na liście oraz nie podlegają filtrowaniu schematów i ram (są zawsze wyświetlane w całości niezależnie od użytych filtrów dla schematów/ram)." %}"><img src="{% static 'common/img/info.svg' %}" alt="info" width="10" height="10"/></span>
            </label>
        </div>
    </div>
</li>
{% endblock %}

{% block content %}
{% endblock %}

{% block modals %}

<div class="modal fade" id="entry-filters" tabindex="-1" role="dialog" aria-labelledby="entry-filtersLabel" aria-hidden="true">
  <div class="modal-dialog modal-xl" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="entry-filtersLabel">{% trans "Filtrowanie haseł" %}</h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body text-dark">
        {% crispy entries_form %}
      </div>
    </div>
  </div>
</div>

<div class="modal fade" id="frame-filters-local" tabindex="-1" role="dialog" aria-labelledby="frame-filters-localLabel" aria-hidden="true">
  <div class="modal-dialog modal-xl" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="frame-filters-localLabel">{% trans "Filtrowanie ram" %}</h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body text-dark">
        {% crispy frames_form %}
      </div>
    </div>
  </div>
</div>

<div class="modal fade" id="unified-frame-filters" tabindex="-1" role="dialog" aria-labelledby="unified-frame-filtersLabel" aria-hidden="true">
    <div class="modal-dialog modal-xl" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="unified-frame-filtersLabel">{% trans "Filtrowanie zunifikowanych ram" %}</h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body text-dark">
                {% crispy unified_frames_form %}
            </div>
        </div>
    </div>
</div>

<div class="modal fade" id="schema-filters-local" tabindex="-1" role="dialog" aria-labelledby="schema-filters-localLabel" aria-hidden="true">
  <div class="modal-dialog modal-xl" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="schema-filters-localLabel">{% trans "Filtrowanie schematów" %}</h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body text-dark">
        {% crispy schemata_form %}
      </div>
    </div>
  </div>
</div>

{% endblock %}