lo he estado repasando pero aún no me funciona, sin embargo si pongo un alert en la línea de los archivos de audio la cadena es correcta
{ruta:"dos.mp3"},{ruta:"tres.mp3"},{ruta:"uno.mp3" }
Código PHP:
<?php
$directorio = "/wamp/www/audio";
if($gestor_dir = opendir($directorio)){
while (false !== ($entrada = readdir($gestor_dir))) {
if ($entrada != "." && $entrada != ".." && $entrada !=".php")
{$result[]= '{ruta:"'."$entrada".'"}';}
}
closedir($gestor_dir);
}
$string[] = implode(",", $result).""; //concateno el punto al final
$resultado=$string;
?>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>FdW - Reproductor de música</title>
<style>
img, label, audio{
display: block;
margin: 0 auto;
text-align: center;
}
img{
width: 200%;
}
</style>
<script type="text/javascript">
var arrayJS=<?php echo json_encode($string);?>;
/* for(var i=0;i<arrayJS.length;i++)
{
//alert("hola")
var resA=document.write("<br>"+arrayJS[i]);
}*/
</script>
<script type="text/javascript">
'use strict';
/**
* Reproductor de música
*
* @author Alexis88
*/
var Reproductor = {
init: function(){
//text-align: center;
//Arreglo de canciones con sus respectivos atributos
Reproductor.canciones = [ //alert(arrayJS) el resultado es {ruta:"dos.mp3"},{ruta:"tres.mp3"},{ruta:"uno.mp3"}
arrayJS
];
//Establecemos los elementos de portada, título, reproductor y contador
Reproductor.portrait = document.querySelector("#portrait");
Reproductor.title = document.querySelector("#title");
Reproductor.player = document.querySelector("#player");
Reproductor.cuenta = 0;
//Se reproduce la primera canción
Reproductor.tocar();
},
tocar: function(){
//Se establece la portada, artista y título y el archivo de audio
Reproductor.portrait.src = Reproductor.canciones[Reproductor.cuenta].portada;
Reproductor.title.innerHTML = Reproductor.canciones[Reproductor.cuenta].artista + " - " + Reproductor.canciones[Reproductor.cuenta].cancion;
Reproductor.player.src = Reproductor.canciones[Reproductor.cuenta].ruta;
//Se actualiza el contador
Reproductor.cuenta = Reproductor.cuenta == Reproductor.canciones.length - 1 ? 0 : ++Reproductor.cuenta;
//Se reproduce la canción
Reproductor.player.play();
//Cuando acabe una canción, se reproduce la que sigue
Reproductor.player.addEventListener("ended", Reproductor.tocar);
}
};
//Al cargar la página
document.addEventListener("DOMContentLoaded", Reproductor.init);
</script>
</head>
<body>
<img id="portrait" />
<label id="title"></label>
<audio id="player" controls="controls" type="audio/mpeg"></audio>
</body>
</html>