Feat: Possibility added to reconfigure via setup.php. A key is created into the config file.

locales/en.json

@@ -1,30 +1,53 @@
 {
-  "days":   ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"],
+  "days": [
-  "months": ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"],
+    "Sun",
-  "now":        "Now",
+    "Mon",
-  "channels":   "Channels",
+    "Tue",
-  "live":       "LIVE",
+    "Wed",
-  "loading":    "Loading guide...",
+    "Thu",
-  "epg_error":  "Unable to load EPG",
+    "Fri",
+    "Sat"
+  ],
+  "months": [
+    "Jan",
+    "Feb",
+    "Mar",
+    "Apr",
+    "May",
+    "Jun",
+    "Jul",
+    "Aug",
+    "Sep",
+    "Oct",
+    "Nov",
+    "Dec"
+  ],
+  "now": "Now",
+  "channels": "Channels",
+  "live": "LIVE",
+  "loading": "Loading guide...",
+  "epg_error": "Unable to load EPG",
   "epg_error_sub": "Check your XMLTV stream URL.",
-  "load":       "Load",
+  "load": "Load",
   "search_placeholder": "Search channel or program...",
-  "copy_epg":   "EPG",
+  "copy_epg": "EPG",
-  "copy_m3u":   "M3U",
+  "copy_m3u": "M3U",
-  "copied":     "\u2713 copied",
+  "copied": "✓ copied",
   "program_info": "Program info",
-  "watch_now":  "Watch now",
+  "watch_now": "Watch now",
   "imdb_search": "Search on IMDb",
-  "close":      "Close",
+  "close": "Close",
   "duration_min": "min",
   "personal_epg_title": "Personal EPG",
   "personal_epg_subtitle": "Use your own EPG/M3U source on this instance.",
   "personal_epg_label": "EPG URL (XMLTV) *",
   "personal_epg_m3u_label": "M3U URL",
   "personal_epg_optional": "optional",
-  "cancel":     "Cancel",
+  "cancel": "Cancel",
-  "apply":      "Apply",
+  "apply": "Apply",
   "setup_already_done": "Configuration already done. Use your admin key to access setup again.",
-  "shift_back": "\u25c4 1h",
+  "shift_back": "◄ 1h",
-  "shift_fwd":  "1h \u25ba"
+  "shift_fwd": "1h ►",
-}
+  "fav_add": "Add to favorites",
+  "fav_remove": "Remove from favorites"
+}

locales/es.json

@@ -1,30 +1,53 @@
 {
-  "days":   ["Dom", "Lun", "Mar", "Mi\u00e9", "Jue", "Vie", "S\u00e1b"],
+  "days": [
-  "months": ["Ene", "Feb", "Mar", "Abr", "May", "Jun", "Jul", "Ago", "Sep", "Oct", "Nov", "Dic"],
+    "Dom",
-  "now":        "Ahora",
+    "Lun",
-  "channels":   "Canales",
+    "Mar",
-  "live":       "LIVE",
+    "Mié",
-  "loading":    "Cargando gu\u00eda...",
+    "Jue",
-  "epg_error":  "No se puede cargar el EPG",
+    "Vie",
+    "Sáb"
+  ],
+  "months": [
+    "Ene",
+    "Feb",
+    "Mar",
+    "Abr",
+    "May",
+    "Jun",
+    "Jul",
+    "Ago",
+    "Sep",
+    "Oct",
+    "Nov",
+    "Dic"
+  ],
+  "now": "Ahora",
+  "channels": "Canales",
+  "live": "LIVE",
+  "loading": "Cargando guía...",
+  "epg_error": "No se puede cargar el EPG",
   "epg_error_sub": "Comprueba la URL de tu fuente XMLTV.",
-  "load":       "Cargar",
+  "load": "Cargar",
   "search_placeholder": "Buscar canal o programa...",
-  "copy_epg":   "EPG",
+  "copy_epg": "EPG",
-  "copy_m3u":   "M3U",
+  "copy_m3u": "M3U",
-  "copied":     "\u2713 copiado",
+  "copied": "✓ copiado",
   "program_info": "Info del programa",
-  "watch_now":  "Ver ahora",
+  "watch_now": "Ver ahora",
   "imdb_search": "Buscar en IMDb",
-  "close":      "Cerrar",
+  "close": "Cerrar",
   "duration_min": "min",
   "personal_epg_title": "EPG Personal",
   "personal_epg_subtitle": "Usa tu propia fuente EPG/M3U en esta instancia.",
   "personal_epg_label": "URL EPG (XMLTV) *",
   "personal_epg_m3u_label": "URL M3U",
   "personal_epg_optional": "opcional",
-  "cancel":     "Cancelar",
+  "cancel": "Cancelar",
-  "apply":      "Aplicar",
+  "apply": "Aplicar",
-  "setup_already_done": "Configuraci\u00f3n ya realizada. Usa tu clave de administrador para volver al setup.",
+  "setup_already_done": "Configuración ya realizada. Usa tu clave de administrador para volver al setup.",
-  "shift_back": "\u25c4 1h",
+  "shift_back": "◄ 1h",
-  "shift_fwd":  "1h \u25ba"
+  "shift_fwd": "1h ►",
-}
+  "fav_add": "Agregar a favoritos",
+  "fav_remove": "Quitar de favoritos"
+}

locales/fr.json

