9 Commits
11 changed files with 413 additions and 328 deletions
Binary file not shown.

Before

Width:  |  Height:  |  Size: 642 KiB

After

Width:  |  Height:  |  Size: 1.0 MiB

+28 -5
View File
@@ -1,6 +1,27 @@
{ {
"days": ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"], "days": [
"months": ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"], "Sun",
"Mon",
"Tue",
"Wed",
"Thu",
"Fri",
"Sat"
],
"months": [
"Jan",
"Feb",
"Mar",
"Apr",
"May",
"Jun",
"Jul",
"Aug",
"Sep",
"Oct",
"Nov",
"Dec"
],
"now": "Now", "now": "Now",
"channels": "Channels", "channels": "Channels",
"live": "LIVE", "live": "LIVE",
@@ -11,7 +32,7 @@
"search_placeholder": "Search channel or program...", "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", "program_info": "Program info",
"watch_now": "Watch now", "watch_now": "Watch now",
"imdb_search": "Search on IMDb", "imdb_search": "Search on IMDb",
@@ -25,6 +46,8 @@
"cancel": "Cancel", "cancel": "Cancel",
"apply": "Apply", "apply": "Apply",
"setup_already_done": "Configuration already done. Use your admin key to access setup again.", "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"
} }
+30 -7
View File
@@ -1,17 +1,38 @@
{ {
"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",
"Lun",
"Mar",
"Mié",
"Jue",
"Vie",
"Sáb"
],
"months": [
"Ene",
"Feb",
"Mar",
"Abr",
"May",
"Jun",
"Jul",
"Ago",
"Sep",
"Oct",
"Nov",
"Dic"
],
"now": "Ahora", "now": "Ahora",
"channels": "Canales", "channels": "Canales",
"live": "LIVE", "live": "LIVE",
"loading": "Cargando gu\u00eda...", "loading": "Cargando guía...",
"epg_error": "No se puede cargar el EPG", "epg_error": "No se puede cargar el EPG",
"epg_error_sub": "Comprueba la URL de tu fuente XMLTV.", "epg_error_sub": "Comprueba la URL de tu fuente XMLTV.",
"load": "Cargar", "load": "Cargar",
"search_placeholder": "Buscar canal o programa...", "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", "program_info": "Info del programa",
"watch_now": "Ver ahora", "watch_now": "Ver ahora",
"imdb_search": "Buscar en IMDb", "imdb_search": "Buscar en IMDb",
@@ -24,7 +45,9 @@
"personal_epg_optional": "opcional", "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"
} }
+32 -9
View File
@@ -1,17 +1,38 @@
{ {
"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",
"Lun",
"Mar",
"Mer",
"Jeu",
"Ven",
"Sam"
],
"months": [
"Jan",
"Fév",
"Mar",
"Avr",
"Mai",
"Jun",
"Jul",
"Aoû",
"Sep",
"Oct",
"Nov",
"Déc"
],
"now": "Maintenant", "now": "Maintenant",
"channels": "Cha\u00eenes", "channels": "Chaînes",
"live": "LIVE", "live": "LIVE",
"loading": "Chargement du guide...", "loading": "Chargement du guide...",
"epg_error": "Impossible de charger l'EPG", "epg_error": "Impossible de charger l'EPG",
"epg_error_sub": "V\u00e9rifiez l'URL de votre flux XMLTV.", "epg_error_sub": "Vérifiez l'URL de votre flux XMLTV.",
"load": "Charger", "load": "Charger",
"search_placeholder": "Rechercher une cha\u00eene ou un programme...", "search_placeholder": "Rechercher une chaîne ou un programme...",
"copy_epg": "EPG", "copy_epg": "EPG",
"copy_m3u": "M3U", "copy_m3u": "M3U",
"copied": "\u2713 copi\u00e9", "copied": "✓ copié",
"program_info": "Infos programme", "program_info": "Infos programme",
"watch_now": "Regarder", "watch_now": "Regarder",
"imdb_search": "Rechercher sur IMDb", "imdb_search": "Rechercher sur IMDb",
@@ -24,7 +45,9 @@
"personal_epg_optional": "optionnel", "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"
} }
+156 -209
View File
@@ -1,10 +1,9 @@
<?php <?php
// ── Migration automatique ancien format → nouveau ─────────────────────────────
$config_path = __DIR__ . '/config.json'; $config_path = __DIR__ . '/config.json';
// Migration automatique ancien format
if (file_exists($config_path)) { if (file_exists($config_path)) {
$existing = json_decode(file_get_contents($config_path), true); $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'])) { if (isset($existing['epg_url']) && !isset($existing['epg_sources'])) {
$existing['epg_sources'] = [[ $existing['epg_sources'] = [[
'name' => 'Main', 'name' => 'Main',
@@ -15,18 +14,45 @@ if (file_exists($config_path)) {
unset($existing['epg_url'], $existing['m3u_url']); unset($existing['epg_url'], $existing['m3u_url']);
file_put_contents($config_path, json_encode($existing, JSON_PRETTY_PRINT | JSON_UNESCAPED_SLASHES)); 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'] ?? ''); $group_name = trim($_POST['group_name'] ?? '');
$allow_personal_epg = isset($_POST['allow_personal_epg']); $allow_personal_epg = isset($_POST['allow_personal_epg']);
// Récupérer les sources EPG dynamiques
$names = $_POST['source_name'] ?? []; $names = $_POST['source_name'] ?? [];
$epg_urls = $_POST['source_epg_url'] ?? []; $epg_urls = $_POST['source_epg_url'] ?? [];
$m3u_urls = $_POST['source_m3u_url'] ?? []; $m3u_urls = $_POST['source_m3u_url'] ?? [];
@@ -37,13 +63,13 @@ if ($_SERVER['REQUEST_METHOD'] === 'POST') {
$m3u_url = trim($m3u_urls[$i] ?? ''); $m3u_url = trim($m3u_urls[$i] ?? '');
if (empty($epg_url)) continue; if (empty($epg_url)) continue;
if (!filter_var($epg_url, FILTER_VALIDATE_URL)) { 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)) { 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[] = [ $epg_sources[] = [
'name' => trim($name) ?: "Source " . ($i + 1), 'name' => trim($name) ?: 'Source ' . ($i + 1),
'epg_url' => $epg_url, 'epg_url' => $epg_url,
'm3u_url' => $m3u_url, 'm3u_url' => $m3u_url,
]; ];
@@ -51,34 +77,38 @@ if ($_SERVER['REQUEST_METHOD'] === 'POST') {
if (empty($error)) { if (empty($error)) {
if (empty($group_name)) { if (empty($group_name)) {
$error = 'Le nom du groupe est obligatoire.'; $error = 'Group name is required.';
} elseif (empty($epg_sources)) { } elseif (empty($epg_sources)) {
$error = 'Au moins une source EPG est obligatoire.'; $error = 'At least one EPG source is required.';
} else { } else {
$new_key = $is_first_setup ? strtoupper(bin2hex(random_bytes(8))) : $admin_key;
$config = [ $config = [
'group_name' => $group_name, 'group_name' => $group_name,
'epg_sources' => $epg_sources, 'epg_sources' => $epg_sources,
'allow_personal_epg' => $allow_personal_epg, '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) { 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 { } 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> <!DOCTYPE html>
<html lang="fr"> <html lang="en">
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <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"> <link href="https://fonts.googleapis.com/css2?family=Share+Tech+Mono&family=Barlow+Condensed:wght@300;400;600;700&display=swap" rel="stylesheet">
<style> <style>
:root { :root {
@@ -89,265 +119,182 @@ if ($_SERVER['REQUEST_METHOD'] === 'POST') {
--error:#ff4444;--success:#44cc77; --error:#ff4444;--success:#44cc77;
} }
*{box-sizing:border-box;margin:0;padding:0;} *{box-sizing:border-box;margin:0;padding:0;}
html, body { 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;}
min-height: 100%; background: var(--bg); color: var(--text); .setup-card{width:100%;max-width:580px;background:var(--surface);border:1px solid var(--border-bright);padding:40px 40px 36px;margin:40px 16px;}
font-family: 'Barlow Condensed', sans-serif; .setup-logo{font-family:'Share Tech Mono',monospace;font-size:22px;color:var(--accent);letter-spacing:.1em;text-transform:uppercase;margin-bottom:6px;}
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-logo span{color:var(--text-dim);margin:0 6px;}
.setup-subtitle { .setup-subtitle{font-size:13px;color:var(--text-dim);letter-spacing:.05em;margin-bottom:32px;line-height:1.5;}
font-size: 13px; color: var(--text-dim); letter-spacing: 0.05em;
margin-bottom: 32px; line-height: 1.5;
}
.form-group{margin-bottom:22px;} .form-group{margin-bottom:22px;}
.section-title { .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);}
font-family: 'Share Tech Mono', monospace; font-size: 11px; 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;}
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 .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; } 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=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;}
width: 100%; background: var(--surface2); border: 1px solid var(--border-bright); input:focus{border-color:var(--accent);}
color: var(--text-bright); font-family: 'Share Tech Mono', monospace; input::placeholder{color:var(--text-dim);opacity:.5;}
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;} .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;} .sources-list{display:flex;flex-direction:column;gap:16px;}
.source-block { .source-block{background:var(--surface2);border:1px solid var(--border);padding:16px;position:relative;}
background: var(--surface2); border: 1px solid var(--border); .source-block .source-num{font-family:'Share Tech Mono',monospace;font-size:10px;color:var(--accent);letter-spacing:.1em;margin-bottom:12px;}
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-fields{display:grid;gap:10px;}
.source-remove { .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;}
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);} .source-remove:hover{color:var(--error);}
.btn-add-source { .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;}
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);} .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 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{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-label small{display:block;font-size:11px;color:var(--text-dim);margin-top:2px;}
.toggle { .toggle{position:relative;width:40px;height:22px;flex-shrink:0;margin-left:16px;}
position: relative; width: 40px; height: 22px; flex-shrink: 0; margin-left: 16px;
}
.toggle input{opacity:0;width:0;height:0;} .toggle input{opacity:0;width:0;height:0;}
.toggle-slider { .toggle-slider{position:absolute;inset:0;background:var(--border-bright);cursor:pointer;transition:background .2s;border-radius:22px;}
position: absolute; inset: 0; background: var(--border-bright); .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%;}
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{background:var(--accent);}
.toggle input:checked+.toggle-slider:before{transform:translateX(18px);background:#000;} .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 { .btn-submit:hover{opacity:.85;}
width: 100%; background: var(--accent); color: #000; border: none; .alert{padding:12px 14px;font-size:13px;margin-bottom:24px;line-height:1.5;border-left:3px solid;}
font-family: 'Barlow Condensed', sans-serif; font-size: 15px; font-weight: 700; .alert-error{background:rgba(255,68,68,.08);border-color:var(--error);color:var(--error);}
letter-spacing: 0.12em; text-transform: uppercase; padding: 13px; .alert-success{background:rgba(68,204,119,.08);border-color:var(--success);color:var(--success);}
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;} .success-actions{text-align:center;margin-top:28px;}
.btn-go { .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;}
display: inline-block; background: var(--accent); color: #000; .btn-go:hover{opacity:.85;}
font-family: 'Barlow Condensed', sans-serif; font-size: 16px; font-weight: 700; .key-box{background:var(--surface2);border:1px solid var(--accent);padding:18px 20px;margin:24px 0;text-align:center;}
letter-spacing: 0.12em; text-transform: uppercase; padding: 13px 40px; .key-label{font-family:'Share Tech Mono',monospace;font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--text-dim);margin-bottom:10px;}
text-decoration: none; transition: opacity 0.15s; .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;}
.btn-go:hover { opacity: 0.85; } .key-warning strong{color:var(--error);}
.setup-note { .lock-screen{text-align:center;padding:10px 0 20px;}
margin-top: 28px; padding-top: 20px; border-top: 1px solid var(--border); .lock-icon{font-size:36px;margin-bottom:16px;}
font-size: 11px; color: var(--text-dim); line-height: 1.6; .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;}
.setup-note code { .lock-form{display:flex;gap:8px;}
font-family: 'Share Tech Mono', monospace; background: var(--surface2); .lock-form input{flex:1;}
padding: 1px 5px; border: 1px solid var(--border); color: var(--accent2); font-size: 11px; .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> </style>
</head> </head>
<body> <body>
<div class="setup-card"> <div class="setup-card">
<div class="setup-logo">Grid<span>/</span>TV</div> <div class="setup-logo">Grid<span>/</span>TV</div>
<div class="setup-subtitle">
Bienvenue sur GridTV — votre guide TV IPTV.<br> <?php if ($mode === 'lock'): ?>
Configurez votre instance en remplissant les champs ci-dessous. <div class="setup-subtitle">Enter your admin key to access the configuration.</div>
<?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> </div>
<?php if ($error): ?> <?php elseif ($mode === 'success'): ?>
<div class="alert alert-error"><?= htmlspecialchars($error) ?></div> <div class="setup-subtitle">Configuration saved successfully.</div>
<?php endif; ?> <div class="alert alert-success">&#10003; Settings saved to <code>config.json</code>.</div>
<?php if ($is_first_setup): ?>
<?php if ($success): ?> <div class="key-box">
<div class="alert alert-success"> <div class="key-label">Your admin key</div>
✓ Configuration enregistrée dans <code>config.json</code>.<br> <div class="key-value"><?= htmlspecialchars($new_key) ?></div>
Cette page ne sera plus accessible. Pour modifier la config, éditez <code>config.json</code> via SSH. <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>
<div class="success-actions">
<a href="index.php" class="btn-go">Ouvrir GridTV →</a>
</div> </div>
<?php else: ?> <?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">
<?= $is_first_setup ? 'Welcome to GridTV. Fill in the fields below to get started.' : 'Edit your GridTV configuration.' ?>
</div>
<?php if ($error): ?><div class="alert alert-error"><?= htmlspecialchars($error) ?></div><?php endif; ?>
<form method="POST" action="setup.php"> <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="form-group"> <div class="form-group">
<label>Nom du groupe TV <span class="required">*</span></label> <label>TV Group Name <span class="required">*</span></label>
<input type="text" name="group_name" <input type="text" name="group_name" value="<?= htmlspecialchars($prefill_group) ?>" placeholder="e.g. JohnnyBeGood, MyTV, FamilyTV..." required>
value="<?= htmlspecialchars($_POST['group_name'] ?? '') ?>" <div class="hint">Displayed top-left in the topbar.</div>
placeholder="Ex: JohnnyBeGood, MaTV, FamilleTV..."
required>
<div class="hint">S'affiche en haut à gauche dans la topbar.</div>
</div> </div>
<div class="section-title">Sources EPG</div> <div class="section-title">EPG Sources</div>
<div class="sources-list" id="sourcesList"> <div class="sources-list" id="sourcesList">
<div class="source-block" data-index="0"> <?php
<div class="source-num">SOURCE 1</div> $sources_to_show = !empty($prefill_sources) ? $prefill_sources : [['name'=>'Main','epg_url'=>'','m3u_url'=>'']];
<button type="button" class="source-remove" onclick="removeSource(this)" style="display:none">✕</button> foreach ($sources_to_show as $i => $src): ?>
<div class="source-block" data-index="<?= $i ?>">
<div class="source-num">SOURCE <?= $i + 1 ?></div>
<button type="button" class="source-remove" onclick="removeSource(this)"<?= count($sources_to_show) === 1 ? ' style="display:none"' : '' ?>>&#10005;</button>
<div class="source-fields"> <div class="source-fields">
<div> <div>
<label>Nom de la source</label> <label>Source name</label>
<input type="text" name="source_name[]" value="Main" placeholder="Ex: Main, Sports, Films..."> <input type="text" name="source_name[]" value="<?= htmlspecialchars($src['name'] ?? '') ?>" placeholder="e.g. Main, Sports, Movies...">
</div> </div>
<div> <div>
<label>URL EPG (XMLTV) <span class="required">*</span></label> <label>EPG URL (XMLTV) <span class="required">*</span></label>
<input type="url" name="source_epg_url[]" placeholder="http://votre-serveur/api/xmltv.xml" required> <input type="url" name="source_epg_url[]" value="<?= htmlspecialchars($src['epg_url'] ?? '') ?>" placeholder="http://your-server/api/xmltv.xml">
</div> </div>
<div> <div>
<label>URL M3U <span class="optional">(optionnel)</span></label> <label>M3U URL <span class="optional">(optional)</span></label>
<input type="url" name="source_m3u_url[]" placeholder="http://votre-serveur/api/channels.m3u"> <input type="url" name="source_m3u_url[]" value="<?= htmlspecialchars($src['m3u_url'] ?? '') ?>" placeholder="http://your-server/api/channels.m3u">
<div class="hint">Utilisé par le lecteur intégré pour matcher les chaînes.</div> <div class="hint">Used by the built-in player to match channels to streams.</div>
</div> </div>
</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="section-title">Options</div>
<div class="toggle-row"> <div class="toggle-row">
<div class="toggle-label"> <div class="toggle-label">
Autoriser les EPG personnels Allow personal EPG
<small>Les visiteurs peuvent utiliser votre instance avec leur propre EPG/M3U.</small> <small>Visitors can use your instance with their own EPG/M3U URLs.</small>
</div> </div>
<label class="toggle"> <label class="toggle">
<input type="checkbox" name="allow_personal_epg" id="allowPersonalEpg"> <input type="checkbox" name="allow_personal_epg" id="allowPersonalEpg"<?= $prefill_epg ? ' checked' : '' ?>>
<span class="toggle-slider"></span> <span class="toggle-slider"></span>
</label> </label>
</div> </div>
<button type="submit" class="btn-submit">Enregistrer la configuration</button> <button type="submit" class="btn-submit">Save configuration</button>
</form> </form>
<?php endif; ?> <?php endif; ?>
<div class="setup-note"> <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>
</div> </div>
<script> <script>
let sourceCount = 1; let sourceCount = document.querySelectorAll('.source-block').length;
function addSource() { function addSource() {
sourceCount++; sourceCount++;
const list = document.getElementById('sourcesList'); const list = document.getElementById('sourcesList');
const div = document.createElement('div'); const div = document.createElement('div');
div.className = 'source-block'; div.className = 'source-block';
div.dataset.index = sourceCount - 1;
div.innerHTML = ` div.innerHTML = `
<div class="source-num">SOURCE ${sourceCount}</div> <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 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>`; </div>`;
list.appendChild(div); list.appendChild(div);
updateRemoveButtons(); 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> </script>
</body> </body>
</html> </html>
+20 -7
View File
@@ -10,10 +10,7 @@ function makePlaceholder(name) {
return el; return el;
} }
function renderChannels() { function makeChannelCell(ch) {
const list = document.getElementById('channelsList');
list.innerHTML = '';
channels.forEach(ch => {
const cell = document.createElement('div'); const cell = document.createElement('div');
cell.className = 'channel-cell'; cell.className = 'channel-cell';
if (ch.icon) { if (ch.icon) {
@@ -25,9 +22,23 @@ function renderChannels() {
const name = document.createElement('div'); const name = document.createElement('div');
name.className = 'channel-name'; name.textContent = ch.name; name.title = ch.name; name.className = 'channel-name'; name.textContent = ch.name; name.title = ch.name;
cell.appendChild(name); cell.appendChild(name);
cell.appendChild(makeFavBtn(ch.id));
cell.addEventListener('click', () => openPip(ch.name, getNowPlaying(ch.id))); cell.addEventListener('click', () => openPip(ch.name, getNowPlaying(ch.id)));
list.appendChild(cell); return cell;
}); }
function renderChannels() {
const list = document.getElementById('channelsList');
list.innerHTML = '';
const { favs, rest } = sortedChannels(channels);
if (favs.length) {
favs.forEach(ch => list.appendChild(makeChannelCell(ch)));
const sep = document.createElement('div');
sep.className = 'fav-separator';
list.appendChild(sep);
}
rest.forEach(ch => list.appendChild(makeChannelCell(ch)));
} }
function renderRuler() { function renderRuler() {
@@ -70,7 +81,9 @@ function renderPrograms() {
const now = new Date(); 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'); const row = document.createElement('div');
row.className = 'program-row'; row.className = 'program-row';
row.style.cssText = `top:${i*ROW_H}px;position:absolute;left:0;right:0;`; row.style.cssText = `top:${i*ROW_H}px;position:absolute;left:0;right:0;`;
+35
View File
@@ -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 };
}
+4 -1
View File
@@ -6,7 +6,9 @@ function renderMobile() {
const winStart = new Date(now.getTime() - 30*60000); const winStart = new Date(now.getTime() - 30*60000);
const winEnd = new Date(now.getTime() + 4*3600000); 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); const progs = (programs[ch.id]||[]).filter(p => p.stop>winStart && p.start<winEnd);
if (!progs.length) return; if (!progs.length) return;
@@ -49,6 +51,7 @@ function renderMobile() {
const badge = document.createElement('div'); badge.className='mobile-live-badge'; badge.textContent='LIVE'; const badge = document.createElement('div'); badge.className='mobile-live-badge'; badge.textContent='LIVE';
item.appendChild(badge); item.appendChild(badge);
} }
item.addEventListener('click', () => openProgramModal(ch, p));
list.appendChild(item); list.appendChild(item);
}); });
section.appendChild(list); container.appendChild(section); section.appendChild(list); container.appendChild(section);
+2 -2
View File
@@ -13,9 +13,9 @@ function openProgramModal(ch, p) {
document.getElementById('pm-desc').textContent = p.desc || ''; document.getElementById('pm-desc').textContent = p.desc || '';
document.getElementById('pm-desc').style.display = p.desc ? 'block' : 'none'; 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'); const watchBtn = document.getElementById('pm-watch');
if (isLive) { if (isLive && currentM3uUrl) {
watchBtn.style.display = 'inline-flex'; watchBtn.style.display = 'inline-flex';
watchBtn.onclick = () => { closeProgramModal(); openPip(ch.name, p.title); }; watchBtn.onclick = () => { closeProgramModal(); openPip(ch.name, p.title); };
} else { } else {
+1 -1
View File
@@ -3,7 +3,7 @@
<?php <?php
$js_dir = __DIR__ . '/../js/'; $js_dir = __DIR__ . '/../js/';
include $js_dir . 'config.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) { foreach ($js_modules as $mod) {
echo file_get_contents($js_dir . $mod . '.js'); echo file_get_contents($js_dir . $mod . '.js');
} }
+18
View File
@@ -851,6 +851,24 @@
background: var(--accent); opacity: .4; width: 2px; 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> </style>
<link id="themeStylesheet" rel="stylesheet" href="themes/default.css"> <link id="themeStylesheet" rel="stylesheet" href="themes/default.css">
</head> </head>