{#- Public page of one event.

   Slot for features that build on events:
     events.detail.before_meta  called per event, hook(event), above the
                                meta row (room, time, speaker)
-#}
{% extends "public_base.html" %}

{% block title %}{{ event.title }} — {{ SPLENT_APP }}{% endblock %}

{% block hero %}
    {{ render_block('hero', eyebrow=_(event.kind), title=event.title, subtitle=event.summary) }}
{% endblock %}

{% block content %}
<article class="container section event-detail">
    {% for hook in get_template_hooks("events.detail.before_meta") %}
    {{ (hook(event) or "") | safe }}
    {% endfor %}
    {% if event.room or event.starts_at or event.speaker %}
    <ul class="event-meta">
        {% if event.room %}
        <li class="event-meta__item">
            <svg class="event-meta__icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
                <path d="M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z"/><circle cx="12" cy="10" r="3"/>
            </svg>
            <span class="event-meta__label">{{ _('Room') }}</span>
            <span class="event-meta__value">{{ event.room }}</span>
        </li>
        {% endif %}
        {% if event.starts_at %}
        <li class="event-meta__item">
            <svg class="event-meta__icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
                <circle cx="12" cy="12" r="9"/><path d="M12 7v5l3 2"/>
            </svg>
            <span class="event-meta__label">{{ _('When') }}</span>
            <span class="event-meta__value">{{ event.starts_at | datetimeformat(_('EEEE d MMMM, HH:mm')) }}</span>
        </li>
        {% endif %}
        {% if event.speaker %}
        <li class="event-meta__item">
            <svg class="event-meta__icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
                <path d="M12 2a3 3 0 0 0-3 3v6a3 3 0 0 0 6 0V5a3 3 0 0 0-3-3z"/><path d="M19 10v1a7 7 0 0 1-14 0v-1"/><path d="M12 18v4"/>
            </svg>
            <span class="event-meta__label">{{ _('Speaker') }}</span>
            {% if speaker_profile %}
            <a class="event-meta__value" href="{{ speaker_profile.public_url }}">{{ event.speaker }}</a>
            {% else %}
            <span class="event-meta__value">{{ event.speaker }}</span>
            {% endif %}
        </li>
        {% endif %}
    </ul>
    {% endif %}

    {#- The image and the link are addresses typed in the panel, so they go
        through safe_url, which leaves a javascript: or data: address
        stored before the form refused one pointing nowhere. -#}
    {% if event.image %}
    <img class="event-detail__image" src="{{ event.image | safe_url }}" alt="">
    {% endif %}

    {# The description is stored HTML, so it goes through rich_text, which
        keeps the formatting and drops scripts, handlers and unsafe links. #}
    <div class="prose">{{ event.description | rich_text }}</div>

    {% if event.link %}
    <p class="event-detail__actions"><a class="btn btn-primary" href="{{ event.link | safe_url }}">{{ _('More info') }}</a></p>
    {% endif %}

    <p><a class="event-detail__back" href="{{ url_for('events.index') }}">← {{ _('Back to events') }}</a></p>
</article>
{% endblock %}