<?php
// Inclure la configuration
require_once 'includes/config.php';

// Récupérer l'ID de la vidéo depuis l'URL
$videoId = isset($_GET['id']) ? $_GET['id'] : '';

// Vérifier si l'ID est valide
if (empty($videoId)) {
    // Rediriger vers la page d'accueil si aucun ID n'est spécifié
    header('Location: index.php');
    exit;
}

// Récupérer les détails de la vidéo via l'API PeerTube
$videoData = callPeerTubeApi('videos/' . $videoId);

// Vérifier si la vidéo existe
if (empty($videoData) || isset($videoData['error'])) {
    // Gérer l'erreur : vidéo non trouvée
    $videoNotFound = true;
} else {
    // Formater les données de la vidéo
    $video = [
        'id' => $videoData['uuid'],
        'title' => $videoData['name'],
        'url' => PEERTUBE_URL . '/videos/embed/' . $videoData['uuid'],
        'description' => $videoData['description'] ?? '',
        'channel' => $videoData['channel']['displayName'],
        'channelId' => $videoData['channel']['id'],
        'channelHandle' => $videoData['channel']['name'],
        'views' => $videoData['views'],
        'likes' => $videoData['likes'],
        'date' => $videoData['publishedAt'],
        'tags' => $videoData['tags'] ?? []
    ];

    // Récupérer l'image de la chaîne
    $channelAvatar = 'img/default-avatar.jpg';
    if (isset($videoData['channel']['avatar']) && isset($videoData['channel']['avatar']['path'])) {
        $channelAvatar = PEERTUBE_URL . $videoData['channel']['avatar']['path'];
    }

    // Récupérer les vidéos suggérées (de la même chaîne)
    $channelVideos = callPeerTubeApi('video-channels/' . $video['channelHandle'] . '/videos', [
        'count' => 5,
        'isLocal' => true
    ]);
    
    $suggestedVideos = [];
    
    if (!empty($channelVideos['data'])) {
        foreach ($channelVideos['data'] as $suggVid) {
            // Ne pas inclure la vidéo courante dans les suggestions
            if ($suggVid['uuid'] !== $videoId) {
                $suggestedVideos[] = [
                    'id' => $suggVid['uuid'],
                    'title' => $suggVid['name'],
                    'thumbnail' => PEERTUBE_URL . $suggVid['thumbnailPath'],
                    'views' => $suggVid['views'],
                    'date' => $suggVid['publishedAt'],
                    'duration' => $suggVid['duration'],
                    'channel' => $suggVid['channel']['displayName']
                ];
            }
        }
    }
    
    // Si pas assez de vidéos de la même chaîne, ajouter des vidéos tendances
    if (count($suggestedVideos) < 5) {
        $trendingVideos = getTrendingVideos(10);
        
        foreach ($trendingVideos as $trendVid) {
            if ($trendVid['id'] !== $videoId && count($suggestedVideos) < 5) {
                // Vérifier que cette vidéo n'est pas déjà dans les suggestions
                $found = false;
                foreach ($suggestedVideos as $sv) {
                    if ($sv['id'] === $trendVid['id']) {
                        $found = true;
                        break;
                    }
                }
                
                if (!$found) {
                    $suggestedVideos[] = $trendVid;
                }
            }
        }
    }
}
?>

<!DOCTYPE html>
<html lang="fr">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title><?php echo !empty($video['title']) ? $video['title'] . ' - ' : ''; ?>Kaubuntu.re</title>
    <link rel="stylesheet" href="css/styles.css">
    <link rel="stylesheet" href="css/video-page.css">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css">
