{% extends "common/base.j2" %}
{% block body_content %}
  <!--
      FIXME
      - some links are missing
      - most of the videos are loaded from git which is a bottleneck for performance.
      - Better selective loop over the dicts.
    -->

    <article class="container">
      <header>
        <h1>{{ _("Videos related to GNUnet") }}</h1>
      </header>
      <div class="row">
        <div class="col-lg-12">
          {% for item in videosdata %}
            <section>
              <header>
                <h2>{{ item['name']|e }} ({{ item['year'] }})</h2>
              </header>
              <div class="row container">
                <div class="col-md-5 col-12">
                  <video width="100%" height="100%" controls preload="none">
                    {% if item['sources'] %}
                      {% for video in item['sources'] %}
	                <source src="{{ video }}">
                      {% endfor %}
                    {% else %}
                      <!-- no video, empty tag because we have no placeholder -->
                      <source src="">
                    {% endif %}
                    Your web browser does not support the video tag.
                    {% if item['sources'] %}
                      Don&#39;t worry, you can download:
                      {% for video in item['sources'] %}
	                <a href="{{ video }}">source</a>
                        {% if not loop.last %}
                          ,
                        {% endif %}
                      {% endfor %}
                      or use
                      git clone https://git.gnunet.org/gnunet-videos-{{ item['year'] }}.git
                      and watch it in your favorite video player!
                    {% endif %}
                  </video>
                </div>
                <div class="col">
                  <p>
                    Name: {% if item['name'] %} {{ item['name']|e }} {% endif %}<br>
                    Authors:
                    {% if item['authors'] %}
                      {% for name in item['authors'] %}
                        {{ name|e }}
                        {% if not loop.last %}
                          ,
                        {% endif %}
                      {% endfor %}
                    {% endif %}<br>
                    Location: {% if item['location'] %} {{ item['location']|e }} {% endif %}<br>
                    Description: {% if item['description'] %} {{ item['description']|e }} {% endif %}<br>
                    Year: {% if item['year'] %}{{ item['year'] }}{% endif %}<br>
                    Slides:
                    {% if item['slides'] %}
                      {% for slide in item['slides'] %}
                        <a href="{{ slide }}">Slide {{ loop.index }}</a>
                        {% if not loop.last %}
                          ,
                        {% endif %}
                      {% endfor %}
                    {% endif %}<br>
                    Mirrors:
                    {% if item['mirror_sources'] %}
                      {% for mirror in item['mirror_sources'] %}
                        <a href="{{ mirror }}">Mirror Source {{ loop.index }}</a>
                        {% if not loop.last %}
                          ,
                          {% endif %}
                      {% endfor %}
                    {% endif %}<br>
                    {% if item['comment'] %} Comment: {{ item['comment']|e }} {% endif %}
                  </p>
                </div>
              </div>
            </section>
          {% endfor %}
        </div>
      </div>
    </article>
  {% endblock body_content %}