RD5 GOLD v14.0 - FINAL BOSS

<?php
// canal.php - Muestra el canal de un usuario específico
session_start();
$videosFile = 'videos.json';
$commentsFile = 'comments.json';
if(!file_exists($videosFile)) file_put_contents($videosFile, json_encode([]));
if(!file_exists($commentsFile)) file_put_contents($commentsFile, json_encode([]));

function readJson($p){ $d=@file_get_contents($p); $a=json_decode($d,true); return is_array($a)?$a:[]; }

$videos = readJson($videosFile);
$comments = readJson($commentsFile);

// usuario solicitado
$channelUser = $_GET['user'] ?? '';
$channelVideos = array_values(array_filter($videos, function($v) use($channelUser){
    return ($v['userId'] ?? '') === $channelUser;
}));

// ordenar por fecha desc
usort($channelVideos, function($a,$b){ return ($b['created'] ?? 0) <=> ($a['created'] ?? 0); });
?>
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1">
<title>Canal del usuario</title>
<style>
:root{--bg:#111;--card:#1e1e1e;--muted:#ccc;--accent:#fe2c55;}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:#eee;font-family:Arial,Helvetica,sans-serif;padding:12px;}
.stage{display:flex;flex-direction:column;gap:20px;max-width:900px;margin:0 auto;}
.player-wrap{position:relative;}
.player{width:100%;height:500px;background:#000;border-radius:8px;display:flex;align-items:center;justify-content:center;overflow:hidden;}
.meta{margin-top:12px;}
.meta h2{margin:0 0 6px 0;font-size:20px;}
.desc{color:var(--muted);font-size:14px;margin-bottom:8px;}
.controls{display:flex;gap:8px;align-items:center;}
.controls form, .controls button{display:inline;}
.controls button{padding:10px 14px;border-radius:8px;border:none;background:#333;color:#fff;cursor:pointer;}
.controls form button{background:var(--accent);}
.comments-list{margin-top:6px;}
.comment{background:#161616;padding:8px;border-radius:6px;margin-bottom:8px;font-size:14px;}
.comment small{display:block;color:var(--muted);font-size:12px;margin-top:6px;}
.arrow{position:absolute;top:50%;transform:translateY(-50%);background:rgba(0,0,0,0.4);border-radius:50%;width:48px;height:48px;display:flex;align-items:center;justify-content:center;cursor:pointer;}
.arrow.left{left:8px;}
.arrow.right{right:8px;}
</style>
</head>
<body>

<h1 style="text-align:center;">Canal de <?php echo htmlspecialchars($channelUser); ?></h1>

<div class="stage">
  <div class="player-wrap">
    <div class="arrow left" onclick="prevVideo()">◀</div>
    <div class="player" id="playerArea">
      <div id="playerInner" style="color:#666;">No hay videos en este canal.</div>
    </div>
    <div class="arrow right" onclick="nextVideo()">▶</div>
  </div>

<button onclick="toggleCommentFocus()">💬 Comentar</button>

<form method="POST" style="display:inline;" id="deleteForm">
        <input type="hidden" name="deletePost" id="deletePostInput" value="">
        <button type="submit" style="background:#a22;">🗑️ Borrar</button>
      </form>
    </div>
  </div>

<div>
    <h3>Comentarios</h3>
    <div id="commentsArea" class="comments-list">
      
    </div>

<div style="margin-top:12px;">
      <form method="POST" id="commentForm">
        <input type="hidden" name="videoId" id="commentVideoId" value="">
        <input type="text" name="commentText" id="commentText" placeholder="Escribí un comentario..." style="width:100%;padding:10px;border-radius:6px;border:1px solid #333;background:#0b0b0b;color:#fff;">
        <div style="height:8px"></div>
        <button type="submit" style="width:100%;padding:10px;border-radius:6px;border:none;background:#2a7;padding:8px 12px;color:#000;cursor:pointer;">Enviar comentario</button>
      </form>
    </div>
  </div>
</div>

function renderPlayer(){
  const area = document.getElementById('playerInner');
  const title = document.getElementById('playerTitle');
  const desc = document.getElementById('playerDesc');
  const likeCount = document.getElementById('likeCount');
  const likeInput = document.getElementById('likeVideoInput');
  const delInput = document.getElementById('deletePostInput');
  const commentVidInput = document.getElementById('commentVideoId');

if(!videos.length){
    area.innerHTML = '<div style="color:#666">No hay videos en este canal.</div>';
    title.textContent='-'; desc.textContent='-'; likeCount.textContent='0'; likeInput.value=''; delInput.value=''; commentVidInput.value='';
    return;
  }
  const v = videos[currentIndex];
  title.textContent = v.title || 'Sin título';
  desc.textContent = (v.type==='youtube'?'YouTube video':'Video local') + (v.userId?' • Canal: '+v.userId:'');
  likeCount.textContent = v.likes || 0;
  likeInput.value = v.id; delInput.value=v.id; commentVidInput.value=v.id;

if(v.type==='youtube'){
    let id=v.src; if(id.startsWith('http')){const m=id.match(/(?:v=|\.be\/|embed\/)([A-Za-z0-9_\-]{4,})/); if(m) id=m[1];}
    area.innerHTML=`<iframe width="100%" height="100%" src="https://www.youtube.com/embed/${encodeURIComponent(id)}" frameborder="0" allowfullscreen></iframe>`;
  } else {
    const src=v.src;
    area.innerHTML=`<video width="100%" height="100%" controls autoplay style="background:#000;display:block;border-radius:6px;"><source src="${encodeURIComponent(src).replace(/%2F/g,'/').replace(/%3A/g,':')}" type="video/mp4">Tu navegador no soporta video.</video>`;
  }

// render comentarios del video actual
  const cArea = document.getElementById('commentsArea');
  const related = comments.filter(c=>c.videoId===v.id);
  let html=''; if(related.length===0){html='<div class="comment" style="background:#0b0b0b;color:#777">Sin comentarios</div>';}else{related.forEach(c=>{html+=`<div class="comment">${escapeHtml(c.text)}<small>by ${escapeHtml(c.userId)} • ${new Date(c.created*1000).toLocaleString()}</small></div>`;});}
  cArea.innerHTML=html;
}

</body>
</html>