{% extends 'events/display/conference/base.html' %}

{% from 'attachments/_attachments.html' import render_attachments %}

{% block content %}
    <div class="conferenceDetails" id="main-content" data-bypass-target="{% trans %}Skip to main content{% endtrans %}">
        <div itemprop="description" class="description js-mathjax editor-output">
            {{ event.description }}
        </div>

        <div class="infogrid">
            <h2>{% trans %}Conference information{% endtrans %}</h2>
            <div class="infoline date">
                <h3 class="icon icon-time">
                    <span>{% trans %}Date/Time{% endtrans %}</span>
                </h3>
                <div class="text">
                    <p>
                        <span class="label">{% trans %}Starts{% endtrans %}</span>
                        <time datetime="{{ event.start_dt_display.isoformat() }}">
                            {{ event.start_dt_display|format_datetime(timezone=event.display_tzinfo) }}
                        </time>
                    </p>
                    <p>
                        <span class="label">{% trans %}Ends{% endtrans %}</span>
                        <time datetime="{{ event.end_dt_display.isoformat() }}">
                            {{ event.end_dt_display|format_datetime(timezone=event.display_tzinfo) }}
                        </time>
                    </p>
                    <p>
                        {% set display_tz = event.display_tzinfo.zone %}
                        <span class="timezone-label">{% trans %}All times are in {{ display_tz }}{% endtrans %}</span>
                        <span class="timezone" aria-hidden="true">{{ display_tz }}</span>
                    </p>
                </div>
            </div>

            {% block location_info %}
                {% if event.has_location_info or event.address %}
                    <div class="infoline location">
                        <h3 class="icon icon-location">
                            <span>{% trans %}Location{% endtrans %}</span>
                        </h3>
                        <div class="text">
                            <div class="place">
                                {{ event.venue_name }}
                            </div>
                            {% if event.room_name %}
                                <div class="room">
                                    {{ event.room_name }}
                                </div>
                            {% endif %}

                            {% if event.address %}
                                <div class="address nohtml">{{ event.address }}</div>
                            {% endif %}

                            {% if event.map_url %}
                                <a href="{{ event.map_url }}" target="_blank" rel="noopener noreferrer">
                                    {% trans %}Go to map{% endtrans %}
                                </a>
                            {% endif %}
                        </div>
                    </div>
                {% endif %}
            {% endblock %}

            {% if event.person_links %}
                <div class="infoline chairs clear">
                    <h3 class="icon icon-user">
                        <span>{% trans %}Chairpersons{% endtrans %}</span>
                    </h3>
                    <ul class="chair_list text">
                        {% for link in event.person_links|sort(attribute='display_order_key') %}
                            <li>
                                {% if link.email %}
                                    {% if session.user %}
                                        <a href="mailto:{{ link.email }}">{{ link.full_name }}</a>
                                    {% else %}
                                        <a title="{% trans %}Log in to see their email address{% endtrans %}">
                                            {{ link.full_name }}
                                        </a>
                                    {% endif %}
                                {% else %}
                                    {{ link.full_name }}
                                {% endif %}
                            </li>
                        {% endfor %}
                    </ul>
                </div>
            {% endif %}

            {% set can_attach = event.can_manage_attachments(session.user) %}
            {% if can_attach or event.attached_items %}
                <div class="infoline material material-list">
                    <h3 class="icon icon-attachment">
                        <span>{% trans %}Materials{% endtrans %}</span>
                    </h3>
                    <div class="text attachments-box">
                        {{ render_attachments(event.attached_items, management=false) }}
                    </div>
                    {% if can_attach %}
                        <div>
                            <button class="i-button text-color subtle icon-edit hide-if-locked"
                                    title="{% trans %}Manage materials{% endtrans %}"
                                    data-locator="{{ event.locator|tojson|forceescape }}"
                                    data-reload-on-change
                                    data-attachment-editor></button>
                        </div>
                    {% endif %}
                </div>
            {% endif %}

            {% if event.additional_info %}
                <div class="infoline info">
                    <h3 class="icon icon-info">
                        <span>{% trans %}Extra information{% endtrans %}</span>
                    </h3>
                    <div class="text">
                        {{ event.additional_info|rich_markup }}
                    </div>
                </div>
            {% endif %}
        </div>
        {{ template_hook('conference-home-info', event=event) }}
    </div>

    <script>
        setupAttachmentTreeView();
    </script>
{% endblock %}