mercredi 28 janvier 2015

JavaScript audio multi track player

I am new to this and I hope someone could help me to finish this JavaScript code by enabling it to pull the img of the audio links provided.


As it does now with the play and pause and next song


Here is the full code:





</script>


<script type="text/javascript">

function loadPlayer() {
var audioPlayer = new Audio();
audioPlayer.controls="";
audioPlayer.addEventListener('ended',nextSong,false);
audioPlayer.addEventListener('error',errorFallback,true);
document.getElementById("player").appendChild(audioPlayer);
nextSong();
}
function nextSong() {
if(urls[next]!=undefined) {
var audioPlayer = document.getElementsByTagName('audio')[0];
if(audioPlayer!=undefined) {
audioPlayer.src=urls[next];
audioPlayer.load();
audioPlayer.play();
next++;
} else {
loadPlayer();
}
} else {
alert('Error due to end Of Stations list or the Web Browser is not supported. Please use with Google Chrome');
}
}
function errorFallback() {
nextSong();
}
function playPause() {
var audioPlayer = document.getElementsByTagName('audio')[0];
if(audioPlayer!=undefined) {
if (audioPlayer.paused) {
audioPlayer.play();
} else {
audioPlayer.pause();
}
} else {
loadPlayer();
}
}
function pickSong(num) {
next = num;
nextSong();
}


var urls = new Array();

urls[-1] = 'http://ift.tt/1tr9ENU';
urls[-2] = 'http://ift.tt/1Bp6Yye';
urls[-3] = 'http://ift.tt/1Bp6Yye';
urls[-4] = 'http://ift.tt/1Bp6YOu';
var next = 0;

</script>



<!-- player start -->
<a href="#" onclick="playPause()" id="player" title="Play">Play</a>
<a href="#" onclick="playPause()" id="player" title="Stop">Stop</a>
<a href="#" onclick="nextSong()" id="player" title="Next Station">Next Track</a>

<!-- player ends -->

<br>
<br>
<!-- img links start -->

<a href="#" onclick="pickSong(-1)">
<img src="radio/radio almazighia.png" />
</a>
<a href="#" onclick="pickSong(-2)">
<img src="radio/alwatania.png" />
</a>
<a href="#" onclick="pickSong(-3)">
<img src="radio/inter.jpg" />
</a>
<a href="#" onclick="pickSong(-4)">
<img src="radio/france maghrib.jpg" />
</a>

<!-- img links ends -->



Aucun commentaire:

Enregistrer un commentaire