-
Notifications
You must be signed in to change notification settings - Fork 51
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #82 from YakeDev/main
Redesign Footer Section
- Loading branch information
Showing
11 changed files
with
253 additions
and
284 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,80 +1,80 @@ | ||
| document.addEventListener("DOMContentLoaded", function () { | ||
| const audioPlayer = document.getElementById("audio-player"); | ||
| const playlistItems = document.querySelectorAll("#playlist li"); | ||
| const playPauseBtn = document.getElementById('playPauseBtn'); // Play/Pause button | ||
| const audioPlayer = document.getElementById("audio-player"); | ||
| const playlistItems = document.querySelectorAll("#playlist li"); | ||
| const playPauseBtn = document.getElementById("playPauseBtn"); // Play/Pause button | ||
|
|
||
| // Playlist functionality: Play the clicked audio | ||
| playlistItems.forEach((item) => { | ||
| item.addEventListener("click", function () { | ||
| const audioSource = this.getAttribute("data-src"); | ||
| audioPlayer.src = audioSource; | ||
| audioPlayer.play(); | ||
| playPauseBtn.classList.remove('play'); // Update the button to pause when playing | ||
| playPauseBtn.classList.add('pause'); | ||
| }); | ||
| // Playlist functionality: Play the clicked audio | ||
| playlistItems.forEach((item) => { | ||
| item.addEventListener("click", function () { | ||
| const audioSource = this.getAttribute("data-src"); | ||
| audioPlayer.src = audioSource; | ||
| audioPlayer.play(); | ||
| playPauseBtn.classList.remove("play"); // Update the button to pause when playing | ||
| playPauseBtn.classList.add("pause"); | ||
| }); | ||
| }); | ||
|
|
||
| // Play/Pause button functionality | ||
| playPauseBtn.addEventListener('click', () => { | ||
| if (audioPlayer.paused) { | ||
| audioPlayer.play(); | ||
| playPauseBtn.classList.remove('play'); | ||
| playPauseBtn.classList.add('pause'); | ||
| } else { | ||
| audioPlayer.pause(); | ||
| playPauseBtn.classList.remove('pause'); | ||
| playPauseBtn.classList.add('play'); | ||
| } | ||
| }); | ||
| // Play/Pause button functionality | ||
| playPauseBtn.addEventListener("click", () => { | ||
| if (audioPlayer.paused) { | ||
| audioPlayer.play(); | ||
| playPauseBtn.classList.remove("play"); | ||
| playPauseBtn.classList.add("pause"); | ||
| } else { | ||
| audioPlayer.pause(); | ||
| playPauseBtn.classList.remove("pause"); | ||
| playPauseBtn.classList.add("play"); | ||
| } | ||
| }); | ||
|
|
||
| // Comment submission functionality | ||
| const commentForm = document.getElementById("comment-form"); | ||
| const commentsList = document.getElementById("comments-list"); | ||
| // Comment submission functionality | ||
| const commentForm = document.getElementById("comment-form"); | ||
| const commentsList = document.getElementById("comments-list"); | ||
|
|
||
| commentForm.addEventListener("submit", function (e) { | ||
| e.preventDefault(); | ||
| commentForm.addEventListener("submit", function (e) { | ||
| e.preventDefault(); | ||
|
|
||
| const username = document.getElementById("username").value; | ||
| const commentText = document.getElementById("comment").value; | ||
| const username = document.getElementById("username").value; | ||
| const commentText = document.getElementById("comment").value; | ||
|
|
||
| if (username && commentText) { | ||
| const commentElement = document.createElement("div"); | ||
| commentElement.classList.add("comment"); | ||
| commentElement.innerHTML = `<strong>${username}:</strong><p>${commentText}</p>`; | ||
| commentsList.appendChild(commentElement); | ||
| if (username && commentText) { | ||
| const commentElement = document.createElement("div"); | ||
| commentElement.classList.add("comment"); | ||
| commentElement.innerHTML = `<strong>${username}:</strong><p>${commentText}</p>`; | ||
| commentsList.appendChild(commentElement); | ||
|
|
||
| // Clear the form | ||
| commentForm.reset(); | ||
| } | ||
| }); | ||
| // Clear the form | ||
| commentForm.reset(); | ||
| } | ||
| }); | ||
|
|
||
| // Page navigation buttons functionality | ||
| const prevBtn = document.getElementById("prev-btn"); | ||
| const nextBtn = document.getElementById("next-btn"); | ||
| // Page navigation buttons functionality | ||
| const prevBtn = document.getElementById("prev-btn"); | ||
| const nextBtn = document.getElementById("next-btn"); | ||
|
|
||
| // Define the pages for navigation | ||
| const pages = ['index.html', 'genres.html', 'about.html']; | ||
| let currentPageIndex = pages.indexOf(window.location.pathname); | ||
| // Define the pages for navigation | ||
| const pages = ["index.html", "genres.html", "about.html"]; | ||
| let currentPageIndex = pages.indexOf(window.location.pathname); | ||
|
|
||
| // Function to navigate to the next page | ||
| function nextPage() { | ||
| if (currentPageIndex < pages.length - 1) { | ||
| currentPageIndex++; | ||
| window.location.href = pages[currentPageIndex]; | ||
| } | ||
| // Function to navigate to the next page | ||
| function nextPage() { | ||
| if (currentPageIndex < pages.length - 1) { | ||
| currentPageIndex++; | ||
| window.location.href = pages[currentPageIndex]; | ||
| } | ||
| } | ||
|
|
||
| // Function to navigate to the previous page | ||
| function prevPage() { | ||
| if (currentPageIndex > 0) { | ||
| currentPageIndex--; | ||
| window.location.href = pages[currentPageIndex]; | ||
| } | ||
| // Function to navigate to the previous page | ||
| function prevPage() { | ||
| if (currentPageIndex > 0) { | ||
| currentPageIndex--; | ||
| window.location.href = pages[currentPageIndex]; | ||
| } | ||
| } | ||
|
|
||
| // Event listener for "Next" button | ||
| if (nextBtn) nextBtn.addEventListener("click", nextPage); | ||
| // Event listener for "Next" button | ||
| if (nextBtn) nextBtn.addEventListener("click", nextPage); | ||
|
|
||
| // Event listener for "Previous" button | ||
| if (prevBtn) prevBtn.addEventListener("click", prevPage); | ||
| // Event listener for "Previous" button | ||
| if (prevBtn) prevBtn.addEventListener("click", prevPage); | ||
| }); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.