@@ -1,30 +1,53 @@
 {
-  "days":   ["Dim", "Lun", "Mar", "Mer", "Jeu", "Ven", "Sam"],
+  "days": [
-  "months": ["Jan", "F\u00e9v", "Mar", "Avr", "Mai", "Jun", "Jul", "Ao\u00fb", "Sep", "Oct", "Nov", "D\u00e9c"],
+    "Dim",
-  "now":        "Maintenant",
+    "Lun",
-  "channels":   "Cha\u00eenes",
+    "Mar",
-  "live":       "LIVE",
+    "Mer",
-  "loading":    "Chargement du guide...",
+    "Jeu",
-  "epg_error":  "Impossible de charger l'EPG",
+    "Ven",
-  "epg_error_sub": "V\u00e9rifiez l'URL de votre flux XMLTV.",
+    "Sam"
-  "load":       "Charger",
+  ],
-  "search_placeholder": "Rechercher une cha\u00eene ou un programme...",
+  "months": [
-  "copy_epg":   "EPG",
+    "Jan",
-  "copy_m3u":   "M3U",
+    "Fév",
-  "copied":     "\u2713 copi\u00e9",
+    "Mar",
+    "Avr",
+    "Mai",
+    "Jun",
+    "Jul",
+    "Aoû",
+    "Sep",
+    "Oct",
+    "Nov",
+    "Déc"
+  ],
+  "now": "Maintenant",
+  "channels": "Chaînes",
+  "live": "LIVE",
+  "loading": "Chargement du guide...",
+  "epg_error": "Impossible de charger l'EPG",
+  "epg_error_sub": "Vérifiez l'URL de votre flux XMLTV.",
+  "load": "Charger",
+  "search_placeholder": "Rechercher une chaîne ou un programme...",
+  "copy_epg": "EPG",
+  "copy_m3u": "M3U",
+  "copied": "✓ copié",
   "program_info": "Infos programme",
-  "watch_now":  "Regarder",
+  "watch_now": "Regarder",
   "imdb_search": "Rechercher sur IMDb",
-  "close":      "Fermer",
+  "close": "Fermer",
   "duration_min": "min",
   "personal_epg_title": "EPG Personnel",
   "personal_epg_subtitle": "Utilisez votre propre source EPG/M3U sur cette instance.",
   "personal_epg_label": "URL EPG (XMLTV) *",
   "personal_epg_m3u_label": "URL M3U",
   "personal_epg_optional": "optionnel",
-  "cancel":     "Annuler",
+  "cancel": "Annuler",
-  "apply":      "Appliquer",
+  "apply": "Appliquer",
-  "setup_already_done": "Configuration d\u00e9j\u00e0 effectu\u00e9e. Utilisez votre cl\u00e9 admin pour acc\u00e9der \u00e0 nouveau au setup.",
+  "setup_already_done": "Configuration déjà effectuée. Utilisez votre clé admin pour accéder à nouveau au setup.",
-  "shift_back": "\u25c4 1h",
+  "shift_back": "◄ 1h",
-  "shift_fwd":  "1h \u25ba"
+  "shift_fwd": "1h ►",
-}
+  "fav_add": "Ajouter aux favoris",
+  "fav_remove": "Retirer des favoris"
+}

setup.php

@@ -1,10 +1,9 @@
 <?php
-// ── Migration automatique ancien format → nouveau ─────────────────────────────
 $config_path = __DIR__ . '/config.json';
 
