@Hiral_Khakhariya @drishtinayak2828-TA
Music App: https://musicapp.jhansi23398.repl.co/
let songs = [
{
img: 'https://img.republicworld.com/republic-prod/stories/promolarge/xhdpi/jsnxtuy0c8zxb2bd_1623407433.jpeg',
artistName: 'Dua Lipa',
songName: 'Love Again',
song: 'Dua Lipa - Love Again.mp3',
},
{
img: 'https://www.billboard.com/wp-content/uploads/2023/01/rema-selena-gomez-cr-courtesy-of-rema-2022-billboard-1548.jpg',
artistName: 'Rema, Selena Gomez',
songName: 'Calm Down',
song: 'Rema, Selena Gomez - Calm Down.mp3',
},
{
img: 'https://imgix.bustle.com/nylon/18431512/origin.png?w=1200&h=630&fit=crop&crop=faces&fm=jpg',
artistName: 'Dua Lipa',
songName: 'New Rules',
song: 'Dua Lipa - New Rules.mp3',
},
{
img: 'https://i.ytimg.com/vi/H7_yY3yr-jE/maxresdefault.jpg',
artistName: 'GARRY SANDHU -JASMINE SANDLAS',
songName: 'ILLEGAL WEAPON',
song: 'ILLEGAL WEAPON _ GARRY SANDHU -JASMINE SANDLAS.mp3',
},
];
let mainEle = document.getElementsByTagName('main')[0];
let musicInfo = document.getElementById('musicData');
let songFun = document.getElementById('musicFun');
let songsNum = 1;
let songNumValue = songs[0];
console.log(songNumValue);
for (let songData in songNumValue) {
if (songData === 'img') {
let imgEle = document.createElement('img');
imgEle.src = songNumValue[songData];
musicInfo.appendChild(imgEle);
}
else if (songData === 'artistName') {
let h2Ele = document.createElement('h2');
h2Ele.innerText = songNumValue[songData];
musicInfo.appendChild(h2Ele);
}
else if (songData === 'songName') {
let pEle = document.createElement('p');
pEle.style.color = 'white';
pEle.innerText = songNumValue[songData];
musicInfo.appendChild(pEle);
}
else if (songData == 'song') {
let audioEle = document.createElement('audio');
audioEle.src = songNumValue[songData];
songFun.appendChild(audioEle);
}
}
function forwardSong() {
for (let songData in songs[songsNum]) {
if (songData === 'img') {
let getImgEle = document.getElementsByTagName('img')[0];
getImgEle.src = songs[songsNum][songData];
}
else if (songData === 'artistName') {
let getH2Ele = document.getElementsByTagName('h2')[0];
getH2Ele.innerText = songs[songsNum][songData];
}
else if (songData === 'songName') {
let getpEle = document.getElementsByTagName('p')[0];
getpEle.innerText = songs[songsNum][songData];
}
else if (songData === 'song') {
let getAudioEle = document.getElementsByTagName('audio')[0];
getAudioEle.src = songs[songsNum][songData];
getAudioEle.play();
}
}
songsNum = (songsNum + 1)%songs.length;
}
function backwardSong() {
for (let songData in songs[songsNum]) {
if (songData === 'img') {
let getImgEle = document.getElementsByTagName('img')[0];
getImgEle.src = songs[songsNum][songData];
}
else if (songData === 'artistName') {
let getH2Ele = document.getElementsByTagName('h2')[0];
getH2Ele.innerText = songs[songsNum][songData];
}
else if (songData === 'songName') {
let getpEle = document.getElementsByTagName('p')[0];
getpEle.innerText = songs[songsNum][songData];
}
else if (songData === 'song') {
let getAudioEle = document.getElementsByTagName('audio')[0];
getAudioEle.src = songs[songsNum][songData];
getAudioEle.play();
}
}
songsNum = (songsNum - 1)%songs.length;
}
let playS = document.getElementById('playSongBtn');
let pauseS = document.getElementById('pauseSongBtn');
let audioEle = document.getElementsByTagName('audio')[0];
playS.onclick = function () {
audioEle.play();
playS.style.display = 'none';
pauseS.style.display = 'block';
}
pauseS.onclick = function () {
audioEle.pause();
playS.style.display = 'block';
pauseS.style.display = 'none';
}
