{% extends 'events/management/base.html' %}

{% from 'forms/_form.html' import form_header, form_row, form_footer  %}

{% block title %}{% trans %}Current videoconferences{% endtrans %}{% endblock %}
{% block content %}
    <div class="module-vc vc-management" id="vc-info-container">
        {% if plugins %}
            {% if event_vc_rooms %}
                {{ template_hook('before-vc-list', event=event) }}
                <table class="i-table-widget vc-room-management-table">
                    <thead>
                         <tr>
                            <th class="small-column"></th>
                            <th></th>
                            <th>{% trans %}Name{% endtrans %}</th>
                            <th></th>
                            <th class="col-50"></th>
                        </tr>
                    </thead>
                    <tbody>
                        {% for event_vc_room in event_vc_rooms|sort(attribute='vc_room.name') %}
                            {% set vc_room = event_vc_room.vc_room %}
                            <tr class="vc-room-entry {% if vc_room.status.name == 'deleted' %}deleted{% endif %}">
                                <td><a href="#" class="icon-next toggle-details"></a></td>
                                <td>
                                    {%- if vc_room.plugin %}
                                        <img src="{{ vc_room.plugin.logo_url }}"
                                             alt="{{ vc_room.plugin.friendly_name }}"
                                             title="{{ vc_room.plugin.friendly_name}}">
                                    {% else %}
                                        {{ vc_room.type }}
                                    {% endif -%}
                                </td>
                                <td>{{ vc_room.name }}</td>
                                <td>{{ template_hook('event-vc-room-list-item-labels', event=event, vc_room=vc_room, event_vc_room=event_vc_room) }}</td>
                                <td>
                                    <div class="toolbar vc-management-button-toolbar">
                                        <div class="ui mini icon buttons">
                                            {% if vc_room.status.name != 'deleted' %}
                                                <button class="ui button js-vcroom-refresh hide-if-locked"
                                                        title="{% trans %}Check videoconference status{% endtrans %}"
                                                        data-href="{{ url_for('.manage_vc_rooms_refresh', event_vc_room)}}">
                                                    <i class="icon refresh"></i>
                                                </button>
                                                <button class="ui button js-vcroom-edit hide-if-locked"
                                                        data-href="{{ url_for('.manage_vc_rooms_modify', event_vc_room) }}"
                                                        title="{% trans %}Edit{% endtrans %}"
                                                        data-title="{% trans %}Edit videoconference{% endtrans %}"
                                                        data-ajax-dialog
                                                        data-reload-after>
                                                    <i class="icon edit"></i>
                                                </button>
                                            {% endif %}
                                            <button data-href="{{ url_for('.manage_vc_rooms_remove', event_vc_room) }}"
                                                    data-num-events="{{ vc_room.events | count }}"
                                                    data-extra-msg="{{ vc_room.plugin.get_extra_delete_msg(vc_room, event_vc_room) if vc_room.plugin else '' }}"
                                                    class="ui negative button js-vcroom-remove hide-if-locked"
                                                    title="{% trans %}Detach{% endtrans %}">
                                                <i class="icon trash"></i>
                                            </button>
                                        </div>
                                        {% if vc_room.status.name != 'deleted' and vc_room.plugin %}
                                            {{ vc_room.plugin.render_buttons(vc_room, event_vc_room) | safe }}
                                        {% endif %}
                                    </div>
                                </td>
                            </tr>
                            <tr>
                                <td class="details-row" colspan="6">
                                    {% if vc_room.plugin %}
                                        {{ vc_room.plugin.render_manage_event_info_box(vc_room, event_vc_room, event) | safe }}
                                    {% endif %}
                                </td>
                            </tr>
                        {% endfor %}
                    </tbody>
                </table>
            {% else %}
                <div class="info-message-box">
                    <div class="message-text">{% trans %}No videoconferences have been added yet.{% endtrans %}</div>
                </div>
            {% endif %}
            <div class="add-room-options right hide-if-locked">
                {% if plugins|length == 1 %}
                    <button class="ui icon button js-create-room"
                            data-vc-system="{{ plugins[0].service_name }}"
                            data-href="{{ url_for('.manage_vc_rooms_create', event, service=plugins[0].service_name) }}"
                            data-title="{% trans plugin_name=plugins[0].friendly_name %}Create {{ plugin_name }} videoconference{% endtrans %}"
                            data-ajax-dialog
                            data-reload-after>
                        <img src="{{ plugins[0].icon_url }}" alt="{{ plugins[0].service_name }}">
                        {% trans plugin_name=plugins[0].friendly_name %}Create {{ plugin_name }} videoconference{% endtrans %}
                    </button>
                {% elif plugins|length > 1 %}
                    <button class="ui button js-create-room"
                            data-href="{{ url_for('.manage_vc_rooms_select', event, vc_room_action='.manage_vc_rooms_create', attach=False) }}"
                            data-title="{% trans %}Create videoconference{% endtrans %}"
                            data-ajax-dialog
                            data-reload-after>
                        <i class="icon plus"></i>
                        {%- trans %}Create new videoconference{% endtrans -%}
                    </button>
                {% endif %}
                <span>
                    <a href="#" id="btn-add-existing"
                       class="ui icon button"
                       {% if plugins|length == 1 %}
                           data-href="{{ url_for('.manage_vc_rooms_search_form', event, service=plugins[0].service_name) }}"
                           data-title="{% trans plugin_name=plugins[0].friendly_name %}Attach {{ plugin_name }} videoconference{% endtrans %}"
                       {% else %}
                           data-href="{{ url_for('.manage_vc_rooms_select', event, vc_room_action='.manage_vc_rooms_search_form', attach=True)}}"
                           data-title="{% trans %}Attach videoconference{% endtrans %}"
                       {% endif %}
                       data-ajax-dialog
                       data-reload-after>
                        <i class="icon plus"></i>
                        {% trans 'Videoconference' %}Add existing one{% endtrans %}
                    </a>
                </span>
            </div>
            <script>
                eventManageVCRooms();
            </script>
        {% else %}
            <div class="warning-message-box">
                <div class="message-text">
                    {% trans %}There are no Videoconference plugins available.{% endtrans %}
                </div>
            </div>
        {% endif %}
    </div>
{% endblock %}
