Tengo un par de botones html en una página .php que se supone que muestran archivos del directorio que contiene archivos .mp4/video. Encontré la función SCANDIR que funciona y muestra los archivos en el directorio.
Sin embargo, necesito que la lista sea interactiva, como hacer clic para reproducir el video (algo así como un href o un hipervínculo ). Actualmente, la lista que se muestra es solo texto sin formato.
Solo necesito que la lista tenga un hipervínculo a los archivos de video reales que planeo reproducir dentro de otro html-div.
El repositorio git de código: https://github.com/psedha10/Craigs-Music-Player
//from index.php <button class="button-left" onclick="showLatestHits()"> Latest Hits</button> <p id="song_genre"></p> function php_func_LatestHits() { $dir = 'music/Latest Hits'; $files = scandir($dir); foreach ($files as $value) { if ('.' !== $value && '..' !== $value && '.DS_Store' !== $value) { echo "<br><br>" . $value; } } } <script> var result_LatestHits = "<?php php_func_LatestHits(); ?>" </script> //from index.js function showLatestHits() { document.getElementById("song_genre").innerHTML = result_LatestHits; }Me he encontrado algo así como una respuesta por el momento. El código dado genera un archivo de video después de hacer clic en el botón de reproducción y un mosaico/nombre de archivo. Sin embargo, no utiliza scandir. Utiliza las funciones opendir y readdir de PHP.
//HTML Button <a class="button-left" href="index.php?5060=true"> 50's + 60's </a> //PHP function <?php function php_func_5060() { $dir = 'music/Fifty Sixty'; $videodir = opendir($dir); while (false !== ($filename = readdir($videodir))) { if ('.' !== $filename && '..' !== $filename && '.DS_Store' !== $filename) { echo '<img src="' . $dir . "/" . $filename . '" width="100" height="100"> '; echo '<a href="' . $dir . "/" . $filename . '" target="yt"> Play </a>'; echo "<li style='list-style-type: decimal'><a> $filename </a></li><br>"; echo '<br><br>'; } } } if (isset($_GET['5060'])) { php_func_5060(); } ?> //HTML seperate div that loads video using iframe from above link <div class="bottom-middle-block"> <iframe name='yt' style="width: 100%; min-height: 100%" frameborder="0"></iframe> </div>Algunas advertencias son que se debe hacer clic en iframe después de hacer clic en reproducir por separado, es decir, se debe agregar la reproducción automática. Y, el img src utilizado para mostrar la miniatura reproduce todo el video en sí mismo sin sonido como un pequeño GIF. Es decir, la imagen estática necesita alguna modificación.