{% extends "tesm_core/base.html" %}
{% from "tesm_core/macros.html" import field, empty_state, alert, pill, modal %}

{% block page_title %}Dateifreigaben{% endblock %}
{% block page_sub %}{{ mounts | length }} eingebundene Freigabe(n){% endblock %}

{% block topbar_extra %}
  {% if current_user.has('fileshare.edit') %}
    <a class="btn btn--sm" href="{{ url_for('fileshare.mappings') }}">
      {{ icon('settings', size=15) }} Zuordnungen
    </a>
  {% endif %}
{% endblock %}

{% block content %}
{% if not mounts %}
  {{ empty_state('Keine Freigaben eingebunden',
     'Einbindungen entstehen nach einer Anmeldung gegen den Verzeichnisdienst und richten sich
     nach Ihrer Gruppenmitgliedschaft.', 'folder') }}
{% else %}
  {% if error %}{{ alert(error, 'danger') }}{% endif %}

  <div class="tabs">
    {% for mount in mounts %}
      <a class="tab {{ 'is-active' if mount.token == token else '' }}"
         href="{{ url_for('fileshare.browse', freigabe=mount.token) }}">{{ mount.label }}</a>
    {% endfor %}
  </div>

  {% if listing %}
    {% set current = (mounts | selectattr('token', 'equalto', token) | list | first) %}
    <section class="card">
      <div class="card__header">
        <div class="flex-1">
          <nav class="breadcrumb">
            <span><a href="{{ url_for('fileshare.browse', freigabe=token) }}">{{ current.label }}</a></span>
            {% for crumb in listing.breadcrumb %}
              <span><a href="{{ url_for('fileshare.browse', freigabe=token, pfad=crumb.relative) }}">{{ crumb.name }}</a></span>
            {% endfor %}
          </nav>
          <div class="card__sub mono fs-xs">{{ current.unc }}</div>
        </div>
        <span class="fs-xs faint">
          Einbindung endet <span data-relative-time="{{ current.expires_at }}">{{ current.expires_at | dt }}</span>
        </span>
        {% if current_user.has('fileshare.create') %}
          <button class="btn btn--sm" type="button" data-dialog-open="folder-new">
            {{ icon('plus', size=14) }} Ordner
          </button>
        {% endif %}
      </div>

      <form method="post" action="{{ url_for('fileshare.delete', token=token) }}" id="entries-form">
        <input type="hidden" name="{{ csrf_field_name }}" value="{{ csrf_token() }}">
        <input type="hidden" name="parent" value="{{ listing.relative }}">
        <div class="table-wrap">
          <table class="table table--compact">
            <thead>
              <tr>
                {% if current_user.has('fileshare.delete') %}<th style="width:40px"></th>{% endif %}
                <th>Name</th>
                <th class="numeric">Groesse</th>
                <th>Geaendert</th>
                <th class="actions">Aktion</th>
              </tr>
            </thead>
            <tbody>
              {% if listing.breadcrumb %}
                <tr>
                  {% if current_user.has('fileshare.delete') %}<td></td>{% endif %}
                  <td colspan="4">
                    <a href="{{ url_for('fileshare.browse', freigabe=token,
                       pfad=(listing.breadcrumb[-2].relative if listing.breadcrumb | length > 1 else '')) }}">
                      {{ icon('chevron-right', size=14) }} eine Ebene hoeher
                    </a>
                  </td>
                </tr>
              {% endif %}
              {% for entry in listing.directories %}
                <tr>
                  {% if current_user.has('fileshare.delete') %}
                    <td><label class="check"><input type="checkbox" name="pfade" value="{{ entry.relative }}"><span class="sr-only">auswaehlen</span></label></td>
                  {% endif %}
                  <td>
                    {{ icon('folder', size=15) }}
                    <a href="{{ url_for('fileshare.browse', freigabe=token, pfad=entry.relative) }}">{{ entry.name }}</a>
                  </td>
                  <td class="numeric faint">&ndash;</td>
                  <td class="fs-sm">{{ entry.modified | dt }}</td>
                  <td class="actions"></td>
                </tr>
              {% endfor %}
              {% for entry in listing.files %}
                <tr>
                  {% if current_user.has('fileshare.delete') %}
                    <td><label class="check"><input type="checkbox" name="pfade" value="{{ entry.relative }}"><span class="sr-only">auswaehlen</span></label></td>
                  {% endif %}
                  <td>{{ icon('file-text', size=15) }} {{ entry.name }}</td>
                  <td class="numeric fs-sm">{{ entry.size | bytes }}</td>
                  <td class="fs-sm">{{ entry.modified | dt }}</td>
                  <td class="actions">
                    {% if entry.previewable %}
                      <a class="btn btn--sm btn--ghost" target="_blank" rel="noopener"
                         href="{{ url_for('fileshare.preview', token=token, pfad=entry.relative) }}"
                         aria-label="Vorschau">{{ icon('eye', size=15) }}</a>
                    {% endif %}
                    <a class="btn btn--sm btn--ghost"
                       href="{{ url_for('fileshare.download', token=token, pfad=entry.relative) }}"
                       aria-label="Herunterladen">{{ icon('download', size=15) }}</a>
                  </td>
                </tr>
              {% endfor %}
            </tbody>
          </table>
        </div>
        {% if not listing.directories and not listing.files %}
          {{ empty_state('Leeres Verzeichnis', '', 'folder') }}
        {% endif %}
        {% if current_user.has('fileshare.delete') %}
          <div class="card__footer">
            <button class="btn btn--sm btn--ghost danger-text" type="submit"
                    data-confirm="Die ausgewaehlten Eintraege endgueltig loeschen? Auf einer Netzwerkfreigabe gibt es keinen Papierkorb."
                    data-confirm-title="Loeschen" data-confirm-ok="Loeschen">
              Ausgewaehlte loeschen
            </button>
          </div>
        {% endif %}
      </form>
    </section>

    {% if current_user.has('fileshare.create') %}
      <section class="card">
        <div class="card__header">
          <div class="flex-1">
            <div class="card__title">{{ icon('upload', size=17) }} Dateien hochladen</div>
            <div class="card__sub">nach {{ listing.relative or 'Wurzelverzeichnis' }} &middot; max. {{ max_upload_mb }} MB je Datei</div>
          </div>
        </div>
        <form method="post" enctype="multipart/form-data" data-no-guard
              action="{{ url_for('fileshare.upload', token=token) }}">
          <input type="hidden" name="{{ csrf_field_name }}" value="{{ csrf_token() }}">
          <input type="hidden" name="pfad" value="{{ listing.relative }}">
          <div class="card__body row">
            <input class="input" type="file" name="files" multiple required style="flex:1">
            <button class="btn btn--primary" type="submit" data-busy-label="Laedt ...">Hochladen</button>
          </div>
        </form>
      </section>
    {% endif %}
  {% endif %}
{% endif %}
{% endblock %}

{% block dialogs %}
{% if listing and current_user.has('fileshare.create') %}
  {% call modal('folder-new', 'Ordner anlegen', listing.relative or 'Wurzelverzeichnis', 'narrow') %}
    <form method="post" action="{{ url_for('fileshare.make_directory', token=token) }}">
      <input type="hidden" name="{{ csrf_field_name }}" value="{{ csrf_token() }}">
      <input type="hidden" name="pfad" value="{{ listing.relative }}">
      <div class="modal__body">{{ field('name', 'Name', required=True) }}</div>
      <div class="modal__footer">
        <button class="btn" type="button" data-dialog-close>Abbrechen</button>
        <button class="btn btn--primary" type="submit">Anlegen</button>
      </div>
    </form>
  {% endcall %}
{% endif %}
{% endblock %}