audio.js

// Get all love icons and add event listeners
const loveIcons = document.querySelectorAll('.love-icon');

loveIcons.forEach(loveIcon => {
    loveIcon.addEventListener('click', togglePlaylist);
});

function togglePlaylist(event) {
    const clickedIcon = event.target;
    const songCard = clickedIcon.closest('.movie');
    const audioSource = songCard.querySelector('.song-audio source').getAttribute('src');
    const loveIcon = songCard.querySelector('.love-icon');

    if (!songCard.classList.contains('song-added')) {
        // Add the song to the playlist
        addToPlaylist(songCard, audioSource);

        // Change the color of the love icon to indicate it's selected
        loveIcon.classList.add('selected');
        songCard.classList.add('song-added');
    } else {
        // Remove the song from the playlist
        removeFromPlaylist(songCard);

        // Change the color of the love icon back to its original color
        loveIcon.classList.remove('selected');
        songCard.classList.remove('song-added');
    }
}

function addToPlaylist(songCard, audioSource) {
    // Create elements for the new song in the playlist
    const playlist = document.querySelector('.playlist');

    const newSongDiv = document.createElement('div');
    newSongDiv.classList.add('song1');

    const newAudio = document.createElement('audio');
    newAudio.setAttribute('controls', '');

    const audioSourceElem = document.createElement('source');
    audioSourceElem.setAttribute('src', audioSource);
    audioSourceElem.setAttribute('type', 'audio/mpeg');

    newAudio.appendChild(audioSourceElem);
    newSongDiv.appendChild(newAudio);

    // Add the new song to the playlist
    playlist.appendChild(newSongDiv);
}

function removeFromPlaylist(songCard) {
    const playlist = document.querySelector('.playlist');
    const songEntry = playlist.querySelector('.song1');

    // Remove the song from the playlist
    if (songEntry) {
        playlist.removeChild(songEntry);
    }
}






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');
        });
    });
});