</head>
<body>
    <!-- Sidebar de navigation -->
    <div class="sidebar">
        <a href="index.php" class="logo">
            <img src="img/logo.png" alt="Kaubuntu.re">
        </a>
        
        <nav class="sidebar-nav">
            <a href="index.php" class="nav-item" data-title="Accueil">
                <i class="fas fa-home"></i> <span>Accueil</span>
            </a>
            <a href="#" class="nav-item" data-title="Direct">
                <i class="fas fa-broadcast-tower"></i> <span>Direct</span>
            </a>
            
            <div class="nav-divider"></div>
            
            <a href="#" class="nav-item" data-title="Explorer">
                <i class="fas fa-compass"></i> <span>Explorer</span>
            </a>
            <a href="#" class="nav-item" data-title="Actualité">
                <i class="fas fa-globe"></i> <span>Actualité</span>
            </a>
            <a href="#" class="nav-item" data-title="Musique">
                <i class="fas fa-music"></i> <span>Musique</span>
            </a>
            <a href="#" class="nav-item" data-title="Histoire">
                <i class="fas fa-monument"></i> <span>Histoire</span>
            </a>
            <a href="#" class="nav-item" data-title="Sport">
                <i class="fas fa-running"></i> <span>Sport</span>
            </a>
            
            <div class="nav-divider"></div>
            
            <div class="category-title">
                <i class="fas fa-hashtag"></i> <span>Hashtags</span>
            </div>
            
            <a href="#" class="tag-item" data-title="Interview">
                <div class="tag-dot"></div> <span>Interview</span>
            </a>
            <a href="#" class="tag-item" data-title="Conférence">
                <div class="tag-dot"></div> <span>Conférence</span>
            </a>
            <a href="#" class="tag-item" data-title="Colonialisme">
                <div class="tag-dot"></div> <span>Colonialisme</span>
            </a>
            <a href="#" class="tag-item" data-title="La Réunion">
                <div class="tag-dot"></div> <span>La Réunion</span>
            </a>
            <a href="#" class="tag-item" data-title="Afrique">
                <div class="tag-dot"></div> <span>Afrique</span>
            </a>
        </nav>
    </div>
    
    <!-- Contenu principal -->
    <div class="main-content">
        <!-- Header avec barre de recherche et icônes -->
        <div class="header">
            <div class="search-container">
                <form action="search.php" method="get">
                    <input type="text" name="q" placeholder="Recherche">
                    <button type="submit"><i class="fas fa-search"></i></button>
                </form>
            </div>
            
            <div class="social-icons">
                <a href="#" class="icon-button"><i class="fab fa-facebook"></i></a>
                <a href="#" class="icon-button"><i class="fab fa-youtube"></i></a>
                <a href="#" class="icon-button"><i class="fab fa-instagram"></i></a>
                <a href="#" class="icon-button"><i class="fas fa-ellipsis-h"></i></a>
            </div>
            
            <div class="action-icons">
                <a href="#" class="icon-button"><i class="fas fa-film"></i></a>
                <button class="dark-mode-toggle"><i class="fas fa-moon"></i></button>
            </div>
        </div>
        
        <?php if (isset($videoNotFound)): ?>
        <!-- Message d'erreur si la vidéo n'existe pas -->
        <div class="error-message">
            <i class="fas fa-exclamation-triangle"></i>
            <h2>Vidéo non trouvée</h2>
            <p>La vidéo que vous recherchez n'existe pas ou a été supprimée.</p>
            <a href="index.php" class="btn-primary">Retour à l'accueil</a>
        </div>
        
        <?php else: ?>
        <!-- Section vidéo -->
        <div class="video-page">
            <div class="video-player-container">
                <div class="video-player">
                    <iframe src="<?php echo $video['url']; ?>" frameborder="0" allowfullscreen="allowfullscreen" allow="autoplay; fullscreen" title="<?php echo htmlspecialchars($video['title']); ?>"></iframe>
                </div>
            </div>
            
            <div class="video-content">
                <div class="video-primary-info">
                    <h1 class="video-title"><?php echo $video['title']; ?></h1>
                    
                    <div class="video-info">
                        <div class="video-metadata">
                            <span class="video-views"><i class="fas fa-eye"></i> <?php echo formatViewCount($video['views']); ?> vues</span>
                            <span class="video-date"><i class="far fa-calendar-alt"></i> <?php echo formatDate($video['date']); ?></span>
                        </div>
                        
                        <div class="video-actions">
                            <button class="action-button">
                                <i class="fas fa-thumbs-up"></i>
                                <span><?php echo formatViewCount($video['likes']); ?></span>
                            </button>
                            <button class="action-button">
                                <i class="fas fa-share"></i>
                                <span>Partager</span>
                            </button>
                            <button class="action-button">
                                <i class="fas fa-download"></i>
                                <span>Télécharger</span>
                            </button>
                        </div>
                    </div>
                </div>
                
                <div class="video-secondary-info">
                    <div class="channel-info">
                        <div class="channel-avatar">
                            <img src="<?php echo $channelAvatar; ?>" alt="<?php echo $video['channel']; ?>">
                        </div>
                        <div class="channel-details">
                            <h3 class="channel-name"><?php echo $video['channel']; ?></h3>
                        </div>
                    </div>
                    
                    <div class="video-description">
                        <?php echo nl2br(htmlspecialchars($video['description'])); ?>
                    </div>
                    
                    <?php if (!empty($video['tags'])): ?>
                    <div class="video-tags">
                        <?php foreach ($video['tags'] as $tag): ?>
                            <a href="search.php?q=<?php echo urlencode($tag); ?>" class="tag">#<?php echo htmlspecialchars($tag); ?></a>
                        <?php endforeach; ?>
                    </div>
                    <?php endif; ?>
                </div>
                
                <?php if (ENABLE_COMMENTS): ?>
                <!-- Section commentaires -->
                <div class="comments-section">
                    <h3>Commentaires</h3>
                    
                    <div class="comment-form">
                        <div class="comment-avatar">
                            <img src="img/default-avatar.jpg" alt="Avatar">
                        </div>
                        <div class="comment-input">
                            <textarea placeholder="Ajouter un commentaire public..."></textarea>
                            <div class="comment-buttons">
                                <button class="comment-cancel">Annuler</button>
                                <button class="comment-submit">Commenter</button>
                            </div>
                        </div>
                    </div>
                    
                    <div class="comments-list">
                        <p class="no-comments">Les commentaires sont en cours de développement.</p>
                    </div>
                </div>
                <?php endif; ?>
            </div>
            
            <div class="video-suggestions">
                <h3>Vidéos suggérées</h3>
                
                <?php if (!empty($suggestedVideos)): ?>
                    <div class="suggestion-list">
                        <?php foreach ($suggestedVideos as $suggestedVideo): ?>
                            <a href="video.php?id=<?php echo $suggestedVideo['id']; ?>" class="suggested-video">
                                <div class="suggested-video-thumbnail">
                                    <img src="<?php echo $suggestedVideo['thumbnail']; ?>" alt="<?php echo $suggestedVideo['title']; ?>">
                                </div>
                                <div class="suggested-video-info">
                                    <span class="suggested-video-duration"><?php echo formatDuration($suggestedVideo['duration']); ?></span>
                                    <h4 class="suggested-video-title"><?php echo $suggestedVideo['title']; ?></h4>
                                    <div class="suggested-video-channel"><?php echo $suggestedVideo['channel']; ?></div>
                                    <div class="suggested-video-metadata">
                                        <span class="suggested-video-views"><?php echo formatViewCount($suggestedVideo['views']); ?> vues</span>
                                        <span class="suggested-video-date"><?php echo formatDate($suggestedVideo['date']); ?></span>
                                    </div>
                                </div>
                            </a>
                        <?php endforeach; ?>
                    </div>
                <?php else: ?>
                    <p>Aucune vidéo suggérée disponible</p>
                <?php endif; ?>
            </div>
        </div>
        <?php endif; ?>
        
        <!-- Footer -->
        <div class="footer">
            <div class="footer-logo">
                <img src="img/logo.png" alt="Kaubuntu.re">
            </div>
            
            <div class="footer-social">
                <a href="#"><i class="fab fa-facebook"></i></a>
                <a href="#"><i class="fab fa-youtube"></i></a>
                <a href="#"><i class="fab fa-instagram"></i></a>
                <a href="#"><i class="fab fa-tiktok"></i></a>
            </div>
            
            <div class="footer-contact">CONTACT</div>
            <div class="footer-email"><?php echo CONTACT_EMAIL; ?></div>
        </div>
    </div>
    
    <!-- Menu mobile (masqué par défaut) -->
    <button class="mobile-menu-toggle">
        <i class="fas fa-bars"></i>
    </button>
    
    <div class="mobile-menu">
        <button class="mobile-menu-close">
            <i class="fas fa-times"></i>
        </button>
        
        <div class="search-container">
            <form action="search.php" method="get">
                <input type="text" name="q" placeholder="Recherche">
                <button type="submit"><i class="fas fa-search"></i></button>
            </form>
        </div>
        
        <a href="index.php" class="nav-item">
            <i class="fas fa-home"></i> Accueil
        </a>
        <a href="#" class="nav-item">
            <i class="fas fa-broadcast-tower"></i> Direct
        </a>
        
        <div class="nav-divider"></div>
        
        <a href="#" class="nav-item">
            <i class="fas fa-compass"></i> Explorer
        </a>
        <a href="#" class="nav-item">
            <i class="fas fa-globe"></i> Actualité
        </a>
        <a href="#" class="nav-item">
            <i class="fas fa-music"></i> Musique
        </a>
        <a href="#" class="nav-item">
            <i class="fas fa-monument"></i> Histoire
        </a>
        <a href="#" class="nav-item">
            <i class="fas fa-running"></i> Sport
        </a>
    </div>
    
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
    <script src="js/main.js"></script>
</body>
</html> 