Spaces:
Running
Running
document.addEventListener('DOMContentLoaded', function () { | |
const searchBar = document.getElementById('searchBar'); | |
const songNames = document.querySelectorAll('h1[style="font-size: 28px;"]'); | |
const descriptions = document.querySelectorAll('p[style="font-size: 20px;"]'); | |
const songContainers = document.querySelectorAll('.movie'); | |
songContainers.forEach(function (container) { | |
container.addEventListener('click', function () { | |
const audio = this.querySelector('audio'); | |
// Pause all other audio elements except the one clicked | |
songContainers.forEach(function (otherContainer) { | |
const otherAudio = otherContainer.querySelector('audio'); | |
if (otherAudio !== audio && !otherAudio.paused) { | |
otherAudio.pause(); | |
otherAudio.classList.add('d-none'); // Hide other audio elements | |
} | |
}); | |
audio.classList.toggle('d-none'); | |
if (audio.paused) { | |
audio.play(); | |
} else { | |
audio.pause(); | |
} | |
}); | |
}); | |
searchBar.addEventListener('input', function() { | |
const searchText = searchBar.value.toLowerCase(); | |
songNames.forEach((song, index) => { | |
const songName = song.textContent.toLowerCase(); | |
const description = descriptions[index].textContent.toLowerCase(); | |
if (songName.includes(searchText) || description.includes(searchText)) { | |
song.parentElement.parentElement.style.display = 'block'; | |
} else { | |
song.parentElement.parentElement.style.display = 'none'; | |
} | |
}); | |
}); | |
}); |