{% extends 'base/base.html' %}
{% import 'input/form.html' as form with context %}
{% import 'input/field.html' as field with context %}
{% import 'input/textbox.html' as textbox with context %}

{% block body %}
<section class="section">

    <h1 class="title is-4">{% trans name=event.name %}{{name}} administration{% endtrans %}</h1>
    <div class="card">
        {% if event.image is defined %}
            <div class="card-image is-photo-thumbnail-container is-poster is-flex has-items-centered has-background-light">
                <img class='is-photo-thumbnail' src="{{event.image}}">
            </div>
        {% endif %}
        {% if event.description is defined %}
            <div class="card-content has-text-centered">
                <p>{{event.description}}</p>
            </div>
        {% endif %}
    </div>


    {% include 'event/counter.html' %}

    <div class="tab__container">
        <div class="tabs">
            <ul>
                <li class="tab__btn is-active" onclick='tab_select(this, "tab_guests", btn_clicked_cls="is-active")'><a>{% trans %}Invitees{% endtrans %}</a></li>
                <li class="tab__btn" onclick='tab_select(this,"tab_invitations", btn_clicked_cls="is-active")'><a>{% trans %}Invite people{% endtrans %}</a></li>
                <li class="tab__btn" onclick='tab_select(this,"tab_new_post", btn_clicked_cls="is-active")'><a>{% trans %}Write a blog post{% endtrans %}</a></li>
                <li class="tab__btn" onclick='tab_select(this,"tab_blog", btn_clicked_cls="is-active")'><a>{% trans %}Read event blog{% endtrans %}</a></li>
            </ul>
        </div>

        <div class="tab__page state_clicked" id="tab_guests">
            {% if invitees %}
                <table class="table is-fullwidth is-hoverable">
                    <thead>
                        <tr>
                            <th>{% trans %}name{% endtrans %}</th>
                            <th>{% trans %}coming?{% endtrans %}</th>
                            <th>{% trans %}guests{% endtrans %}</th>
                        </tr>
                    </thead>
                    <tbody>
                        {% for name, data in invitees.items() %}
                            <tr>
                                <td>{{name}}</td>
                                <td>{{data.attend|default('')}}</td>
                                {% if data.attend == 'no' %}
                                    <td>&nbsp;</td>
                                {% else %}
                                    <td>{{data.guests|default(0)}}</td>
                                {% endif %}
                            </tr>
                        {% endfor %}
                    </tbody>
                    <tfoot>
                        <tr class="is-selected">
                            <td colspan=2 class="table__total">{% trans %}total expected{% endtrans %}</td>
                            <td class="table__total_value">{{invitees_guests|default('0')}}</td>
                        </tr>
                    </tfoot>
                </table>
            {% else %}
                <p class="message--info">{% trans %}No invitee has answered yet{% endtrans %}</p>
            {% endif %}
        </div>


        <div class="tab__page" id="tab_invitations">
            {% call form.form(class="form--paper form__panel--vertical form__panel--center") %}
                {{ textbox.head(event_service, event_node, 'event') }}
                {{ field.meta('event_id', event_id) }}
                {{ field.textarea("jids",
                                  _("enter here a list of jid (one per line) to invite"),
                                  )
                                  }}
                {{ field.textarea("emails",
                                  _("enter here a list of emails addresses (one per line) to invite"),
                                  )
                                  }}
                {{ field.submit(_("Invite people")) }}
            {% endcall %}
        </div>

        <div class="tab__page" id="tab_new_post">
            {% call form.form(class="form--paper form__panel--vertical form__panel--center") %}
                {{ textbox.head(service, node, 'blog') }}
                {{ field.text("title",
                              _("title"),
                              class="form__field--big") }}
                {{ field.textarea("body",
                                  _("body"),
                                  )
                                  }}
                {{ field.text("language",
                              _("language"),
                              class="form__field--tiny") }}
                {{ field.checkbox("comments",
                                  _("allow comments"),
                                  checked=true) }}
                {{ field.submit(_("send"), class="mt-4") }}
            {% endcall %}
        </div>

        <div class="tab__page" id="tab_blog">
            {% if blog_items is defined %}
                {% include 'blog/articles.html' %}
            {% endif %}
        </div>

    </div>
</section>

{% endblock body %}