Buenas, el ejemplo que me has puesto me vale perfectamente, pero cuando lo paso al wampserver, no funciona, no sé que me pasa con este código.
Este es el código que pongo, solo cambio el primer archivo que lo tengo en la misma carpeta que el php.
aún poniendo todas tus canciones no me funciona.
Código PHP:
<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">
"use strict";
/**
* Reproductor de música
*
* @author Alexis88
*/
var Reproductor = {
init: function(){
//text-align: center;
//Arreglo de canciones con sus respectivos atributos
Reproductor.canciones = [
{
artista: "Circa Waves",
cancion: "Uno",
ruta: "uno.mp3"
},
{
artista: "Circa Waves",
cancion: "Fire That Burns",
ruta: "http://umgukvirgin.edgesuite.net/D2C/circawaves/circawaves-firethatburns.mp3",
portada: "https://s-media-cache-ak0.pinimg.com/originals/51/95/70/5195701e847bc0a38f25f5721bce92f1.jpg"
},
{
artista: "Circa Waves",
cancion: "Stuck",
ruta: "http://umgstore.edgesuite.net/D2C/circawaves/Stuck.mp3",
portada: "http://ksassets.timeincuk.net/wp/uploads/sites/55/2017/03/2017_CircaWaves_Press_080317.jpg"
}
];
//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
</script>
</head>
<body>
<img id="portrait" />
<label id="title"></label>
<audio id="player" controls="controls" type="audio/mpeg"></audio>
</body>
</html>
Siento las molestias que te causo, casi siempre entiendo las cosas a la primera pero esto se me está atragantando