{% extends "webpage/base.html" %}
{% load static %}
{% load transkribus_extras %}
{% block title %}Search{% endblock %}
{% block content %}
{% trp_lang as my_lang %}

    <div class="container">
        <div class="card transkribus_search-form">
            <div class="card-header" style="text-align: center">
                <h1>{{ my_lang.search_header.header }}</h1>
            </div>
            <div class="card body">
                <div class="row justify-content-center">
                    <div class="col-md-10 col-lg-8 col-xl-7 mx-auto">
                      <form method="get" action="{% url 'transkribus:trp_hits' %}">
                        <div class="form-row">
                          <div class="col-12 col-md-9 mb-2 mb-md-0">
                            <input type="search" class="form-control form-control-lg" placeholder="{{ my_lang.search_form.prefil}}" name="query">
                          </div>
                          <div class="col-12 col-md-3">
                            <button type="submit" class="btn btn-block btn-lg btn-primary transkibus_search-button">{{ my_lang.search_form.button }}</button>
                          </div>
                        </div>
                      </form>
                    </div>
                    <!--end of col-->
                </div>
            </div>
        </div>
        <div class="card transkribus_hits-container">
            <div class="card-header" style="text-align: center">
                {% if 'query' in request.GET %}
                    <h1>
                        {% if start != '0' %}
                            <a href="{{new_url}}&start={{ prev }}">{{ my_lang.hits.prev }} </a>
                        {% endif %}
                        {{ hits }} {{ my_lang.hits.hits }}
                        {% if next %}
                            <a href="{{new_url}}&start={{ next }}">{{ my_lang.hits.next }}</a>
                        {% endif %}
                    </h1>
                    {% if clear_filter %}
                        <h4>
                            <a href="{{ base_url }}">clear filter</a>
                        </h4>
                    {% endif %}
                {% endif %}
            </div>
            <div class="card body">
                <div class="row">
                    <div class="col-4">
                        <div class="card transkribus_facets-container">
                            <div class="card-header">
                                <h3>{{ my_lang.hits.facet_header }}</h3>
                            </div>
                            <div class="card-body">
                                {% for x in trp_result.facets.facet %}
                                    {% if x.facetMap.entry %}
                                        {% if x.facet_field == 'f_title' %}
                                            <h3>
                                                {{ my_lang.hits.facet_doc_title }}
                                            </h3>
                                            <ul class="transkribus_facets-list">
                                                {% for y in x.facetMap.entry %}
                                                    <li class="transkribus_facet">
                                                        <a class="transkribus_facet-field" href='{{ base_url }}&filter={{ x.facet_field }}:"{{y.key}}"'>{{ y.key }}</a><span class="transkribus_facet-field-separator">:</span> <span class="transkribus_facet-field-count">{{ y.value }}</span>
                                                    </li>
                                                {% endfor %}
                                            </ul>
                                        {% endif %}
                                    {% endif %}
                                {% endfor %}
                            </div>
                        </div>
                    </div>
                    <div class="col-8">
                        <div class="card transkribus_hits">
                            <div class="card-header">
                                <h3>{{ my_lang.hits.kwic_header }}</h3>
                            </div>
                            <div class="card-body">
                                {% for x in trp_result.pageHits.PageHit %}
                                    <div class="transkribus_hit">
                                        <p class="transkribus_kwic">{{ x.highlights|first|safe }}</p>
                                        <ul class="transkribus_hit-info">
                                            <li class="transkribus_hit-info-collection">
                                                <span class="transkribus_hit-info-label">{{ my_lang.hits.result_col }}</span><span class="transkribus_hit-info-separator">:</span> <span class="transkribus_hit-info-value">{{ x.collectionIds.collectionId|first}}</span>
                                            </li>
                                            <li class="transkribus_hit-info-doc">
                                                <span class="transkribus_hit-info-label">{{ my_lang.hits.result_doc }}</span><span class="transkribus_hit-info-separator">:</span> <span class="transkribus_hit-info-value">{{ x.docTitle }}</span>
                                            </li>
                                            <li class="transkribus_hit-info-doc-id">
                                              <span class="transkribus_hit-info-label">ID</span><span class="transkribus_hit-info-separator">:</span> <span class="transkribus_hit-info-value">{{ x.docId }}</span>
                                            </li>
                                            <li class="transkribus_hit-info-page">
                                                <span class="transkribus_hit-info-label">{{ my_lang.hits.result_page }}</span><span class="transkribus_hit-info-separator">:</span> <span class="transkribus_hit-info-value">{{ x.pageNr }}</span>
                                            </li>
                                            <li class="transkribus_hit-info-goto">
                                                <a href="{% url 'transkribus:trp_page' col_id=x.collectionIds.collectionId|first  doc_id=x.docId page_id=x.pageNr %}">{{ my_lang.hits.result_link }}</a>
                                            </li>
                                        </ul>
                                    </div>
                                {% endfor %}
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
{% endblock %}
