{% extends 'layout.twig' %}

{% block title %}Ticket Queue: {{ queue.title }}{% endblock %}

{% block content %}
  <!-- queue content -->
  <div class="row">
    <div class="twelve columns">
      <div id="queue-header" class="row">
        <div class="columns twelve">
          <h1 class="queue-title">{{ queue.title }}</h1>
          <h4 class="queue-created">Created at: <span>{{ queue.formatCreatedAt() }}</span></h4>
          <h4 class="queue-updated">Last updated at:  <span>{{ queue.formatUpdatedAt() }}</span></h4>
        </div>
      </div>

      <div id="queue-description" class="row">
        <div class="columns twelve">
          {{ queue.render() | raw }}
        </div>
      </div>
    </div>
  </div>

  <hr>

  <!-- queue tickets -->
  <div class="row">
    <div class="twelve columns">
      <ul id="queue-list" class="row">
        <h3>Tickets in this queue:</h3>
        {% if queue.tickets | length > 0 %}
          {% for ticket in queue.tickets %}
            <li>
              <a href="{{ url_for('ticket.view', { ticket_id: ticket.id }) }}">{{ ticket.title }}</a>
            </li>
          {% endfor %}
        {% else %}
          <p>There are no tickets in this queue.</p>
        {% endif %}
      </ul>
    </div>
  </div>
{% endblock %}