From 5cfa35c79c55ea2a5e03e446c69668924a9b1f8d Mon Sep 17 00:00:00 2001
From: Cursor Agent <cursoragent@cursor.com>
Date: Sun, 21 Dec 2025 00:27:58 +0000
Subject: [PATCH] Add player column and badges to movie management table

Co-authored-by: mathieumoran1 <mathieumoran1@gmail.com>
---
 public/control.html      |  3 ++-
 public/js/app_control.js | 35 +++++++++++++++++++++++++++++++----
 2 files changed, 33 insertions(+), 5 deletions(-)

diff --git a/public/control.html b/public/control.html
index 825389d..96fb469 100644
--- a/public/control.html
+++ b/public/control.html
@@ -322,13 +322,14 @@
                   <tr>
                     <th style="width: 1%;">Sel.</th>
                     <th>Titre</th>
+                    <th style="width: 12%;">Player</th>
                     <th style="width: 20%;">Catégorie</th>
                     <th style="width: 12%;">Année</th>
                     <th style="width: 1%;">Actions</th>
                   </tr>
                 </thead>
                 <tbody id="admin-movies-body">
-                  <tr><td colspan="5" class="text-muted">Charge la liste…</td></tr>
+                  <tr><td colspan="6" class="text-muted">Charge la liste…</td></tr>
                 </tbody>
               </table>
             </div>
diff --git a/public/js/app_control.js b/public/js/app_control.js
index 0bffd55..71a7b26 100644
--- a/public/js/app_control.js
+++ b/public/js/app_control.js
@@ -726,12 +726,12 @@ window.onload = async function () {
   async function loadMoviesForManagement() {
     const year = manageYearSelect.value;
     const url = year ? `/api/movies?year=${encodeURIComponent(year)}` : '/api/movies';
-    adminMoviesBody.innerHTML = `<tr><td colspan="5" class="text-muted">Chargement…</td></tr>`;
+    adminMoviesBody.innerHTML = `<tr><td colspan="6" class="text-muted">Chargement…</td></tr>`;
 
     try {
       const res = await fetch(url, { method: 'GET' });
       if (!res.ok) {
-        adminMoviesBody.innerHTML = `<tr><td colspan="5" class="text-danger">Erreur lors du chargement (${res.status})</td></tr>`;
+        adminMoviesBody.innerHTML = `<tr><td colspan="6" class="text-danger">Erreur lors du chargement (${res.status})</td></tr>`;
         return;
       }
       const movies = await res.json();
@@ -739,13 +739,39 @@ window.onload = async function () {
       moviesById = new Map(movies.map((m) => [m._id, m]));
 
       if (!movies.length) {
-        adminMoviesBody.innerHTML = `<tr><td colspan="5" class="text-muted">Aucun film.</td></tr>`;
+        adminMoviesBody.innerHTML = `<tr><td colspan="6" class="text-muted">Aucun film.</td></tr>`;
         updateSelectionUI();
         return;
       }
 
+      function buildPlayerBadges(m) {
+        const badges = [];
+        const hasVideo = !!(m && m.video_src);
+        const hasEmbed = !!(m && m.embed_src);
+        const hasLegacy = !!(m && m.vod_link);
+
+        if (hasVideo) badges.push({ text: 'Video', cls: 'bg-primary' });
+        if (hasEmbed) badges.push({ text: 'Embed', cls: 'bg-info text-dark' });
+        if (hasLegacy) badges.push({ text: 'Legacy', cls: 'bg-secondary' });
+
+        const modeRaw = String(m?.player_mode || 'auto').toLowerCase();
+        const mode = (modeRaw === 'video' || modeRaw === 'embed' || modeRaw === 'auto') ? modeRaw : 'auto';
+        const modeText = mode === 'auto' ? 'Auto' : mode === 'video' ? 'Mode: Video' : 'Mode: Embed';
+        badges.push({ text: modeText, cls: 'bg-light text-dark border' });
+
+        if (!hasVideo && !hasEmbed && !hasLegacy) {
+          return [{ text: '—', cls: 'bg-light text-dark border' }];
+        }
+        return badges;
+      }
+
       adminMoviesBody.innerHTML = '';
       movies.forEach((m) => {
+        const badges = buildPlayerBadges(m);
+        const badgesHtml = badges
+          .map((b) => `<span class="badge ${b.cls} me-1 mb-1">${b.text}</span>`)
+          .join('');
+
         const tr = document.createElement('tr');
         tr.innerHTML = `
           <td>
@@ -755,6 +781,7 @@ window.onload = async function () {
             <div class="fw-semibold">${m.title || '(sans titre)'}</div>
             <div class="text-muted small">${m.imdb_id || ''}</div>
           </td>
+          <td>${badgesHtml}</td>
           <td>${m.category || ''}</td>
           <td>${m.year || ''}</td>
           <td class="text-end">
@@ -776,7 +803,7 @@ window.onload = async function () {
 
       updateSelectionUI();
     } catch (err) {
-      adminMoviesBody.innerHTML = `<tr><td colspan="5" class="text-danger">${err.message || 'Erreur réseau'}</td></tr>`;
+      adminMoviesBody.innerHTML = `<tr><td colspan="6" class="text-danger">${err.message || 'Erreur réseau'}</td></tr>`;
     }
   }