Spaces:
Running
Running
JAYASWAROOP
commited on
Commit
•
0d0d7d2
1
Parent(s):
0b5b1d5
Update audio.js
Browse files
audio.js
CHANGED
@@ -1,41 +1,40 @@
|
|
1 |
-
|
|
|
2 |
|
3 |
-
|
4 |
-
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
5 |
|
6 |
-
if (!
|
7 |
// Add the song to the playlist
|
8 |
-
addToPlaylist();
|
9 |
|
10 |
// Change the color of the love icon to indicate it's selected
|
11 |
loveIcon.classList.add('selected');
|
|
|
12 |
} else {
|
13 |
// Remove the song from the playlist
|
14 |
-
removeFromPlaylist();
|
15 |
|
16 |
// Change the color of the love icon back to its original color
|
17 |
loveIcon.classList.remove('selected');
|
|
|
18 |
}
|
19 |
}
|
20 |
|
21 |
-
function addToPlaylist() {
|
22 |
-
// Get information about the song
|
23 |
-
const songTitle = document.querySelector('.title').innerText;
|
24 |
-
const artist = 'Singer Name'; // You can replace this with the actual artist name
|
25 |
-
const audioSource = document.querySelector('#audio source').getAttribute('src');
|
26 |
-
|
27 |
// Create elements for the new song in the playlist
|
28 |
const playlist = document.querySelector('.playlist');
|
29 |
|
30 |
const newSongDiv = document.createElement('div');
|
31 |
newSongDiv.classList.add('song1');
|
32 |
|
33 |
-
const newSongTitle = document.createElement('h3');
|
34 |
-
newSongTitle.textContent = songTitle;
|
35 |
-
|
36 |
-
const newArtist = document.createElement('p');
|
37 |
-
newArtist.textContent = `Artist: ${artist}`;
|
38 |
-
|
39 |
const newAudio = document.createElement('audio');
|
40 |
newAudio.setAttribute('controls', '');
|
41 |
|
@@ -44,25 +43,19 @@ function addToPlaylist() {
|
|
44 |
audioSourceElem.setAttribute('type', 'audio/mpeg');
|
45 |
|
46 |
newAudio.appendChild(audioSourceElem);
|
47 |
-
|
48 |
-
newSongDiv.appendChild(newSongTitle);
|
49 |
-
newSongDiv.appendChild(newArtist);
|
50 |
newSongDiv.appendChild(newAudio);
|
51 |
|
52 |
// Add the new song to the playlist
|
53 |
playlist.appendChild(newSongDiv);
|
54 |
-
|
55 |
-
songAdded = true; // Set the flag to true after adding the song
|
56 |
}
|
57 |
|
58 |
-
function removeFromPlaylist() {
|
59 |
const playlist = document.querySelector('.playlist');
|
60 |
const songEntry = playlist.querySelector('.song1');
|
61 |
|
62 |
// Remove the song from the playlist
|
63 |
if (songEntry) {
|
64 |
playlist.removeChild(songEntry);
|
65 |
-
songAdded = false; // Set the flag to false after removing the song
|
66 |
}
|
67 |
}
|
68 |
|
|
|
1 |
+
// Get all love icons and add event listeners
|
2 |
+
const loveIcons = document.querySelectorAll('.love-icon');
|
3 |
|
4 |
+
loveIcons.forEach(loveIcon => {
|
5 |
+
loveIcon.addEventListener('click', togglePlaylist);
|
6 |
+
});
|
7 |
+
|
8 |
+
function togglePlaylist(event) {
|
9 |
+
const clickedIcon = event.target;
|
10 |
+
const songCard = clickedIcon.closest('.movie');
|
11 |
+
const audioSource = songCard.querySelector('.song-audio source').getAttribute('src');
|
12 |
+
const loveIcon = songCard.querySelector('.love-icon');
|
13 |
|
14 |
+
if (!songCard.classList.contains('song-added')) {
|
15 |
// Add the song to the playlist
|
16 |
+
addToPlaylist(songCard, audioSource);
|
17 |
|
18 |
// Change the color of the love icon to indicate it's selected
|
19 |
loveIcon.classList.add('selected');
|
20 |
+
songCard.classList.add('song-added');
|
21 |
} else {
|
22 |
// Remove the song from the playlist
|
23 |
+
removeFromPlaylist(songCard);
|
24 |
|
25 |
// Change the color of the love icon back to its original color
|
26 |
loveIcon.classList.remove('selected');
|
27 |
+
songCard.classList.remove('song-added');
|
28 |
}
|
29 |
}
|
30 |
|
31 |
+
function addToPlaylist(songCard, audioSource) {
|
|
|
|
|
|
|
|
|
|
|
32 |
// Create elements for the new song in the playlist
|
33 |
const playlist = document.querySelector('.playlist');
|
34 |
|
35 |
const newSongDiv = document.createElement('div');
|
36 |
newSongDiv.classList.add('song1');
|
37 |
|
|
|
|
|
|
|
|
|
|
|
|
|
38 |
const newAudio = document.createElement('audio');
|
39 |
newAudio.setAttribute('controls', '');
|
40 |
|
|
|
43 |
audioSourceElem.setAttribute('type', 'audio/mpeg');
|
44 |
|
45 |
newAudio.appendChild(audioSourceElem);
|
|
|
|
|
|
|
46 |
newSongDiv.appendChild(newAudio);
|
47 |
|
48 |
// Add the new song to the playlist
|
49 |
playlist.appendChild(newSongDiv);
|
|
|
|
|
50 |
}
|
51 |
|
52 |
+
function removeFromPlaylist(songCard) {
|
53 |
const playlist = document.querySelector('.playlist');
|
54 |
const songEntry = playlist.querySelector('.song1');
|
55 |
|
56 |
// Remove the song from the playlist
|
57 |
if (songEntry) {
|
58 |
playlist.removeChild(songEntry);
|
|
|
59 |
}
|
60 |
}
|
61 |
|