Большое обновление и рефакторинг

- улучшен и нарощен парсинг плейлистов
- упрощена конфигурация
- название плейлиста в заголовке страницы подробностей
- fuzzy-поиск каналов на странице подробностей
- эскизы логотипов на странице подробностей
- бейдж статуса плейлиста на главной теперь перед названием
- удалены laravel-завивимости
- какие-нибудь мелочи, которые забыл упомянуть

src/views/details.twig

@@ -1,39 +1,49 @@
 {% extends "template.twig" %}
 
-{% block title %}{{ title }}{% endblock %}
+{% block title %}{{ name }} - {{ config('app.title') }}{% endblock %}
+
+{% block head %}
+    <style>.tvg-logo-background{max-width:100px;max-height:100px;background:white;padding:2px;border-radius:5px}</style>
+{% endblock %}
 
 {% block header %}
-    <h2>{{ name }}</h2>
-    {% if (encoding.alert) %}
+    <h2>О плейлисте {{ name }}</h2>
+    {% if (content.encoding.alert) %}
         <div class="alert alert-warning small" role="alert">
             Кодировка исходного плейлиста отличается от UTF-8.
-            Он был автоматически с конвертирован из {{ encoding.name }}, чтобы отобразить здесь список каналов.
+            Он был автоматически с конвертирован из {{ content.encoding.name }}, чтобы отобразить здесь список каналов.
             Однако названия каналов могут отображаться некорректно, причём не только здесь, но и в плеере.
         </div>
     {% endif %}
-    {% if (error) %}
+    {% if (status.errCode > 0) %}
         <div class="alert alert-danger small" role="alert">
-            Ошибка плейлиста: [{{ error.code }}] {{ error.message }}
+            Ошибка плейлиста: [{{ status.errCode }}] {{ status.errText }}
         </div>
     {% endif %}
 {% endblock %}
 
+{% block footer %}
+    <script src="{{ base_url('js/list.min.js') }}"></script>
+    <script>
+        var list = new List('chlist',{valueNames:['chname','chindex']});
+    </script>
+{% endblock %}
+
 {% block content %}
     <div class="row">
-        <div class="col-md-8">
-            <h4>О плейлисте</h4>
+        <div class="col-md-6">
             <table class="table table-dark table-hover small">
                 <tbody>
                 <tr>
                     <td class="w-25">ID</td>
                     <td>
-                        <code>{{ id }}</code>&nbsp;{% if status == 'online' %}
+                        <code>{{ id }}</code>&nbsp;{% if status.possibleStatus == 'online' %}
                         <span class="badge small text-dark bg-success">online</span>
-                    {% elseif status == 'offline' %}
+                    {% elseif status.possibleStatus == 'offline' %}
                         <span class="badge small text-dark bg-danger">offline</span>
-                    {% elseif status == 'timeout' %}
+                    {% elseif status.possibleStatus == 'timeout' %}
                         <span class="badge small text-dark bg-warning">timeout</span>
-                    {% elseif status == 'error' %}
+                    {% elseif status.possibleStatus == 'error' %}
                         <span class="badge small text-dark bg-danger">error</span>
                         {% endif %}
                     </td>
@@ -61,20 +71,31 @@
                 </tbody>
             </table>
         </div>
-        <div class="col-md-4">
-            <h4>Список каналов ({{ count ?? 0 }})</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 class="col-md-6">
+            <h4>Список каналов ({{ content.channelCount ?? 0 }})</h4>
+            {% if (content.channelCount > 0) %}
+            <div id="chlist">
+                <input type="text" class="form-control form-control-sm bg-dark text-light mb-2 fuzzy-search" placeholder="Поиск...">
+                <div class="overflow-auto" style="max-height:550px">
+                    <table class="table table-dark table-hover small">
+                        <tbody class="list">
+                        {% for channel in content.channels %}
+                            <tr class="chrow">
+                                <td class="p-1" class="chindex">{{ loop.index }}</td>
+                                <td class="p-1">
+                                    {% if (channel.attributes['tvg-logo']) %}
+                                        <img class="tvg-logo-background" src="{{ channel.attributes['tvg-logo'] }}" />
+                                    {% endif %}
+                                </td>
+                                <td class="p-1 chname">{{ channel.name }}</td>
+                            </tr>
+                        {% endfor %}
+                        </tbody>
+                    </table>
+                </div>
             </div>
+            {% endif %}
         </div>
     </div>
 {% endblock %}

src/views/list.twig

@@ -26,14 +26,13 @@
                     <strong>{{ id }}</strong>
                 </td>
                 <td class="info">
-                    <strong>{{ playlist.name }}</strong>
                     <span class="badge small bg-secondary text-dark status">loading</span>
+                    <strong>{{ playlist.name }}</strong>
                     <div class="small mt-2">
                         {% if playlist.desc|length > 0 %}
                             <p class="my-1 d-none d-lg-block">{{ playlist.desc }}</p>
                         {% endif %}
-                        <a href="{{ base_url(id ~ '/details') }}">Подробнее...</a>
-{#                        <a class="btn btn-sm btn-outline-light" href="{{ base_url(id ~ '/details') }}">Подробнее...</a>#}
+                        <a href="{{ base_url(id ~ '/details') }}" class="text-light">Подробнее...</a>
                     </div>
                 </td>
                 <td class="text-center count">
@@ -87,9 +86,9 @@
                 if (xhr.readyState === XMLHttpRequest.DONE) {
                     console.log('[' + id + '] DONE', xhr.response)
                     el_status.classList.remove('bg-secondary')
-                    el_status.innerText = xhr.response.status
-                    el_count.innerText = xhr.response?.count ?? 0
-                    switch (xhr.response.status) {
+                    el_status.innerText = xhr.response.status.possibleStatus
+                    el_count.innerText = xhr.response?.content.channelCount ?? 0
+                    switch (xhr.response.status.possibleStatus) {
                         case 'online':
                             el_status.classList.add('bg-success')
                             break

src/views/notfound.twig

@@ -10,7 +10,7 @@
             <p>
                 Плейлист {{ id }} не найден
             </p>
-            <a class="navbar-brand" href="{{ base_url() }}" title="На главную">
+            <a class="btn btn-outline-light" href="{{ base_url() }}" title="На главную">
                 Перейти к списку
             </a>
         </div>

src/views/template.twig

@@ -1,7 +1,7 @@
 <!DOCTYPE html>
 <html lang="ru">
 <head>
-    <title>{{ config('app.title') }}</title>
+    <title>{% block title %}{{ config('app.title') }}{% endblock %}</title>
     <meta charset="utf-8">
     <meta name="description" content="Самообновляемые бесплатные IPTV-плейлисты для домашнего просмотра по коротким ссылкам, списки каналов, проверка доступности">
     <meta name="viewport" content="width=device-width, initial-scale=1">
@@ -55,10 +55,10 @@
             </nav>
         </header>
 
-        <div class="pt-lg-3 px-0 pb-0">
+        <section class="container-fluid h-100 pt-lg-3 px-0 pb-0">
             {% block header %}{% endblock %}
             {% block content %}{% endblock %}
-        </div>
+        </section>
 
         <footer class="py-4 text-center">
             <script src="{{ base_url('js/bootstrap.bundle.min.js') }}"></script>