{% extends "layout.html" %}

{% block content_header %}
  {{ build_breadcrumbs(current_breadcrumbs + [
    { 'name': sound.name, 'link': url_for('.SoundFileView:list_files', tenant_uuid=sound.tenant_id, category=sound.id), 'icon': 'file-sound-o' }
  ]) }}
{% endblock %}

{% block content %}
  <section class="content">
    {% call build_list_containers(_('Sound Files'), 'file-sound-o') %}

      {% call build_table(id='table-list-sound-files') %}
        {% call build_list_table_headers() %}
          <th>{{ _('Name') }}</th>
          <th>{{ _('Infos') }}</th>
        {% endcall %}
        {% call(file_) build_list_table_rows(sound['files']) %}
          <td>
            {{ file_.name }}
          </td>
          <td>
            {% for format in file_.formats %}
              <div class="box">
                <a href="{{ url_for('.SoundFileView:delete_sound_filename',
                                    tenant_uuid=sound['tenant_uuid'],
                                    category=sound['name'],
                                    filename=file_.name,
                                    format=format['format'],
                                    language=format['language']) }}"
                   title="{{ _('Delete the sound file') }}"
                   class="btn btn-xs btn-default"
                   onclick="return confirm({{ _('Are you sure you want to delete this item ?') }});">
                  <i class="fa fa-fw fa-remove"></i>
                </a>
                <a href="{{ url_for('.SoundFileView:download_sound_filename',
                                    tenant_uuid=sound['tenant_uuid'],
                                    category=sound['name'],
                                    filename=file_.name,
                                    format=format['format'],
                                    language=format['language']) }}"
                        title="{{ _('Listen to the sound file') }}"
                        class="btn btn-xs btn-default">
                  <i class="fa fa-fw fa-volume-up"></i>
                </a>
                <strong>{{ _('Format') }}:</strong> {{ format['format'] if format['format'] else '-' }}
                <strong>{{ _('Language') }}:</strong> {{ format['language'] if format['language'] else '-' }}<br>
                <strong>{{ _('Text') }}:</strong> <small>{{ format['text'] if format['text'] else '-' }}</small>
              </div>
            {% endfor %}
          </td>
        {% endcall %}
      {% endcall %}

    {% endcall %}

    {% call build_hidden_add_containers(_('Add Sound file')) %}
        {% call build_form_box(_('Choose your file')) %}
          <form class="form-horizontal" method="POST" action="{{ url_for('.SoundFileView:upload_sound_filename', tenant_uuid=sound['tenant_uuid'], category=sound['name']) }}" data-toggle="validator" enctype="multipart/form-data">
            {% call add_default_fields(form=form, submit_value=_('Upload')) %}
              {{ render_field(form.name) }}
              {{ render_field(form.format) }}
              {{ render_field(form.language) }}
            {% endcall %}
          </form>
        {% endcall %}
      {% endcall %}
  </section>
{% endblock %}


{% block additional_js %}
  <script src="{{ url_for('.static', filename='js/sound.js') }}"></script>
{% endblock %}
