<?php
// pages/streaming_dashboard.php
requireRole('any');

// Fetch Active YouTube Streams
// Note: In a real scenario, this page might auto-refresh via JS or meta tag.
$active_streams = $pdo->query("
    SELECT ys.*, 
    (SELECT viewers FROM youtube_auto_logs WHERE stream_id = ys.id ORDER BY logged_at DESC LIMIT 1) as current_viewers
    FROM youtube_streams ys 
    WHERE ys.is_active = 1 
    ORDER BY ys.name
")->fetchAll();

// Fetch Latest Radio Log
$latest_radio = $pdo->query("SELECT * FROM radio_manual_logs ORDER BY service_date DESC, created_at DESC LIMIT 1")->fetch();
?>

<div style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 25px;">
    <h1>Streaming Dashboard</h1>
    <span style="font-size: 0.8rem; color: #888;">Auto-refreshes every 60s</span>
</div>
<meta http-equiv="refresh" content="60">

<div class="dashboard-grid">
    <!-- YouTube Streams Loop -->
    <?php foreach ($active_streams as $stream): ?>
        <?php 
            $status_color = 'var(--secondary-color)'; // Checked/Default
            $status_text = 'Checked';
            
            if ($stream['last_status'] === 'live') {
                $status_color = '#ff0000'; // Red for Live
                $status_text = '<i class="fas fa-circle fa-blink"></i> LIVE';
            } elseif ($stream['last_status'] === 'offline') {
                $status_color = '#444';
                $status_text = 'OFFLINE';
            } elseif ($stream['last_status'] === 'error') {
                $status_color = 'var(--accent-color)'; // Warning/Orange
                $status_text = 'ERROR';
            }
            
            $viewers = $stream['current_viewers'] ?? 0;
        ?>
        <div class="card" style="border-top: 3px solid <?php echo $status_color; ?>;">
            <div style="display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 10px;">
                <h3 style="margin: 0; font-size: 1.1rem;"><?php echo htmlspecialchars($stream['name']); ?></h3>
                <span class="badge" style="background: <?php echo $status_color; ?>; color: #fff; font-size: 0.7rem;"><?php echo $status_text; ?></span>
            </div>
            
            <div style="text-align: center; margin: 20px 0;">
                <div style="font-size: 2.5rem; font-weight: bold; color: #fff;"><?php echo number_format($viewers); ?></div>
                <div style="font-size: 0.8rem; color: #aaa;">Current Viewers</div>
            </div>
            
            <div style="font-size: 0.75rem; color: #666; text-align: center;">
                Video ID: <?php echo htmlspecialchars($stream['video_id']); ?>
            </div>
        </div>
    <?php endforeach; ?>
    
    <?php if (empty($active_streams)): ?>
        <div class="card" style="text-align: center; color: #888;">
            <p>No active YouTube streams configured.</p>
            <?php if (hasRole('admin')): ?>
                <a href="index.php?page=streaming_config" class="btn">Configure Streams</a>
            <?php endif; ?>
        </div>
    <?php endif; ?>

    <!-- Web Radio Summary -->
    <div class="card">
        <h3><i class="fas fa-broadcast-tower"></i> Web Radio</h3>
        <?php if ($latest_radio): ?>
            <div style="text-align: center; margin: 20px 0;">
                <div style="font-size: 2.5rem; font-weight: bold; color: var(--accent-color);"><?php echo number_format($latest_radio['listener_count']); ?></div>
                <div style="font-size: 0.8rem; color: #aaa;">Listeners (Manual Entry)</div>
            </div>
            <div style="text-align: center; font-size: 0.8rem; color: #888;">
                Last Logged: <?php echo $latest_radio['service_date']; ?>
            </div>
        <?php else: ?>
            <p style="text-align: center; color: #888; margin: 20px 0;">No radio stats recorded yet.</p>
        <?php endif; ?>
        
        <div style="margin-top: 15px; text-align: center;">
            <a href="index.php?page=streaming_input" class="btn" style="background-color: #333; font-size: 0.8rem;">Log New Entry</a>
        </div>
    </div>
</div>

<style>
@keyframes blink {
    0% { opacity: 1; }
    50% { opacity: 0.5; }
    100% { opacity: 1; }
}
.fa-blink {
    animation: blink 1.5s infinite;
}
</style>
