{% extends "base.html" %}

{% load i18n %}
{% load tags %}
{% load staticfiles %}

{% block title %}{{ item }} – {{ block.super }}{% endblock %}

{% block header %}
    <link type="text/css" rel="stylesheet" media="all" href="{% static 'styles/agenda.css' %}" />
    <link rel="stylesheet" href="{% static 'styles/jquery-ui/jquery-ui.custom.min.css' %}" />
{% endblock %}

{% block javascript %}
    <script type="text/javascript" src="{% static 'javascript/jquery-ui.custom.min.js' %}"></script>
    <script type="text/javascript" src="{% static 'javascript/agenda.js' %}"></script>
{% endblock %}

{% block content %}
<h1>
    {{ item }}
    <small class="pull-right">
    <a href="{% url 'item_overview' %}" class="btn btn-mini"><i class="icon-chevron-left"></i> {% trans "Back to overview" %}</a>
    {% if perms.projector.can_manage_projector %}
        <a href="{{ item|absolute_url:'projector' }}"
            class="activate_link btn btn-mini {% if item.is_active_slide and active_type != 'list_of_speakers' %}btn-primary{% endif %}"
            rel="tooltip" data-original-title="{% trans 'Show item' %}">
            <i class="icon icon-facetime-video {% if item.is_active_slide and active_type != 'list_of_speakers' %}icon-white{% endif %}"></i>
        </a>
    {% endif %}
    {% if perms.agenda.can_manage_agenda %}
    <div class="btn-group">
        <a data-toggle="dropdown" href="#" class="btn btn-mini dropdown-toggle">
            {% trans 'More actions' %}
            <span class="caret"></span>
        </a>
        <ul class="dropdown-menu pull-right">
            <li><a href="{{ item|absolute_url:'update' }}"><i class="icon-pencil"></i> {% trans 'Edit item' %}</a></li>
            <li><a href="{{ item|absolute_url:'delete' }}"><i class="icon-remove"></i> {% trans 'Delete item' %}</a></li>
        </ul>
    {% endif %}
    </div>
    </small>
</h1>
<p>
    {% if not item.content_object %}
        {{ item.text|safe }}
    {% else %}
        <a href="{{ item.content_object|absolute_url }}" class="btn btn-small">{% trans item.content_type.name %}: {{ item.content_object }}</a>
    {% endif %}
</p>

{% if perms.agenda.can_manage_agenda %}
    {% if item.comment %}
        <h3>{% trans "Comment" %}</h3>
        <p>{{ item.comment|linebreaks }}</p>
    {% endif %}
{% endif %}

