{% extends "layouts/default.twig" %}

{% block title %}{{ title }}{% endblock %}

{% block header %}
    <a href="{{ base_url() }}" class="btn btn-outline-light mb-3"><< Назад</a>
    <h2>{{ name }}</h2>
    {% if (encoding.alert) %}
        <div class="alert alert-warning small" role="alert">
            Кодировка исходного плейлиста отличается от UTF-8.
            Он был автоматически с конвертирован из {{ encoding.name }}, чтобы отобразить здесь список каналов.
            Однако названия каналов могут отображаться некорректно, причём не только здесь, но и в плеере.
        </div>
    {% endif %}
{% endblock %}

{% block content %}
    <div class="row">
        <div class="col-md-8">
            <h4>О плейлисте</h4>
            <table class="table table-dark table-hover small">
                <tbody>
                <tr>
                    <td class="w-25">ID</td>
                    <td>
                        {{ id }}&nbsp;{% if status == 'online' %}
                        <span class="badge small text-dark bg-success">online</span>
                    {% elseif status == 'offline' %}
                        <span class="badge small text-dark bg-danger">offline</span>
                    {% elseif status == 'timeout' %}
                        <span class="badge small text-dark bg-warning">timeout</span>
                    {% elseif status == 'error' %}
                        <span class="badge small text-dark bg-danger">error</span>
                        {% endif %}
                    </td>
                </tr>
                <tr>
                    <td>Описание</td>
                    <td><p>{{ desc }}</p></td>
                </tr>
                <tr>
                    <td title="Нажми на ссылку, чтобы скопировать её в буфер обмена"><b>Ccылка для ТВ</b></td>
                    <td><b onclick="prompt('Скопируй адрес плейлиста', '{{ url }}')"
                           data-bs-toggle="tooltip"
                           data-bs-placement="top"
                           title="Нажми на ссылку, чтобы скопировать её в буфер обмена"
                           class="font-monospace cursor-pointer">{{ url }}</b></td>
                </tr>
                <tr>
                    <td>M3U</td>
                    <td>{{ pls }}</td>
                </tr>
                <tr>
                    <td>Источник</td>
                    <td>{{ src }}</td>
                </tr>
                </tbody>
            </table>
        </div>
        <div class="col-md-4">
            <h4>Список каналов ({{ count }})</h4>
            <div class="overflow-auto" style="max-height: 350px;">
                <table class="table table-dark table-hover small">
                    <tbody>
                    {% for channel in channels %}
                        <tr>
                            <td>{{ loop.index }}</td>
                            <td>{{ channel }}</td>
                        </tr>
                    {% endfor %}
                    </tbody>
                </table>
            </div>
        </div>
    </div>
{% endblock %}