blob: 1d88b627f63e25341fefe0f52a99cbb8ddbf6035 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
|
init();
function init(){
var video = document.getElementById('video');
var playlist = document.getElementById('playlist');
var tracks = playlist.getElementsByTagName('a');
video.volume = 0.50;
//Cuenta los tracks
for(var track in tracks) {
var link = tracks[track];
if(typeof link === "function" || typeof link === "number") continue;
link.addEventListener('click', function(e) {
e.preventDefault();
var song = this.getAttribute('href');
run(song, video, this);
});
}
//Agregamos evento para reproducir el siguiente items
video.addEventListener('ended',function(e) {
for(var track in tracks) {
var link = tracks[track];
var nextTrack = parseInt(track) + 1;
if(typeof link === "function" || typeof link === "number") continue;
if(!this.src) this.src = tracks[0];
if(track == (tracks.length - 1)) nextTrack = 0;
console.log(nextTrack);
if(link.getAttribute('href') === this.src) {
var nextLink = tracks[nextTrack];
run(nextLink.getAttribute('href'), video, nextLink);
break;
}
}
});
}
function run(song, video, link){
var parent = link.parentElement;
//Quita el active de todos los elementos de la lista
var items = parent.parentElement.getElementsByTagName('li');
for(var item in items) {
if(items[item].classList)
items[item].classList.remove("is-active-play");
}
//Agrega active a este elemento
parent.classList.add("is-active-play");
//Inicia la reproducción
video.src = song;
video.load();
video.play();
}
|
