valonsogit / spotify-visualizer

My Spotify Visualizer rewritten in TypeScript

🎵 Spotify Visualizer 🎵

This is a rewritten version in TypeScript of my previous Spotify Visualizer, originally written in pure JavaScript.

Note: This is an underway project (Check TODOs)

_{Original project inspired from here.}

Table of Contents

1. About the project and goals
2. Features
3. Getting Started
• Prerequisites
• Dependencies
• Usage
4. TODOs
5. License

About the project and goals

The goal of this project is to provide a centralized, modular and expandable spotify visualizer.

The API processing is delegated to a central server while multiple custom visualizers can visualize the song interpretation as they see fit (e.g. a ws2812b LED strip connected to a Raspberry Pi, a web page that changes the background color accordingly, etc.)

There would also be a WebApp where parameters and color schemes can be changed for each individual visualizer connected to the server.

Also looking forward to adding HUE support in a future.

Features

• Spotify API token refresh on each individual session
• A simple webapp for token authorization flow in spotify
• A backend for the Spotify API processing in nodejs
• Song Beat and Section synchronization
• Beat and Section confidence filtering
  
  

Getting Started

Prerequisites

• Spotify account
• node
  • npm (node packet manager)
    
    

Dependencies

Install all node dependencies executing this in the root directory

npm install

Then create a .env in the root folder with the following keys:

CLIENT_ID=
CLIENT_SECRET=

And fill the values with your spotify client ID and Secret

You can get them here, creating an app and copying the client ID and Client Secret from the page

Usage

The server can be executed with:

npm start

Or compiled with:

tsc

TODOs

• Implement color cycling
• Implement token refresh in mid-playback
• Optimize beat steps to omit the beats lower that then confidence threshold
• Implement socket communication
• Standardize the message exchanges from server to visualizers
• Add support for multiple visualizers
• Make the webapp for parameters tweaking
• Figure out a way to delegate the song interpretation to the server
• Code clean-up (duh)

License

GPL-3.0-or-later