+// Migration automatique ancien format
 if (file_exists($config_path)) {
     $existing = json_decode(file_get_contents($config_path), true);
-    // Vieille instance : epg_url à la racine, pas de epg_sources
     if (isset($existing['epg_url']) && !isset($existing['epg_sources'])) {
         $existing['epg_sources'] = [[
             'name'    => 'Main',
@@ -15,18 +14,45 @@ if (file_exists($config_path)) {
         unset($existing['epg_url'], $existing['m3u_url']);
         file_put_contents($config_path, json_encode($existing, JSON_PRETTY_PRINT | JSON_UNESCAPED_SLASHES));
     }
-    http_response_code(403);
+    // Bootstrap : config existante sans cle admin -> on en genere une maintenant
-    die('Configuration déjà effectuée. Modifiez config.json via SSH pour changer les paramètres.');
+    if (empty($existing['admin_key'])) {
+        $existing['admin_key'] = bin2hex(random_bytes(16));
+        file_put_contents($config_path, json_encode($existing, JSON_PRETTY_PRINT | JSON_UNESCAPED_SLASHES));
+    }
 }
 
-$error   = '';
+$is_first_setup = !file_exists($config_path);
-$success = false;
+$existing       = $is_first_setup ? [] : json_decode(file_get_contents($config_path), true);
+$admin_key      = $existing['admin_key'] ?? null;
 
-if ($_SERVER['REQUEST_METHOD'] === 'POST') {
+$mode    = 'setup';
+$error   = '';
+$new_key = '';
+
+if (!$is_first_setup) {
+    if ($_SERVER['REQUEST_METHOD'] === 'POST' && isset($_POST['admin_key_input'])) {
+        if (trim($_POST['admin_key_input']) === $admin_key) {
+            $mode = 'setup';
+        } else {
+            $mode  = 'lock';
+            $error = 'Invalid admin key.';
+        }
+    } elseif ($_SERVER['REQUEST_METHOD'] === 'POST' && isset($_POST['group_name'])) {
+        if (trim($_POST['admin_key_hidden'] ?? '') !== $admin_key) {
+            $mode  = 'lock';
+            $error = 'Invalid admin key.';
+        } else {
+            $mode = 'setup';
+        }
+    } else {
+        $mode = 'lock';
+    }
+}
+
+if ($mode === 'setup' && $_SERVER['REQUEST_METHOD'] === 'POST' && isset($_POST['group_name'])) {
     $group_name         = trim($_POST['group_name'] ?? '');
     $allow_personal_epg = isset($_POST['allow_personal_epg']);
 
-    // Récupérer les sources EPG dynamiques
     $names    = $_POST['source_name']    ?? [];
     $epg_urls = $_POST['source_epg_url'] ?? [];
     $m3u_urls = $_POST['source_m3u_url'] ?? [];
@@ -37,13 +63,13 @@ if ($_SERVER['REQUEST_METHOD'] === 'POST') {
         $m3u_url = trim($m3u_urls[$i] ?? '');
         if (empty($epg_url)) continue;
         if (!filter_var($epg_url, FILTER_VALIDATE_URL)) {
-            $error = "URL EPG invalide pour la source « $name »."; break;
+            $error = "Invalid EPG URL for source \"$name\"."; break;
         }
         if (!empty($m3u_url) && !filter_var($m3u_url, FILTER_VALIDATE_URL)) {
-            $error = "URL M3U invalide pour la source « $name »."; break;
+            $error = "Invalid M3U URL for source \"$name\"."; break;
         }
         $epg_sources[] = [
-            'name'    => trim($name) ?: "Source " . ($i + 1),
+            'name'    => trim($name) ?: 'Source ' . ($i + 1),
             'epg_url' => $epg_url,
             'm3u_url' => $m3u_url,
         ];
@@ -51,303 +77,224 @@ if ($_SERVER['REQUEST_METHOD'] === 'POST') {
 
     if (empty($error)) {
         if (empty($group_name)) {
-            $error = 'Le nom du groupe est obligatoire.';
+            $error = 'Group name is required.';
         } elseif (empty($epg_sources)) {
-            $error = 'Au moins une source EPG est obligatoire.';
+            $error = 'At least one EPG source is required.';
         } else {
-            $config = [
+            $new_key = $is_first_setup ? strtoupper(bin2hex(random_bytes(8))) : $admin_key;
+            $config  = [
                 'group_name'         => $group_name,
                 'epg_sources'        => $epg_sources,
                 'allow_personal_epg' => $allow_personal_epg,
+                'admin_key'          => $new_key,
             ];
-            $written = file_put_contents(
+            $written = file_put_contents($config_path, json_encode($config, JSON_PRETTY_PRINT | JSON_UNESCAPED_SLASHES));
-                $config_path,
-                json_encode($config, JSON_PRETTY_PRINT | JSON_UNESCAPED_SLASHES)
-            );
             if ($written === false) {
-                $error = 'Impossible d\'écrire config.json. Vérifiez les permissions (chmod 775 .).';
+                $error = 'Cannot write config.json. Check permissions (chmod 775 .).';
             } else {
-                $success = true;
+                $mode = 'success';
             }
         }
     }
 }
+
+$prefill_group   = $_POST['group_name'] ?? $existing['group_name']     ?? '';
+$prefill_sources = $existing['epg_sources']                            ?? [];
+$prefill_epg     = !empty($existing['allow_personal_epg']);
+$submitted_key   = trim($_POST['admin_key_input'] ?? $_POST['admin_key_hidden'] ?? '');
 ?>
 <!DOCTYPE html>
-<html lang="fr">
+<html lang="en">
 <head>
 <meta charset="UTF-8">
 <meta name="viewport" content="width=device-width, initial-scale=1.0">
-<title>GridTV — Configuration</title>
+<title>GridTV — Setup</title>
 <link href="https://fonts.googleapis.com/css2?family=Share+Tech+Mono&family=Barlow+Condensed:wght@300;400;600;700&display=swap" rel="stylesheet">
 <style>
   :root {
-    --bg: #0a0b0d; --surface: #111318; --surface2: #181b22;
+    --bg:#0a0b0d;--surface:#111318;--surface2:#181b22;
-    --border: #232733; --border-bright: #2e3444;
+    --border:#232733;--border-bright:#2e3444;
-    --accent: #e8c842; --accent2: #4a9eff;
+    --accent:#e8c842;--accent2:#4a9eff;
-    --text: #c8cdd8; --text-dim: #5a6070; --text-bright: #eef0f5;
+    --text:#c8cdd8;--text-dim:#5a6070;--text-bright:#eef0f5;
-    --error: #ff4444; --success: #44cc77;
+    --error:#ff4444;--success:#44cc77;
-  }
-  * { box-sizing: border-box; margin: 0; padding: 0; }
-  html, body {
-    min-height: 100%; background: var(--bg); color: var(--text);
-    font-family: 'Barlow Condensed', sans-serif;
-    display: flex; align-items: flex-start; justify-content: center;
-  }
-  .setup-card {
-    width: 100%; max-width: 580px;
-    background: var(--surface); border: 1px solid var(--border-bright);
-    padding: 40px 40px 36px; margin: 40px 16px;
-  }
-  .setup-logo {
-    font-family: 'Share Tech Mono', monospace; font-size: 22px;
-    color: var(--accent); letter-spacing: 0.1em; text-transform: uppercase; margin-bottom: 6px;
-  }
-  .setup-logo span { color: var(--text-dim); margin: 0 6px; }
-  .setup-subtitle {
-    font-size: 13px; color: var(--text-dim); letter-spacing: 0.05em;
-    margin-bottom: 32px; line-height: 1.5;
-  }
-  .form-group { margin-bottom: 22px; }
-  .section-title {
-    font-family: 'Share Tech Mono', monospace; font-size: 11px;
-    letter-spacing: 0.12em; text-transform: uppercase;
-    color: var(--accent); margin: 32px 0 16px;
-    padding-bottom: 8px; border-bottom: 1px solid var(--border);
-  }
-  label {
-    display: block; font-size: 11px; letter-spacing: 0.12em;
-    text-transform: uppercase; color: var(--text-dim);
-    margin-bottom: 7px; font-family: 'Share Tech Mono', monospace;
-  }
-  label .required { color: var(--accent); margin-left: 3px; }
-  label .optional { color: var(--text-dim); font-size: 10px; text-transform: none; letter-spacing: 0; margin-left: 4px; opacity: 0.6; }
-  input[type="text"], input[type="url"] {
-    width: 100%; background: var(--surface2); border: 1px solid var(--border-bright);
-    color: var(--text-bright); font-family: 'Share Tech Mono', monospace;
-    font-size: 13px; padding: 10px 12px; outline: none; transition: border-color 0.15s;
-  }
-  input[type="text"]:focus, input[type="url"]:focus { border-color: var(--accent); }
-  input::placeholder { color: var(--text-dim); opacity: 0.5; }
-  .hint { font-size: 11px; color: var(--text-dim); margin-top: 5px; line-height: 1.4; }
-
-  /* Sources EPG */
-  .sources-list { display: flex; flex-direction: column; gap: 16px; }
-  .source-block {
-    background: var(--surface2); border: 1px solid var(--border);
-    padding: 16px; position: relative;
-  }
-  .source-block .source-num {
-    font-family: 'Share Tech Mono', monospace; font-size: 10px;
-    color: var(--accent); letter-spacing: 0.1em; margin-bottom: 12px;
-  }
-  .source-fields { display: grid; gap: 10px; }
-  .source-remove {
-    position: absolute; top: 10px; right: 10px;
-    background: none; border: none; color: var(--text-dim);
-    font-size: 16px; cursor: pointer; line-height: 1; padding: 2px 5px;
-  }
-  .source-remove:hover { color: var(--error); }
-  .btn-add-source {
-    width: 100%; background: none; border: 1px dashed var(--border-bright);
-    color: var(--accent2); font-family: 'Barlow Condensed', sans-serif;
-    font-size: 13px; font-weight: 600; letter-spacing: 0.1em;
-    text-transform: uppercase; padding: 10px; cursor: pointer;
-    margin-top: 8px; transition: border-color 0.15s, color 0.15s;
-  }
-  .btn-add-source:hover { border-color: var(--accent2); color: var(--text-bright); }
-
-  /* Toggle personal EPG */
-  .toggle-row {
-    display: flex; align-items: center; justify-content: space-between;
-    background: var(--surface2); border: 1px solid var(--border);
-    padding: 14px 16px; margin-bottom: 22px;
-  }
-  .toggle-label { font-size: 13px; color: var(--text); line-height: 1.4; }
-  .toggle-label small { display: block; font-size: 11px; color: var(--text-dim); margin-top: 2px; }
-  .toggle {
-    position: relative; width: 40px; height: 22px; flex-shrink: 0; margin-left: 16px;
-  }
-  .toggle input { opacity: 0; width: 0; height: 0; }
-  .toggle-slider {
-    position: absolute; inset: 0; background: var(--border-bright);
-    cursor: pointer; transition: background 0.2s; border-radius: 22px;
-  }
-  .toggle-slider:before {
-    content: ''; position: absolute; width: 16px; height: 16px;
-    left: 3px; top: 3px; background: var(--text-dim);
-    transition: transform 0.2s, background 0.2s; border-radius: 50%;
-  }
-  .toggle input:checked + .toggle-slider { background: var(--accent); }
-  .toggle input:checked + .toggle-slider:before { transform: translateX(18px); background: #000; }
-
-  .btn-submit {
-    width: 100%; background: var(--accent); color: #000; border: none;
-    font-family: 'Barlow Condensed', sans-serif; font-size: 15px; font-weight: 700;
-    letter-spacing: 0.12em; text-transform: uppercase; padding: 13px;
-    cursor: pointer; margin-top: 8px; transition: opacity 0.15s;
-  }
-  .btn-submit:hover { opacity: 0.85; }
-  .alert {
-    padding: 12px 14px; font-size: 13px; margin-bottom: 24px;
-    line-height: 1.5; border-left: 3px solid;
-  }
-  .alert-error  { background: rgba(255,68,68,0.08);  border-color: var(--error);   color: var(--error);   }
-  .alert-success{ background: rgba(68,204,119,0.08); border-color: var(--success); color: var(--success); }
-  .success-actions { text-align: center; margin-top: 28px; }
-  .btn-go {
-    display: inline-block; background: var(--accent); color: #000;
-    font-family: 'Barlow Condensed', sans-serif; font-size: 16px; font-weight: 700;
-    letter-spacing: 0.12em; text-transform: uppercase; padding: 13px 40px;
-    text-decoration: none; transition: opacity 0.15s;
-  }
-  .btn-go:hover { opacity: 0.85; }
-  .setup-note {
-    margin-top: 28px; padding-top: 20px; border-top: 1px solid var(--border);
-    font-size: 11px; color: var(--text-dim); line-height: 1.6;
-  }
-  .setup-note code {
-    font-family: 'Share Tech Mono', monospace; background: var(--surface2);
-    padding: 1px 5px; border: 1px solid var(--border); color: var(--accent2); font-size: 11px;
   }
+  *{box-sizing:border-box;margin:0;padding:0;}
+  html,body{min-height:100%;background:var(--bg);color:var(--text);font-family:'Barlow Condensed',sans-serif;display:flex;align-items:flex-start;justify-content:center;}
+  .setup-card{width:100%;max-width:580px;background:var(--surface);border:1px solid var(--border-bright);padding:40px 40px 36px;margin:40px 16px;}
+  .setup-logo{font-family:'Share Tech Mono',monospace;font-size:22px;color:var(--accent);letter-spacing:.1em;text-transform:uppercase;margin-bottom:6px;}
+  .setup-logo span{color:var(--text-dim);margin:0 6px;}
+  .setup-subtitle{font-size:13px;color:var(--text-dim);letter-spacing:.05em;margin-bottom:32px;line-height:1.5;}
+  .form-group{margin-bottom:22px;}
+  .section-title{font-family:'Share Tech Mono',monospace;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--accent);margin:32px 0 16px;padding-bottom:8px;border-bottom:1px solid var(--border);}
+  label{display:block;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--text-dim);margin-bottom:7px;font-family:'Share Tech Mono',monospace;}
+  label .required{color:var(--accent);margin-left:3px;}
+  label .optional{color:var(--text-dim);font-size:10px;text-transform:none;letter-spacing:0;margin-left:4px;opacity:.6;}
+  input[type=text],input[type=url],input[type=password]{width:100%;background:var(--surface2);border:1px solid var(--border-bright);color:var(--text-bright);font-family:'Share Tech Mono',monospace;font-size:13px;padding:10px 12px;outline:none;transition:border-color .15s;}
+  input:focus{border-color:var(--accent);}
+  input::placeholder{color:var(--text-dim);opacity:.5;}
+  .hint{font-size:11px;color:var(--text-dim);margin-top:5px;line-height:1.4;}
+  .sources-list{display:flex;flex-direction:column;gap:16px;}
+  .source-block{background:var(--surface2);border:1px solid var(--border);padding:16px;position:relative;}
+  .source-block .source-num{font-family:'Share Tech Mono',monospace;font-size:10px;color:var(--accent);letter-spacing:.1em;margin-bottom:12px;}
+  .source-fields{display:grid;gap:10px;}
+  .source-remove{position:absolute;top:10px;right:10px;background:none;border:none;color:var(--text-dim);font-size:16px;cursor:pointer;line-height:1;padding:2px 5px;}
+  .source-remove:hover{color:var(--error);}
+  .btn-add-source{width:100%;background:none;border:1px dashed var(--border-bright);color:var(--accent2);font-family:'Barlow Condensed',sans-serif;font-size:13px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;padding:10px;cursor:pointer;margin-top:8px;transition:border-color .15s,color .15s;}
+  .btn-add-source:hover{border-color:var(--accent2);color:var(--text-bright);}
+  .toggle-row{display:flex;align-items:center;justify-content:space-between;background:var(--surface2);border:1px solid var(--border);padding:14px 16px;margin-bottom:22px;}
+  .toggle-label{font-size:13px;color:var(--text);line-height:1.4;}
+  .toggle-label small{display:block;font-size:11px;color:var(--text-dim);margin-top:2px;}
+  .toggle{position:relative;width:40px;height:22px;flex-shrink:0;margin-left:16px;}
+  .toggle input{opacity:0;width:0;height:0;}
+  .toggle-slider{position:absolute;inset:0;background:var(--border-bright);cursor:pointer;transition:background .2s;border-radius:22px;}
+  .toggle-slider:before{content:'';position:absolute;width:16px;height:16px;left:3px;top:3px;background:var(--text-dim);transition:transform .2s,background .2s;border-radius:50%;}
+  .toggle input:checked+.toggle-slider{background:var(--accent);}
+  .toggle input:checked+.toggle-slider:before{transform:translateX(18px);background:#000;}
+  .btn-submit{width:100%;background:var(--accent);color:#000;border:none;font-family:'Barlow Condensed',sans-serif;font-size:15px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;padding:13px;cursor:pointer;margin-top:8px;transition:opacity .15s;}
+  .btn-submit:hover{opacity:.85;}
+  .alert{padding:12px 14px;font-size:13px;margin-bottom:24px;line-height:1.5;border-left:3px solid;}
+  .alert-error{background:rgba(255,68,68,.08);border-color:var(--error);color:var(--error);}
+  .alert-success{background:rgba(68,204,119,.08);border-color:var(--success);color:var(--success);}
+  .success-actions{text-align:center;margin-top:28px;}
+  .btn-go{display:inline-block;background:var(--accent);color:#000;font-family:'Barlow Condensed',sans-serif;font-size:16px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;padding:13px 40px;text-decoration:none;transition:opacity .15s;}
+  .btn-go:hover{opacity:.85;}
+  .key-box{background:var(--surface2);border:1px solid var(--accent);padding:18px 20px;margin:24px 0;text-align:center;}
+  .key-label{font-family:'Share Tech Mono',monospace;font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--text-dim);margin-bottom:10px;}
+  .key-value{font-family:'Share Tech Mono',monospace;font-size:22px;color:var(--accent);letter-spacing:.15em;word-break:break-all;}
+  .key-warning{font-size:11px;color:var(--text-dim);margin-top:10px;line-height:1.5;}
+  .key-warning strong{color:var(--error);}
+  .lock-screen{text-align:center;padding:10px 0 20px;}
+  .lock-icon{font-size:36px;margin-bottom:16px;}
+  .lock-title{font-family:'Share Tech Mono',monospace;font-size:13px;letter-spacing:.1em;color:var(--text);margin-bottom:8px;}
+  .lock-sub{font-size:12px;color:var(--text-dim);margin-bottom:24px;line-height:1.5;}
+  .lock-form{display:flex;gap:8px;}
+  .lock-form input{flex:1;}
+  .setup-note{margin-top:28px;padding-top:20px;border-top:1px solid var(--border);font-size:11px;color:var(--text-dim);line-height:1.6;}
+  .setup-note code{font-family:'Share Tech Mono',monospace;background:var(--surface2);padding:1px 5px;border:1px solid var(--border);color:var(--accent2);font-size:11px;}
 </style>
 </head>
 <body>
 <div class="setup-card">
-
   <div class="setup-logo">Grid<span>/</span>TV</div>
-  <div class="setup-subtitle">
-    Bienvenue sur GridTV — votre guide TV IPTV.<br>
-    Configurez votre instance en remplissant les champs ci-dessous.
-  </div>
 
-  <?php if ($error): ?>
+  <?php if ($mode === 'lock'): ?>
-    <div class="alert alert-error"><?= htmlspecialchars($error) ?></div>
+    <div class="setup-subtitle">Enter your admin key to access the configuration.</div>
-  <?php endif; ?>
+    <?php if ($error): ?><div class="alert alert-error"><?= htmlspecialchars($error) ?></div><?php endif; ?>
+    <div class="lock-screen">
+      <div class="lock-icon">&#128274;</div>
+      <div class="lock-title">Configuration locked</div>
+      <div class="lock-sub">GridTV is already configured.<br>Enter your admin key to edit the settings.</div>
+      <form method="POST" action="setup.php">
+        <div class="lock-form">
+          <input type="password" name="admin_key_input" placeholder="Your admin key" autofocus autocomplete="off">
+          <button type="submit" class="btn-submit" style="width:auto;padding:10px 20px;">Unlock</button>
+        </div>
+      </form>
+    </div>
 
-  <?php if ($success): ?>
+  <?php elseif ($mode === 'success'): ?>
-    <div class="alert alert-success">
+    <div class="setup-subtitle">Configuration saved successfully.</div>
-      ✓ Configuration enregistrée dans <code>config.json</code>.<br>
+    <div class="alert alert-success">&#10003; Settings saved to <code>config.json</code>.</div>
-      Cette page ne sera plus accessible. Pour modifier la config, éditez <code>config.json</code> via SSH.
+    <?php if ($is_first_setup): ?>
-    </div>
+    <div class="key-box">
-    <div class="success-actions">
+      <div class="key-label">Your admin key</div>
-      <a href="index.php" class="btn-go">Ouvrir GridTV →</a>
+      <div class="key-value"><?= htmlspecialchars($new_key) ?></div>
+      <div class="key-warning"><strong>Save this key now.</strong> It will not be shown again.<br>You will need it to access this setup page in the future.</div>
     </div>
+    <?php else: ?>
+    <div class="alert alert-success" style="margin-top:0">Your admin key is unchanged.</div>
+    <?php endif; ?>
+    <div class="success-actions"><a href="index.php" class="btn-go">Open GridTV &rarr;</a></div>
+
   <?php else: ?>
-
+    <div class="setup-subtitle">
-  <form method="POST" action="setup.php">
+      <?= $is_first_setup ? 'Welcome to GridTV. Fill in the fields below to get started.' : 'Edit your GridTV configuration.' ?>
-
-    <div class="form-group">
-      <label>Nom du groupe TV <span class="required">*</span></label>
-      <input type="text" name="group_name"
-             value="<?= htmlspecialchars($_POST['group_name'] ?? '') ?>"
-             placeholder="Ex: JohnnyBeGood, MaTV, FamilleTV..."
-             required>
-      <div class="hint">S'affiche en haut à gauche dans la topbar.</div>
     </div>
+    <?php if ($error): ?><div class="alert alert-error"><?= htmlspecialchars($error) ?></div><?php endif; ?>
 
-    <div class="section-title">Sources EPG</div>
+    <form method="POST" action="setup.php">
+      <?php if (!$is_first_setup): ?>
+        <input type="hidden" name="admin_key_hidden" value="<?= htmlspecialchars($submitted_key ?: $admin_key) ?>">
+      <?php endif; ?>
 
-    <div class="sources-list" id="sourcesList">
+      <div class="form-group">
-      <div class="source-block" data-index="0">
+        <label>TV Group Name <span class="required">*</span></label>
-        <div class="source-num">SOURCE 1</div>
+        <input type="text" name="group_name" value="<?= htmlspecialchars($prefill_group) ?>" placeholder="e.g. JohnnyBeGood, MyTV, FamilyTV..." required>
-        <button type="button" class="source-remove" onclick="removeSource(this)" style="display:none">✕</button>
+        <div class="hint">Displayed top-left in the topbar.</div>
-        <div class="source-fields">
+      </div>
-          <div>
+
-            <label>Nom de la source</label>
+      <div class="section-title">EPG Sources</div>
-            <input type="text" name="source_name[]" value="Main" placeholder="Ex: Main, Sports, Films...">
+      <div class="sources-list" id="sourcesList">
-          </div>
+        <?php
-          <div>
+        $sources_to_show = !empty($prefill_sources) ? $prefill_sources : [['name'=>'Main','epg_url'=>'','m3u_url'=>'']];
-            <label>URL EPG (XMLTV) <span class="required">*</span></label>
+        foreach ($sources_to_show as $i => $src): ?>
-            <input type="url" name="source_epg_url[]" placeholder="http://votre-serveur/api/xmltv.xml" required>
+        <div class="source-block" data-index="<?= $i ?>">
-          </div>
+          <div class="source-num">SOURCE <?= $i + 1 ?></div>
-          <div>
+          <button type="button" class="source-remove" onclick="removeSource(this)"<?= count($sources_to_show) === 1 ? ' style="display:none"' : '' ?>>&#10005;</button>
-            <label>URL M3U <span class="optional">(optionnel)</span></label>
+          <div class="source-fields">
-            <input type="url" name="source_m3u_url[]" placeholder="http://votre-serveur/api/channels.m3u">
+            <div>
-            <div class="hint">Utilisé par le lecteur intégré pour matcher les chaînes.</div>
+              <label>Source name</label>
+              <input type="text" name="source_name[]" value="<?= htmlspecialchars($src['name'] ?? '') ?>" placeholder="e.g. Main, Sports, Movies...">
+            </div>
+            <div>
+              <label>EPG URL (XMLTV) <span class="required">*</span></label>
+              <input type="url" name="source_epg_url[]" value="<?= htmlspecialchars($src['epg_url'] ?? '') ?>" placeholder="http://your-server/api/xmltv.xml">
+            </div>
+            <div>
+              <label>M3U URL <span class="optional">(optional)</span></label>
+              <input type="url" name="source_m3u_url[]" value="<?= htmlspecialchars($src['m3u_url'] ?? '') ?>" placeholder="http://your-server/api/channels.m3u">
+              <div class="hint">Used by the built-in player to match channels to streams.</div>
+            </div>
           </div>
         </div>
+        <?php endforeach; ?>
       </div>
-    </div>
+      <button type="button" class="btn-add-source" onclick="addSource()">+ Add EPG source</button>
 
-    <button type="button" class="btn-add-source" onclick="addSource()">+ Ajouter une source EPG</button>
+      <div class="section-title">Options</div>
-
+      <div class="toggle-row">
-    <div class="section-title">Options</div>
+        <div class="toggle-label">
-
+          Allow personal EPG
-    <div class="toggle-row">
+          <small>Visitors can use your instance with their own EPG/M3U URLs.</small>
-      <div class="toggle-label">
+        </div>
-        Autoriser les EPG personnels
+        <label class="toggle">
-        <small>Les visiteurs peuvent utiliser votre instance avec leur propre EPG/M3U.</small>
+          <input type="checkbox" name="allow_personal_epg" id="allowPersonalEpg"<?= $prefill_epg ? ' checked' : '' ?>>
+          <span class="toggle-slider"></span>
+        </label>
       </div>
-      <label class="toggle">
-        <input type="checkbox" name="allow_personal_epg" id="allowPersonalEpg">
-        <span class="toggle-slider"></span>
-      </label>
-    </div>
 
-    <button type="submit" class="btn-submit">Enregistrer la configuration</button>
+      <button type="submit" class="btn-submit">Save configuration</button>
-
+    </form>
-  </form>
 
   <?php endif; ?>
 
   <div class="setup-note">
-    <strong>Note :</strong> La configuration est stockée dans <code>config.json</code> sur le serveur.
+    <strong>Note:</strong> Configuration is stored in <code>config.json</code> on the server.
-    Ce fichier est exclu du dépôt Git (<code>.gitignore</code>).
+    This file is excluded from the Git repository (<code>.gitignore</code>).
-    Pour modifier les paramètres ultérieurement, éditez ce fichier directement via SSH.
   </div>
-
 </div>
 
 <script>
-let sourceCount = 1;
+let sourceCount = document.querySelectorAll('.source-block').length;
-
 function addSource() {
   sourceCount++;
   const list = document.getElementById('sourcesList');
   const div  = document.createElement('div');
-  div.className   = 'source-block';
+  div.className = 'source-block';
-  div.dataset.index = sourceCount - 1;
   div.innerHTML = `
     <div class="source-num">SOURCE ${sourceCount}</div>
-    <button type="button" class="source-remove" onclick="removeSource(this)">✕</button>
+    <button type="button" class="source-remove" onclick="removeSource(this)">&#10005;</button>
     <div class="source-fields">
-      <div>
+      <div><label>Source name</label><input type="text" name="source_name[]" placeholder="e.g. Sports, Movies..."></div>
-        <label>Nom de la source</label>
+      <div><label>EPG URL (XMLTV) <span class="required">*</span></label><input type="url" name="source_epg_url[]" placeholder="http://your-server/api/xmltv.xml"></div>
-        <input type="text" name="source_name[]" placeholder="Ex: Sports, Films...">
+      <div><label>M3U URL <span class="optional">(optional)</span></label><input type="url" name="source_m3u_url[]" placeholder="http://your-server/api/channels.m3u"><div class="hint">Used by the built-in player to match channels to streams.</div></div>
-      </div>
-      <div>
-        <label>URL EPG (XMLTV) <span class="required">*</span></label>
-        <input type="url" name="source_epg_url[]" placeholder="http://votre-serveur/api/xmltv.xml">
-      </div>
-      <div>
-        <label>URL M3U <span class="optional">(optionnel)</span></label>
-        <input type="url" name="source_m3u_url[]" placeholder="http://votre-serveur/api/channels.m3u">
-        <div class="hint">Utilisé par le lecteur intégré pour matcher les chaînes.</div>
-      </div>
     </div>`;
   list.appendChild(div);
   updateRemoveButtons();
 }
-
+function removeSource(btn) { btn.closest('.source-block').remove(); renumberSources(); updateRemoveButtons(); }
-function removeSource(btn) {
+function renumberSources() { document.querySelectorAll('.source-block').forEach((b,i) => b.querySelector('.source-num').textContent = `SOURCE ${i+1}`); }
-  btn.closest('.source-block').remove();
+function updateRemoveButtons() { const b = document.querySelectorAll('.source-block'); b.forEach(bl => bl.querySelector('.source-remove').style.display = b.length > 1 ? '' : 'none'); }
-  renumberSources();
-  updateRemoveButtons();
-}
-
-function renumberSources() {
-  document.querySelectorAll('.source-block').forEach((block, i) => {
-    block.querySelector('.source-num').textContent = `SOURCE ${i + 1}`;
-  });
-}
-
-function updateRemoveButtons() {
-  const blocks = document.querySelectorAll('.source-block');
-  blocks.forEach(block => {
-    block.querySelector('.source-remove').style.display = blocks.length > 1 ? '' : 'none';
-  });
-}
 </script>
 </body>
 </html>

src/js/epg.js

@@ -10,24 +10,35 @@ function makePlaceholder(name) {
   return el;
 }
 
+function makeChannelCell(ch) {
+  const cell = document.createElement('div');
+  cell.className = 'channel-cell';
+  if (ch.icon) {
+    const img = document.createElement('img');
+    img.className = 'channel-logo'; img.src = ch.icon;
+    img.onerror = () => img.replaceWith(makePlaceholder(ch.name));
+    cell.appendChild(img);
+  } else { cell.appendChild(makePlaceholder(ch.name)); }
+  const name = document.createElement('div');
+  name.className = 'channel-name'; name.textContent = ch.name; name.title = ch.name;
+  cell.appendChild(name);
+  cell.appendChild(makeFavBtn(ch.id));
+  cell.addEventListener('click', () => openPip(ch.name, getNowPlaying(ch.id)));
+  return cell;
+}
+
 function renderChannels() {
   const list = document.getElementById('channelsList');
   list.innerHTML = '';
-  channels.forEach(ch => {
+  const { favs, rest } = sortedChannels(channels);
-    const cell = document.createElement('div');
+
-    cell.className = 'channel-cell';
+  if (favs.length) {
-    if (ch.icon) {
+    favs.forEach(ch => list.appendChild(makeChannelCell(ch)));
-      const img = document.createElement('img');
+    const sep = document.createElement('div');
-      img.className = 'channel-logo'; img.src = ch.icon;
+    sep.className = 'fav-separator';
-      img.onerror = () => img.replaceWith(makePlaceholder(ch.name));
+    list.appendChild(sep);
-      cell.appendChild(img);
+  }
-    } else { cell.appendChild(makePlaceholder(ch.name)); }
+  rest.forEach(ch => list.appendChild(makeChannelCell(ch)));
-    const name = document.createElement('div');
-    name.className = 'channel-name'; name.textContent = ch.name; name.title = ch.name;
-    cell.appendChild(name);
-    cell.addEventListener('click', () => openPip(ch.name, getNowPlaying(ch.id)));
-    list.appendChild(cell);
-  });
 }
 
 function renderRuler() {
@@ -70,7 +81,9 @@ function renderPrograms() {
 
   const now = new Date();
 
-  channels.forEach((ch, i) => {
+  const { favs: _f, rest: _r } = sortedChannels(channels);
+  const orderedChannels = [..._f, ..._r];
+  orderedChannels.forEach((ch, i) => {
     const row = document.createElement('div');
     row.className = 'program-row';
     row.style.cssText = `top:${i*ROW_H}px;position:absolute;left:0;right:0;`;

src/js/favorites.js

@@ -0,0 +1,35 @@
+// ── FAVORITES ─────────────────────────────────────────────────────────────────
+let favorites = new Set(JSON.parse(localStorage.getItem('gridtv-favorites') || '[]'));
+
+function saveFavorites() {
+  localStorage.setItem('gridtv-favorites', JSON.stringify([...favorites]));
+}
+
+function toggleFavorite(chId, btn) {
+  if (favorites.has(chId)) {
+    favorites.delete(chId);
+    btn.classList.remove('is-fav');
+    btn.title = L.fav_add;
+  } else {
+    favorites.add(chId);
+    btn.classList.add('is-fav');
+    btn.title = L.fav_remove;
+  }
+  saveFavorites();
+  renderAll();
+}
+
+function makeFavBtn(chId) {
+  const btn = document.createElement('button');
+  btn.className = 'fav-btn' + (favorites.has(chId) ? ' is-fav' : '');
+  btn.title = favorites.has(chId) ? L.fav_remove : L.fav_add;
+  btn.textContent = '★';
+  btn.addEventListener('click', e => { e.stopPropagation(); toggleFavorite(chId, btn); });
+  return btn;
+}
+
+function sortedChannels(list) {
+  const favs = list.filter(ch => favorites.has(ch.id));
+  const rest  = list.filter(ch => !favorites.has(ch.id));
+  return { favs, rest };
+}

src/js/mobile.js

@@ -6,7 +6,9 @@ function renderMobile() {
   const winStart = new Date(now.getTime() - 30*60000);
   const winEnd   = new Date(now.getTime() + 4*3600000);
 
-  channels.forEach(ch => {
+  const { favs: _f, rest: _r } = sortedChannels(channels);
+  const orderedChannels = [..._f, ..._r];
+  orderedChannels.forEach(ch => {
     const progs = (programs[ch.id]||[]).filter(p => p.stop>winStart && p.start<winEnd);
     if (!progs.length) return;
 
@@ -49,6 +51,7 @@ function renderMobile() {
         const badge = document.createElement('div'); badge.className='mobile-live-badge'; badge.textContent='LIVE';
         item.appendChild(badge);
       }
+      item.addEventListener('click', () => openProgramModal(ch, p));
       list.appendChild(item);
     });
     section.appendChild(list); container.appendChild(section);

src/js/program.js

@@ -13,9 +13,9 @@ function openProgramModal(ch, p) {
   document.getElementById('pm-desc').textContent     = p.desc || '';
   document.getElementById('pm-desc').style.display   = p.desc ? 'block' : 'none';
 
-  // Bouton Watch now — seulement si live
+  // Bouton Watch now — seulement si live ET M3U fourni pour la source active
   const watchBtn = document.getElementById('pm-watch');
-  if (isLive) {
+  if (isLive && currentM3uUrl) {
     watchBtn.style.display = 'inline-flex';
     watchBtn.onclick = () => { closeProgramModal(); openPip(ch.name, p.title); };
   } else {

src/tpl/footer.php

@@ -3,7 +3,7 @@
 <?php
 $js_dir = __DIR__ . '/../js/';
 include $js_dir . 'config.js';
-$js_modules = ['utils', 'epg', 'mobile', 'tooltip', 'sources', 'm3u', 'player', 'themes', 'search', 'program', 'live'];
+$js_modules = ['utils', 'favorites', 'epg', 'mobile', 'tooltip', 'sources', 'm3u', 'player', 'themes', 'search', 'program', 'live'];
 foreach ($js_modules as $mod) {
     echo file_get_contents($js_dir . $mod . '.js');
 }

src/tpl/head.php

@@ -851,6 +851,24 @@
     background: var(--accent); opacity: .4; width: 2px;
   }
 
+
+  /* ── FAVORITES ───────────────────────────────────────────────────────────── */
+  .fav-btn {
+    background: none; border: none; color: var(--text-muted);
+    cursor: pointer; font-size: 14px; line-height: 1;
+    margin-left: auto; padding: 2px 4px; flex-shrink: 0;
+    transition: color .15s, transform .15s;
+    opacity: 0;
+  }
+  .channel-cell:hover .fav-btn { opacity: 1; }
+  .fav-btn.is-fav { color: var(--accent); opacity: 1; }
+  .fav-btn:hover { transform: scale(1.2); }
+
+  .fav-separator {
+    height: 2px; background: var(--accent);
+    opacity: .3; margin: 0;
+  }
+
 </style>
 <link id="themeStylesheet" rel="stylesheet" href="themes/default.css">
 </head>