{% extends "pages/_content_index.jinja" %}

{% block head_title %}{{ l10n("search.head.title", "projects", user_lang) }}{% endblock %}
{% block head_description %}{{ l10n("search.head.title", "projects", user_lang) }}{% endblock %}

{% block header_title %}
    <i class="fad fa-briefcase t-size-16 mr-s t-muted"></i>{{ l10n("header.root", "projects", user_lang) }}<span class="mobile-hide">
    <span class="mx-s t-size-15">❱</span>{{ l10n("header.search", "projects", user_lang) }}</span>
{% endblock %}

{% block content_filters %}
    <details class="border bkgd-dark r-m mb-s">
        <summary class="p-xs t-noselect">{{ l10n("filters.summary", "content", user_lang) }}</summary>
        <div class="p-xs bt bkgd-grey rb-m">

            {% for linked_tag in get_tools_linked_tags(requested_tags) %}
                <span class="mr-s t-size-10">
                    <a href="{{ l10n_url_abs('/tools/?tags=' + linked_tag, raw_lang) }}">#{{ linked_tag }}</a>
                    (+)
                </span>
            {% endfor %}

            <hr class="subtle hide-if-last hide-if-first">

            {% for unlinked_tag in get_tools_unlinked_tags(requested_tags) %}
                <span class="mr-s">
                    <a href="{{ l10n_url_abs('/tools/?tags=' + unlinked_tag, raw_lang) }}">#{{ unlinked_tag }}</a>
                    (+)
                </span>
            {% endfor %}

        </div>
    </details>
{% endblock %}

{% block content_listing %}

    {% for tool_data in get_sorted_tools_by_tags(requested_tags) %}
        <hr class="subtle hide-if-first">

        <!--<div class="p-s border r-m">-->
        <div class="p-xs r-m">
            <a href="{{ l10n_url_abs('/tools/' + tool_data.id, raw_lang) }}" class="a-hidden">
                <div class="content-search-entry">
                    <img class="content-search-image mr-s r-l"
                         src="{{ url_for("static", filename=tool_data.metadata.index.image_url) }}"
                         alt="TODO">
                    <h3 class="mb-xs">
                        {{ l10n(tool_data.metadata.index.title_key, tool_data.id, user_lang) }}
                    </h3>
                    <p>{{ l10n(tool_data.metadata.index.preamble_key, tool_data.id, user_lang) }}</p>
                </div>
            </a>

            <p class="mt-xs">
                <i class="fad fa-tags t-size-8"></i>
                {% for tool_tag in tool_data.metadata.general.tags %}
                    <a href="{{ l10n_url_abs('/tools/?tags=' + tool_tag, raw_lang) }}" class="ml-xs">#{{ tool_tag }}</a>
                {% endfor %}
            </p>
        </div>

    {% endfor %}
{% endblock %}

{% block extra_scripts %}
    <script src="{{ url_for("static", filename="resources/NibblePoker/js/nibblepoker-default.min.js") }}"></script>
{% endblock %}