Learn Basic String and Array Methods by Building a Music Player - My thanks & some suggestions

JavaScript
1

Hello all,

many thanks for existing and providing this opportunity to learn web development! :raised_hands:
I just finished the music player project and have some suggestions for improving the curriculum (hope this is not the wrong place to post this):

  1. Step 84 says as one of the aims of the delete method that we intend to implement a functionality for the player to play the next song (if it is existing) when the currently playing song is being deleted. But somehow the finished delete method doesn’t reflect this. The song is being deleted and stopped. Also visually the player is adjusted. But the next song isn’t playing. To make this happen I could manage to code those lines by modifying the first if statement:
if (userData?.currentSong?.id === id) {
    
    if(userData?.songs.length > 1) {
      playNextSong();
    } else {
      userData.currentSong = null;
     userData.songCurrentTime = 0;
     pauseSong();
    }
    setPlayerDisplay();
  }

  1. The finished playNextSong method throws an error (TypeError: nextSong is undefined) when there is no next song anymore. To fix this I could manage to code the lines below:

    • If the end of the playlist is reached, to continue from the first song again by modifying the else statement:
else {
    playSong(userData?.songs[getCurrentSongIndex() + 1 < 
	userData?.songs.length ? getCurrentSongIndex() + 1 : 0]
	.id);
     }
  • Or just return if nothing should happen via an additional if statement
    to the existing code, to prevent an error from being thrown
else {
    const currentSongIndex = getCurrentSongIndex();
    const nextSong = userData?.songs[currentSongIndex + 1];

    if (getCurrentSongIndex() + 1 >= userData?.songs.length) return;

    playSong(nextSong.id);
  }
  1. Similar to playNextSong method the finished playPreviousSong throws an error (TypeError: previousSong is undefined) when currently the first song is being played thus there cannot be a previous song. To fix this I could manage to code the lines below by replacing the current else statement by two more else if statements:
  • If nothing should happen while the first song is being played:
else if (getCurrentSongIndex() > 0) {
    playSong(userData?.songs[getCurrentSongIndex() - 1].id);
  }
  • and if the first song should start from the beginning, additionally:
else if(getCurrentSongIndex() === 0) {
    playSong(userData?.songs[0].id);
  }

Please let me also know your thoughts. Many thanks in advance!

2

can you open an issue with this feedback please?

1 Like