From e5df0687783a566f51181bf75749ebd4567fb9fa Mon Sep 17 00:00:00 2001
From: ubuntu <paul.maarek@vinci-construction.ca>
Date: Mon, 31 Aug 2026 01:33:34 +0000
Subject: [PATCH] Show channel category in search results

Each channel already carries a Topic field, but search results only
showed the name and logo. Render it as a small badge in both the
list and grid views when present.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
---
 static/index.html | 13 ++++++++-----
 1 file changed, 8 insertions(+), 5 deletions(-)

diff --git a/static/index.html b/static/index.html
index 3012276..8de2d60 100644
--- a/static/index.html
+++ b/static/index.html
@@ -1985,6 +1985,8 @@
             var name_channel = element['Name']
             var url_channel = element['url']
             var id_playlist = element['id_playlist']
+            var topic_channel = element['Topic'] || ''
+            var topicBadge = topic_channel ? `<span class="badge bg-secondary channel-topic-badge">${topic_channel}</span>` : ''
             var url_channel_macos = url_channel.replace("http://", 'rtmp://')
             
             var oid = ''
@@ -2010,8 +2012,9 @@
                                     data-id_playlist="${id_playlist}">
                                     
                                     <img src="logos/${id_channel}.jpg" class="channel-row-logo"
-                                        onerror="this.onerror=null; this.src='get_logo?id_channel=${id_channel}&id_playlist=${id_playlist}';">  
+                                        onerror="this.onerror=null; this.src='get_logo?id_channel=${id_channel}&id_playlist=${id_playlist}';">
                                     <span class="channel-row-name text-truncate">${name_channel}</span>
+                                    ${topicBadge}
                                     ${colorCircle}
                             </div>
 
@@ -2027,11 +2030,11 @@
                                 onerror="this.onerror=null; this.src='get_logo?id_channel=${id_channel}&id_playlist=${id_playlist}';" alt="${name_channel}">
                             </div>
                             <p class="btn_play_media card-text mb-3"
-                                data-url_channel="${url_channel}" 
-                                data-name_channel="${name_channel}" 
+                                data-url_channel="${url_channel}"
+                                data-name_channel="${name_channel}"
                                 data-id_channel="${id_channel}"
                                 data-id_playlist="${id_playlist}">${name_channel}</p>
-                            <div class="d-flex justify-content-center align-items-center gap-2">${colorCircle}</div>
+                            <div class="d-flex justify-content-center align-items-center gap-2">${colorCircle}${topicBadge}</div>
                             <div class="d-flex justify-content-center gap-2 mt-3">
                                 <button data-display_url="${url_channel}" class="btn_display_url btn btn-sm btn-outline-info">url</button>
                                 <a class="btn btn-sm btn-primary" href="vlc://${url_channel_macos}">vlc ios</a>
@@ -2429,7 +2432,7 @@
 
             var dataJSON = JSON.parse(data)
             list_playlist = dataJSON
-            
+
 
             for (var i=0;i<dataJSON.length;i++) {
                 var id_playlist = dataJSON[i].id_playlist