Giter Club home page Giter Club logo

queue's Introduction

Queue

Collaborative Priority Queue for Spotify

Welcome to Queue! This app allows multiple users to queue up and play songs from their own Spotify accounts, in a priority queue ordered by votes.

Figma mockup Flutter release app (Room Screen) Flutter release app (Search Screen)

Features

  • Join and create rooms
  • Vote, add and remove songs from the queue
  • Search for songs, artists and albums
  • Play queue on Spotify
  • Play, pause and vote for Skip
  • See the currently playing song and the upcoming track

Tech Stack

  • Flutter: A cross-platform mobile app development framework
  • Firebase: A suite of tools for building mobile and web applications
  • Spotify Web Api: Enables the creation of applications that can interact with Spotify's streaming service, such as retrieving content metadata, getting recommendations, creating and managing playlists, or controlling playback.

Architecture

Challenges

Buildng this project I came across three significant challenges that I'd like to address.

  1. Flutter Background Task Limitations: One major hurdle was the immature and buggy state of Flutter background tasks. Specifically, while using Workmanager – the official package for managing background tasks – I found it lacking in crucial features. Notably, there was no straightforward way to access the task's current state or its resulting output. This absence of information made it difficult to ensure the proper functioning of the app's features.

  2. Battery Optimization Impact: In the current landscape of smartphones, battery optimization is a prevalent concern. Modern phones tend to optimize battery usage aggressively, which can inadvertently lead to background tasks being prematurely suspended and later resumed. Consequently, this behavior negatively affected the reliability of the app's functionality. This was particularly problematic because the background task is responsible for monitoring changes in the queue and player state, and subsequently taking appropriate actions.

  3. Lack of Official Spotify SDK for Flutter: The absence of an official Spotify SDK for Flutter emerged as a significant obstacle, compelling me to delve into community solutions and innovative workarounds. While certain features were addressed through minimal.me's Spotify SDK, I had to turn to the Spotify Web API for pending functionalities.

While working on the project, these challenges presented notable obstacles. Finding solutions or workarounds for these limitations became imperative to ensure the app's performance and reliability. The lack of access to task state and result, coupled with battery optimization concerns, prompted me to explore alternative approaches to address these issues effectively.

Alternative

To deal with the underwhelming performance of the background task and the limitations of the third-party Spotify SDK, I came up with a different plan. Instead of sticking to on-device background tasks to watch over the queue and player status, I decided to take things to the cloud. I set up cloud functions that kick in whenever there's a change in player state or the queue. When a user wants to press play, they hook up with Spotify, and their authorization token gets sent over to the functions. These functions then step in and use Spotify's web API to handle the playing.

Unfortunately, the lack of hooks for Spotify's player state leaves no other option apart from periodic calls, making this alternative extremely expensive as the frecuency required is rather high. Based on rough calculations, Firestore free-tier could only support 40 rooms playing all month long.

If sometime in the future spotify makes hooks available, this new approach may turn out to be way more reliable and smooth, keeping the music flowing seamlessly.

image

Final thoughts

Taking on the challenge of building this app was fueled by the excitement of exploring a concept that was missing from Spotify's native features. I saw the potential for something big here, especially for parties and events. Imagine a scenario where everyone gets to have a say in the music – it's like a DJ-ing democracy! People can suggest songs, and everyone else can vote for their favorites. The DJ then takes these votes as cues for what to play.

But why stop there? This concept could be a game-changer in other places too, like at the gym. Picture this: a shared playlist where anyone can add their jam, making those workout sessions way more fun. It's all about music that everyone vibes with.

So, the bottom line is, I saw a gap in how music was being shared and enjoyed, and I wanted to fill it with something interactive and communal. The potential to create a platform that caters to both personal and group preferences is what got me excited about diving into this project!

Contribute

We welcome contributions! If you have an idea for a new feature or have found a bug, please don't hestitate opening an issue or submiting a pull request.

License

The Collaborative Priority Queue for Spotify is licensed under the MIT License.

queue's People

Contributors

ignaciosica avatar

Watchers

 avatar  avatar

queue's Issues

Background process

  • adds songs to queue when current song has 10 seconds left
  • removes song from query when is played
  • skips if votes are achieved

Refactor Now Playing

  • Implement new design
  • Improve widget reliability
  • Fix inner padding
  • Progress indicator updates automatically
  • While loading, display dummy widget
  • While loading, progress indicator displays loading state
  • Show reconnect button to manually reconnect if connection is lost
  • Connect to spotify on widget init

Upload to playstore

  • Test app for new bugs
  • Create developer account in playstore
  • Upload Queue v1.0!!

Bugs

  • back button in room appbar doesn´t ask for confirmation
  • background process fails after a while
  • remove debug flag in bakground process
  • search fails sometimes (investigate) (Instance of QueryFailure)

Refactor

  • start of background process
  • fix now playing widget reliablity
  • remove user from users list when he leaves room
  • app start without login
  • add skip to background task
  • change player if current player leaves room
  • fix nowplayingfirestore display when there is now valid player_state
  • persist user current room
  • logout
  • fix bug when nested pushes of navigation
  • manage empty queue on background task
  • play pause functionality
  • investigate search bug (guess happens when token has expired)
  • fix image issue
  • stop adding played song to history
  • unify now playing
  • fix delay in updating now playing song
  • bug freeze on flutter logo on app start
  • remove back navigation on room page
  • animate playpause button to state
  • enable reconnect in nowplaying if app is not active
  • make search more firebase query efficient
  • add dotenv

Optional

  • history of joined rooms
  • suggestions tile
  • song history

Cold boot feels slow and laggy

When the app is coold booted, it not only feels laggy but spends near to 4 seconds in lobby screen before redirecting to room screen.

Add Firebase auth

Description

Add firebase authentication to flutter app. Use dotenv package to manage credentials.

Requirements

  • Use dotenv package to manage credentials
  • User can login with google
  • User can logout
  • Once user logs in, account information is saved for future uses

Opening room screen throws multiple exceptions

While room screen is loading, multiple exceptions are thrown as the ui tries to render streams of documents that are waiting.

Detailed Description

Expected Behavior

Current Behavior

Possible Solution

Build different widgets based on stream state. If the stream is waiting or connecting, display a dummy widget. Only if it has data display the corresponding widget.

Steps to Reproduce

  1. Open app
  2. Join or create a room
  3. Wait for redirection to room screen

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.