Spaces:
Running
Running
// Get all the add-to-playlist buttons | |
const addToPlaylistButtons = document.querySelectorAll('.add-to-playlist'); | |
// Add event listener to each button | |
addToPlaylistButtons.forEach(button => { | |
button.addEventListener('click', function() { | |
// Get the song details | |
const songCard = this.closest('.movie'); | |
const songTitle = songCard.querySelector('.title').textContent; | |
const songDescription = songCard.querySelector('.description').textContent; | |
const songSrc = songCard.querySelector('source').getAttribute('src'); | |
// Create a new list item element | |
const newSongItem = document.createElement('li'); | |
newSongItem.classList.add('song-item', 'row'); | |
// Create the song item content | |
const songItemContent = ` | |
<div class="song-details col-10 col-md-11"> | |
<p class="song-title">${songTitle}</p> | |
<p class="song-artist">${songDescription}</p> | |
</div> | |
`; | |
// Set the content of the new list item | |
newSongItem.innerHTML = songItemContent; | |
// Append the new song item to the playlist | |
const playlist = document.querySelector('.song-list'); | |
playlist.appendChild(newSongItem); | |
// Update the audio source and display the audio player | |
const audioPlayer = document.querySelector('#audio'); | |
audioPlayer.querySelector('source').setAttribute('src', songSrc); | |
audioPlayer.classList.remove('d-none'); | |
}); | |
}); | |
function validateSignup() { | |
var username = document.forms["signupForm"]["username"].value; | |
var password = document.forms["signupForm"]["password"].value; | |
var email = document.forms["signupForm"]["email"].value; | |
if (username === "" || password === "" || email === "") { | |
alert("Please enter all the required fields"); | |
return false; | |
} | |
var existingUsernames = ['user1', 'user2', 'user3']; | |
if (existingUsernames.includes(username)) { | |
alert("Username already exists. Please choose a different username"); | |
return false; | |
} | |
var existingEmails = ['user1@example.com', 'user2@example.com', 'user3@example.com']; | |
if (existingEmails.includes(email)) { | |
alert("Email already exists. Please enter a different email address"); | |
return false; | |
} | |
// If all validations pass, you can proceed with submitting the form | |
return true; | |
} | |
function validateLogin() { | |
var username = document.forms["loginForm"]["username"].value; | |
var password = document.forms["loginForm"]["password"].value; | |
if (username === "" || password === "") { | |
alert("Please enter both username and password"); | |
return false; | |
} | |
// Your login validation logic goes here | |
// For example: | |
if (username !== "admin" || password !== "password") { | |
alert("Incorrect username or password"); | |
return false; | |
} | |
return true; | |
} | |
document.addEventListener('DOMContentLoaded', function () { | |
const searchBar = document.getElementById('searchBar'); | |
const movieContainers = document.querySelectorAll('.movie'); | |
searchBar.addEventListener('input', function () { | |
const searchText = searchBar.value.toLowerCase().trim(); | |
movieContainers.forEach(function (container) { | |
const title = container.querySelector('.title').textContent.toLowerCase(); | |
const description = container.querySelector('.description').textContent.toLowerCase(); | |
if (title.includes(searchText) || description.includes(searchText)) { | |
container.style.display = 'block'; | |
} else { | |
container.style.display = 'none'; | |
} | |
}); | |
}); | |
movieContainers.forEach(function (container) { | |
container.addEventListener('click', function () { | |
const audio = this.querySelector('audio'); | |
movieContainers.forEach(function (otherContainer) { | |
const otherAudio = otherContainer.querySelector('audio'); | |
if (otherAudio !== audio && !otherAudio.paused) { | |
otherAudio.pause(); | |
otherAudio.classList.add('d-none'); | |
} | |
}); | |
if (audio.paused) { | |
audio.play(); | |
} else { | |
audio.pause(); | |
} | |
audio.classList.toggle('d-none'); | |
}); | |
}); | |
}); | |