{# List of Speakers #}
<h3>{% trans "List of speakers" %} {% if item.speaker_list_closed %}<span class="label label-important">{% trans 'closed' %}</span>{% endif %}</h3>
<p>
{% if perms.agenda.can_manage_agenda %}
    {% if item.speaker_list_closed %}
        <a href="{% url 'agenda_speaker_reopen' item.pk %}" class="btn btn-mini btn-danger">{% trans 'Open list' %}</a>
    {% else %}
        <a href="{% url 'agenda_speaker_close' item.pk %}" class="btn btn-mini btn-danger">{% trans 'Close list' %}</a>
    {% endif %}
{% endif %}
{% if perms.projector.can_manage_projector %}
    <a href="{{ item|absolute_url:'projector_list_of_speakers' }}"
        class="activate_link btn btn-mini {% if item.is_active_slide and active_type == 'list_of_speakers' %}btn-primary{% endif %}"
        rel="tooltip" data-original-title="{% trans 'Show list of speakers' %}">
        <i class="icon icon-bell {% if item.is_active_slide and active_type == 'list_of_speakers' %}icon-white{% endif %}"></i>
        {% trans 'Show list' %}
    </a>
{% endif %}
</p>

{% if perms.agenda.can_manage_agenda %}
    <form id="coming_speakers_changed_form" action="{% url 'agenda_speaker_change_order' item.pk %}" method="post" style="display:none" class="alert alert-warning">{% csrf_token %}
        <button type="button" class="close" data-dismiss="alert">×</button>
        {% trans "Do you want to save the changed order of speakers?" %}<br>
        <input id="sort_order" name="sort_order" type="hidden"></hidden>
        <button class="btn btn-mini" type="submit">{% trans 'Yes' %}</button>
        <a href="{% url 'item_view' item.pk %}" class="btn btn-mini">{% trans 'No' %}</a>
    </form>
{% endif %}

<div id="complete_list_of_speakers" class="well">
    {% for speaker_dict in list_of_speakers %}
        {% if speaker_dict.first_in_group %}
            {% if speaker_dict.type == 'old_speaker' %}
                <b>{% trans "Last speakers" %}:</b>
                <div class="btn-group" data-toggle="buttons-checkbox">
                    <button type="button" class="btn btn-mini" data-toggle="collapse" data-target="#old_speakers">
                        {% trans "Show all speakers" %}
                    </button>
                </div>
            {% elif speaker_dict.type == 'actual_speaker' %}
                <b>{% trans 'Current speaker' %}:</b>
            {% else %}
                <b>{% trans "Next speakers" %}:</b>
            {% endif %}
            <ul
                {% if speaker_dict.type == 'old_speaker' %}
                    id="old_speakers" class="collapse out"
                {% elif speaker_dict.type == 'coming_speaker' %}
                    id="coming_speakers"
                {% endif %}
            >
        {% endif %}
        <li id="speaker_{{ speaker_dict.speaker.pk }}">
            {% if speaker_dict.type == 'coming_speaker' %}
                <span {% if perms.agenda.can_manage_agenda %}class="ui-icon ui-icon-arrowthick-2-n-s"{% endif %}></span>
                {{ speaker_dict.prefix }}.
            {% else %}
                <small class="grey">[{{ speaker_dict.speaker.begin_time }}{% if speaker_dict.type == 'old_speaker' %} – {{ speaker_dict.speaker.end_time }}{% endif %}]</small>
            {% endif %}
            <a href="{{ speaker_dict.speaker|absolute_url }}">{{ speaker_dict.speaker }}</a>
            {% if perms.agenda.can_manage_agenda %}
                {% if speaker_dict.type == 'actual_speaker' %}
                    <a href="{% url 'agenda_speaker_end_speach' item.pk %}" class="btn btn-mini btn-danger"><i class="icon-bell icon-white"></i> {% trans 'End speach' %}</a>
                {% elif speaker_dict.type == 'coming_speaker' %}
                    <a href="{% url 'agenda_speaker_speak' item.pk speaker_dict.speaker.person.person_id %}"
                    class="btn btn-mini"><i class="icon-bell"></i> {% trans "Begin speach" %}</a>
                {% endif %}
                <a href="{{ speaker_dict.speaker|absolute_url:'delete' }}"
                    rel="tooltip" data-original-title="{% trans 'Delete' %}" class="btn btn-mini">
                    <i class="icon-remove"></i>
                </a>
            {% endif %}
        </li>
        {% if speaker_dict.last_in_group %}
            </ul>
        {% endif %}
    {% endfor %}

    <p>
        {% if is_on_the_list_of_speakers %}
            <a href="{% url 'agenda_speaker_delete' object.id %}" class="btn"><i class="icon icon-speaker"></i> {% trans "Remove me from the list" %}</a>
        {% elif not object.speaker_list_closed and perms.agenda.can_be_speaker %}
            <a href="{% url 'agenda_speaker_append' object.id %}" class="btn"><i class="icon icon-speaker"></i> {% trans "Put me on the list" %}</a>
        {% endif %}
    </p>

    {% if perms.agenda.can_manage_agenda %}
        <form action="" method="post">{% csrf_token %}
            {% for field in form %}
                <label>{{ field.label }}:</label>
                <div class="control-group input-append {% if field.errors %}error{% endif %}">
                    {{ field }}
                    <button class="btn btn-primary tooltip-bottom" type="submit" data-original-title="{% trans 'Apply' %}"><i class="icon-ok icon-white"></i></button>
                {% if perms.participant.can_see_participant and perms.participant.can_manage_participant %}
                    <a href="{% url 'user_new' %}" class="btn" rel="tooltip" data-original-title="{% trans 'Add new participant' %}"><i class="icon-add-user"></i></a>
                {% endif %}
                {% if field.errors %}
                    <span class="help-inline">{{ field.errors }}</span>
                {% endif %}
                </div>
            {% endfor %}
        </form>
    {% endif %}
</div>

{% endblock %}
