Graph-Algorithm-Visualizer/music.js at main · NembotJules/Graph-Algorithm-Visualizer · GitHub

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
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130


const prevBtn = document.getElementById('prev');
const nextBtn = document.getElementById('next');
const playBtn  = document.getElementById('play');
const volume  = document.getElementById('volume');
const audio  = document.getElementById('audio');
const volumeSetter = document.getElementById('volumeSetter');
const preText = document.getElementById('text') ;
const linkBtn = document.getElementById('link');
let randomIndex = 0;

let musicArray = [  'music/Alan Walker & UPSAHL - Shut Up (Official Music Video)_1sESCIMpx0U.mp3',
                    "music/Alan Walker & Sorana - Catch Me If You Can (Offical Lyric Video)_MsRYa6UWzAo.mp3",
                    "music/Alan Walker x @Conor Maynard - Believers (Official Montage)_ZtBzWUZbTvA.mp3",
                    "music/Legends Never Die_ Remix (ft. Alan Walker) _ Worlds 2017 - League of Legends_eEKfWVvADiQ.mp3",
                    "music/Alan Walker - Lovesick (Official Lyric Video)_9AFqO114Xq4.mp3",
                    "music/Alan Walker - Ritual (Official Music Video)_-W8UizbMJbc.mp3" ,
                    "music/Sam.mp3",
                    "music/GIMS.mp3",
                    "music/death.mp3",
                    "music/GAZO-x-Freeze-Corleone-667-DRILL-FR-4_lbeUyW6axeA.mp3",
                    "music/Freeze-Ral__Zey1wgfA-c.mp3",
                    "music/KOBA-LAD-7-SUR-7-FT-FREEZE-CORLEONE-CLIP-OFFICIEL_tr2zDYYKLMM.mp3",
                    "music/Freeze-Corleone-Rip-Pop-Smoke-REMIX-Welcome-to-the-party-freestyle_V0xS-0ykSYM.mp3",
                    "music/Freeze-Corleone-667-Welcome-to-the-party-freestyle_MvNbC9xZb-o.mp3",
                    "music/Freeze-Corleone-667-Hors-Ligne_JXYNYzaGIns.mp3",
                    "music/Freeze-Corleone-667-feat-Central-Cee-Polmique_xVjzNyydTfM.mp3",
                    "music/Freeze-Corleone-667-feat-Ashe22-Cartier_NREvaS5qzyE.mp3",
                    "music/Freeze-Corleone-667-feat-Ashe-22-Scell-Part-2_VPRaqAKK5qk.mp3",
                    "music/ASHE-22-SCELLE-PART-3-FEAT-FREEZE-CORLEONE_EYuAnYXl6Xg.mp3",
                    "music/Amine-Farsi-x-Freeze-Corleone-667-FRAUDE-Clip-Officiel_yH2Pz_fCLf4.mp3",
                    "music/ASHE-22-feat-Freeze-Corleone-667-DGRAD_XdkEkbviqHk.mp3"

]

loadSong(randomIndex)

const displayLinkBtn = () => {
    linkBtn.style.display = 'block';
    linkBtn.style.opacity = '1'
}

setTimeout(displayLinkBtn, 4000);

function loadSong(randomIndex) {

    audio.src = musicArray[randomIndex];
}

function playSong() {
    playBtn.querySelector('i.fa-solid').classList.remove('fa-play');
    playBtn.querySelector('i.fa-solid').classList.add('fa-pause');

    audio.play();
}


function pauseSong() {
    playBtn.querySelector('i.fa-solid').classList.remove('fa-pause');
    playBtn.querySelector('i.fa-solid').classList.add('fa-play');

    audio.pause();
}

function prevSong() {
    randomIndex--;
    if(randomIndex < 0 ) {
        randomIndex = musicArray.length-1;

    }
   loadSong(randomIndex)
   playSong()
}

function nextSong() {
    randomIndex++;
    if(randomIndex > musicArray.length-1) {
        randomIndex = 0;

    }
   loadSong(randomIndex);
   playSong()
}


function setVolume (volume) {
    audio.volume = volume;
    console.log(audio.volume);
}

// function updateProgress(e) {
//     const {duration, currentTime} = e.srcElement;
//     const progressPercent = (currentTime/duration)*100;
//     progress.style.width = `${progressPercent}%`

// }

playBtn.addEventListener('click', ()=> {
    console.log(audio.paused)
    if(audio.paused) {

        playSong()
    }
    else {
        pauseSong();
    }
})

prevBtn.addEventListener('click', prevSong);
nextBtn.addEventListener('click', nextSong);
volumeSetter.addEventListener('input', ()=> setVolume(volumeSetter.value))

//-------Now the autowrite text part----------------//
// var i = 0;
// var txt = 'Hi! My Name is Max and this is my Graph Algorithm Project!';
// var speed = 70;

// function typeWriter() {
//   if (i < txt.length) {
//    preText.innerHTML += txt.charAt(i);
//     i++;
//     setTimeout(typeWriter, speed);
//   }
// }

// typeWriter()