<!doctype html>
<html lang="{{ localizer.locale }}"
      prefix="foaf: http://xmlns.com/foaf/0.1/ og: http://ogp.me/ns# rel: http://purl.org/vocab/relationship/">
<head>
    {% include 'head.html.j2' %}
    <link rel="manifest" href="{{ 'betty-static:///betty.webmanifest' | url }}">
</head>
<body>
<script>
    document.body.classList.add('with-js');
</script>
<div id="page">
    <nav id="nav-primary">
        <a id="site-title" href="{{ 'betty:///index.html' | url }}" title="{{ project.configuration.title | localize }}">{{ project.configuration.title | localize }}</a>
        <div id="search"
             data-betty-search-index="{{ 'betty:///search-index.json' | url }}">
            <div class="overlay-controls">
                <span class="overlay-control overlay-close" title="{% trans %}Exit the search{% endtrans %}">{% trans %}Exit the search{% endtrans %}</span>
            </div>
            <form>
                {% set search_keywords_example_person_name = project.ancestry['person'] | select('public') | map(attribute='name') | first | default(none) %}
                {% if search_keywords_example_person_name %}
                    {% set search_keywords_example -%}
                        {% filter forceescape %}
                            {% trans example = search_keywords_example_person_name.label | localize -%}
                                E.g. "{{ example }}"
                            {%- endtrans %}
                        {% endfilter %}
                    {%- endset %}
                {% endif %}
                <input id="search-query" type="search"{% if search_keywords_example is defined %} placeholder="{{ search_keywords_example }}"{% endif %}>
                <label for="search-query" title="Search">Search</label>
            </form>
            <section id="search-expanded">
                <h2 class="visually-hidden">Search</h2>
                <p id="search-instructions">
                    {% trans -%}
                        Use <kbd>↑</kbd> and <kbd>↓</kbd> to navigate results, or <kbd>esc</kbd> to exit the search.
                    {%- endtrans %}
                </p>
                <div id="search-results-twilight">
                    <div id="search-results-container"></div>
                </div>
            </section>
        </div>
        <div id="nav-sections" class="nav-primary-expandable">
            <h2 class="nav-primary-action">{% trans %}Menu{% endtrans %}</h2>
            <div class="nav-primary-expanded">
                <ul class="nav-secondary">
                    {% for entity_type_configuration in project.configuration.entity_types.values() | selectattr('generate_html_list') %}
                        {% set entity_type = project.entity_type_repository.get(entity_type_configuration.id) %}
                        <li>
                            <a href="{{ entity_type | url }}">
                                {% if entity_type.plugin_id() == 'event' %}
                                    {% trans %}Timeline{% endtrans %}
                                {% else %}
                                    {{ entity_type.plugin_label_plural() | localize }}
                                {% endif %}
                            </a>
                        </li>
                    {% endfor %}
                    {% for link in primary_navigation_links %}
                        <li>
                            <a href="{{ link.url | url }}">
                                {{ link.label | localize | html_lang }}
                            </a>
                        </li>
                    {% endfor %}
                </ul>
            </div>
        </div>
        {% if page_resource is defined and project.configuration.locales.multilingual %}
            <div id="nav-locale" class="nav-primary-expandable">
                <h2 class="nav-primary-action">{% trans %}Language{% endtrans %}</h2>
                <div class="nav-primary-expanded">
                    <ul class="nav-secondary">
                    {% set ns = namespace(available_locales=[]) %}
                    {% for available_locale_configuration in project.configuration.locales.values() %}
                        {% set available_locale_data = available_locale_configuration.alias | locale_get_data %}
                        {% do ns.available_locales.append((available_locale_configuration.locale, available_locale_data.get_display_name())) %}
                    {% endfor %}
                    {% for available_locale, available_locale_name in ns.available_locales | sort(attribute='1') %}
                        <li><a href="{{ page_resource | url(locale=available_locale) }}" hreflang="{{ available_locale }}" lang="{{ available_locale }}" rel="alternate">{{ available_locale_name }}</a></li>
                    {% endfor %}
                    </ul>
                </div>
            </div>
        {% endif %}
    </nav>
    <div id="content">
        {% if page_title is defined %}
            <h1>{{ page_title }}</h1>
        {% endif %}
        {% block page_content %}{% endblock %}
        {% if page_resource is has_links %}
            {% set links = page_resource.links | list %}
            {% set links = (links | select_localizeds(include_unspecified=true) | list + links | selectattr('locale', 'none') | list) | unique | list %}
            {% if links | length > 0 %}
                <section id="external-links">
                    <h2>
                        {% trans %}External links{% endtrans %}
                        {% with url = page_resource | url ~ '#external-links'%}
                            {% include 'permalink.html.j2' %}
                        {% endwith %}
                    </h2>
                    <ul>
                    {% for link in links %}
                        {% set link_url = link.url | url %}
                        <li>
                            <a href="{{ link_url }}"{% if link.locale is not none %} hreflang="{{ link.locale }}"{% endif %}{% if link.relationship is not none %} rel="{{ link.relationship }}"{% endif %}{% if link.media_type is not none %} type="{{ link.media_type }}"{% endif %}>{{ link.label | localize or link_url }}</a>
                            {% if link.description %}
                                <div class="meta">{{ link.description | localize }}</div>
                            {% endif %}
                        </li>
                    {% endfor %}
                    </ul>
                </section>
            {% endif %}
        {% endif %}
        {% include 'references.html.j2' %}
    </div>
    <footer>
        {% include 'footer.html.j2' %}
    </footer>
</div>
{% include 'linked-data.html.j2' %}
{% do 'cotton-candy' | webpack_entry_point_js %}
{% include 'webpack-entry-loader.html.j2' %}
{% include 'scripts.html.j2' %}
</body>
</html>
