<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width">
    <title>Quiz Musical</title>
    <style>
        body {
            color: white;
            background-color:  #2a0382;
            font-family: Arial, sans-serif;
            text-align: center;
        }

        #quiz-container {
            max-width: 500px;
            margin: 0 auto;
        }

        #audio-player {
            margin-bottom: 10px;
        }

        #song-info {
            display: none;

        table, th, td {
            border: 1px solid black;
            border-collapse: collapse;
        }
        }
    </style>
</head>
<body>
<div id="quiz-container">
    <h1>Quiz Musical</h1>
    <?php
    // Dossier contenant les fichiers audio (formats supportés : mp3, ogg, flac)
    $audio_folder = 'music/';

    // Liste des fichiers audio dans le dossier
    $audio_files = glob($audio_folder . '*.mp3');
    $audio_files = array_merge($audio_files, glob($audio_folder . '*.ogg'));
    $audio_files = array_merge($audio_files, glob($audio_folder . '*.flac'));

    if (empty($audio_files)) {
        echo "<p>Aucun fichier audio trouvé dans le dossier spécifié.</p>";
    } else {
        // Choix aléatoire d'un fichier audio
        $random_file = $audio_files[array_rand($audio_files)];

        // Récupérer les métadonnées du fichier audio
        require_once 'getID3/getid3/getid3.php';
        $getID3 = new getID3;
        $audio_info = $getID3->analyze($random_file);
        getid3_lib::CopyTagsToComments($audio_info);

        // Afficher le lecteur audio avec les métadonnées
        if (!empty($audio_info['comments_html']['title'][0]) && !empty($audio_info['comments_html']['artist'][0])) {
            $title = $audio_info['comments_html']['title'][0];
            $artist = $audio_info['comments_html']['artist'][0];
            $album = !empty($audio_info['comments_html']['album'][0]) ? $audio_info['comments_html']['album'][0] : 'Inconnu';
            $year = !empty($audio_info['comments_html']['year'][0]) ? $audio_info['comments_html']['year'][0] : '(Année inconnue)';
            $cover = !empty($audio_info['comments_html']['attached_picture'][0]) ? base64_encode($audio_info['comments_html']['attached_picture'][0]['data']) : '';
            ?>
            <p><center><i>Trouverez-vous l'artiste et le titre de cette chanson sortie en <?php echo $year; ?> ?</i></center></p>
            <audio controls id="audio-player" onloadedmetadata="setInitialTime()" autoplay>
                <source src="<?php echo $random_file; ?>" type="audio/mpeg">
                Votre navigateur ne supporte pas la lecture audio.
            </audio>
            <br>
            <button onclick="validateAnswer()">Afficher l'artiste et le titre (arrête la lecture)</button><br>
            <button onclick="nextSong()">Chanson suivante</button>
            <div id="song-info">
              <table align="center">
                <tr><td>Titre :</td><td><h3><?php echo $title; ?></h3></td></tr>
                <tr><td>Artiste :</td><td><h3><?php echo $artist; ?></h3></td></tr>
                <tr><td>Album :</td><td><h3><?php echo $album; ?></h3></td></tr>
                <tr><td>Année :</td><td><h3><?php echo $year; ?></h3></td></tr>
              </table>
                <?php
            // Afficher les données de la pochette d'album
            if (!empty($audio_info['comments']['picture'][0]['data'])) {
                $cover_data = $audio_info['comments']['picture'][0]['data'];
                $cover_mime = $audio_info['comments']['picture'][0]['image_mime'];
                $cover_base64 = 'data:' . $cover_mime . ';base64,' . base64_encode($cover_data);
                echo '<img src="' . $cover_base64 . '" alt="Pochette">';
            }
            ?>
            </div>
            <br>
            <script>
                let audioPlayer = document.getElementById('audio-player');
                let songInfo = document.getElementById('song-info');

                function setInitialTime() {
                    audioPlayer.currentTime = 60; // Démarrer la lecture à 50 secondes
                    setTimeout(validateAnswer, 30000); // Valider automatiquement après 30 secondes
                }

                function validateAnswer() {
                    songInfo.style.display = 'block';
                    audioPlayer.pause(); // Pause la lecture après 15 secondes
                    setTimeout(function() {
                        songInfo.style.display = 'none';
                        audioPlayer.currentTime = 0; // Remettre la lecture à zéro pour la prochaine chanson
                    }, 15000);
                }

                function nextSong() {
                    window.location.reload(); // Recharger la page pour jouer une nouvelle chanson
                }
            </script>
            <?php
        } else {
            echo "<p>Aucune métadonnée valide trouvée pour le fichier audio.</p>";
        }
    }
    ?>
</div>
</body>
</html>