{% extends 'base.html' %}

{% block title %}{{ groupe.name }}{% endblock %}


{% block dialogs %}
<dialog id="create-groupe-album">
  <h2>{{ _("Add an album to group %(name)s", name=groupe.name) }}</h2>
  <form action="/groupe/{{ groupe.uuid }}/create-album" method="post">
      <input type="text" name="name" id="name" placeholder="{{ _('Name') }}" required><br/>
      <input type="submit" value="{{ _('Add') }}">
  </form>
  <a href="#!" class="close-dialog">Close</a>
</dialog>
<dialog id="delete">
  <h2>{{ _("Delete group") }}</h2>
  {{ _("Do you really want to delete this group and the albums it contains?") }}
  <br/><br/>
  <form method="post" action="/groupe/{{ groupe.uuid }}/delete">
    <input type="submit" style="background-color: var(--color-red);" value="{{ _('Delete') }}">
  </form>
  <a href="#!" class="close-dialog">Close</a>
</dialog>
{% set current_url = "/groupe/" + groupe.uuid %}
{% with share_link=config.BASE_URL+current_url, share_qrlink=current_url + "/qr" %}
  {% include 'components/share_dialog.html' %}
{% endwith %}
{% endblock %}

{% block content %}
<header id="album-header">
  <h2 id="groupe-title">{{ groupe.name }}</h2>
  <div id="header-actions">
    {% if g.user %}
      <section id="users">
      {% for groupe_user in groupe.users %}
        <div class="user-profile-picture" style="background-color:{{ groupe_user.color }};" title="{{ groupe_user.username }}">
        {{ groupe_user.username[0] | upper }}
        </div>
      {% endfor %}
      </section>
    {% endif %}
    <div class="dropdown dp1">
      +
      <div class="dropdown-content dp1">
      {% if not_participant %}
        <a href="/groupe/{{ groupe.uuid }}/join">{{ _("Join") }}</a>
      {% elif groupe.users | length > 1 and g.user %}
        <a href="/groupe/{{ groupe.uuid }}/quit">{{ _("Quit") }}</a>
      {% endif %}
      <a href="#share">{{ _("Share") }}</a>
      {% if g.user or not config["ZIP_REQUIRE_LOGIN"] %}
        <a href="/groupe/{{ groupe.uuid }}/zip">{{ _("Download as zip") }}</a>
      {% endif %}
      {% if g.user.access_level == 1 or (g.user and user.id in groupe.get_admins()) %}
        <a href="#create-groupe-album">{{ _("Add an album") }}</a>
        <a id="delete-album" href="#delete">{{ _("Delete") }}</a>
      {% endif %}
      </div>
    </div>
  </div>
</header>
<hr/>
{% if groupe.albums|length != 0 %}
<section id="albums-grid">
  {% for album in groupe.albums | reverse %}
  <a href="/groupe/{{ groupe.uuid }}/{{ album.uuid }}">
    <div class="album">
      {{ album.name }}
    </div>
  </a>
  {% endfor %}
</section>
{% else %}
<br/>
{% set create %}
  <a href="#create-groupe-album">{{ _("Create one") }}</a>
{% endset %}
<div id="albums-grid" style="display: inline;">
  {{ _("No available album. %(create)s", create=create) }}
</div>
{% endif %}
{% endblock %}