onQueue

My Final Project

onQueue: onqueueplayer.web.app

Demo Link

https://www.youtube.com/watch?v=uQor8VXAzY8

Link to Code

purdueapp / onQueue

Room State

{
  trackWindow: {
    currentTrack: <SpotifyTrack>,
    nextTracks: [<SpotifyTrack>, <SpotifyTrack>, ...],
    previousTracks: [<SpotifyTrack>, <SpotifyTrack>, ...]
  },
  duration: 0,
  position: 0,
  volume: 0.5,
  paused: false,
  members: [<User>, <User>, ...],
  host: <SpotifyUser>
}

User

{
  displayName: 'John Doe',
  role: 'Admin',
  id: 'asdfaskdjkljs',
}

Host Redux State

{
  spotify: {
    player: <SpotifyWebPlayer>,
    trackWindow: {
      nextTracks: [],
      previousTracks: [],
      currentTrack: initialCurrentTrack,
    },
    tokens: {
      accessToken: <AuthAccessToken>,
      refreshToken: <AuthRefreshToken>,
    },
    api: <OpenSourceSpotifyApi>,
    playbackState: <SpotifyWebPlaybackState>
  },
  roomState: <RoomState>
 }

View on GitHub

How I built it

• ReactJS
• Spotify Web Playback SDK
• SocketIO
• NodeJS

Additional Thoughts / Feelings / Stories

Spotify recently came out with a group session feature which has made our application completely useless. 🙃

[Final Note]: It was a good learning experience