[PR #294] [MERGED] Experimental audio visualiser #744

New issue

Closed

opened 2026-02-28 14:53:12 +03:00 by kerem · 0 comments

kerem commented

2026-02-28 14:53:12 +03:00

Owner

📋 Pull Request Information

Original PR: https://github.com/Rigellute/spotify-tui/pull/294
Author: @Rigellute
Created: 2/13/2020
Status: ✅ Merged
Merged: 2/17/2020
Merged by: @Rigellute

Base: master ← Head: wip-visualiser

📝 Commits (9)

3ddc4c9 WIP music visualizer
dd3c0b6 Animate bar chart
c785bff Improve visualisation and add analysis section
5ad2d5d Make tick rate configurable
a9eec8c Add audio analysis view to help docs
79679bc Add tick_rate option to cli
e2888ad Move audio_analysis ui to own file
fb29752 Add tick-rate to behavior config
49b4d59 Make bars fit

📊 Changes

11 files changed (+203 additions, -5 deletions)

View changed files

📝 README.md (+2 -0)
📝 src/app.rs (+23 -0)
📝 src/event/events.rs (+5 -2)
➕ src/handlers/analysis.rs (+7 -0)
📝 src/handlers/common_key_events.rs (+1 -0)
📝 src/handlers/mod.rs (+7 -0)
📝 src/main.rs (+22 -3)
➕ src/ui/audio_analysis.rs (+118 -0)
📝 src/ui/help.rs (+1 -0)
📝 src/ui/mod.rs (+2 -0)
📝 src/user_config.rs (+15 -0)

📄 Description

The spotify API has a audio analysis endpoint for a given track.

This is an experimental attempt to use that data to "visualise" a track using a bar chart.

Gif demo

Image

How does this work?

This is very basic but the visualisation is based on the "pitch" information for a given "section" of the piece. To make things more animated, in between the section data I create an offset and subtract from the pitch information based on the current beat.

You can now also configure the tick_rate of the app. The lower this number the smoother the animations are. But this comes at a cost of higher CPU usage!

TODO

Add v binding to go to visualisation screen
Make tick_rate configurable via cli arg and config.yml
Add colors for visualisation to user theme config

_{🔄 This issue represents a GitHub Pull Request. It cannot be merged through Gitea due to API limitations.}

## 📋 Pull Request Information **Original PR:** https://github.com/Rigellute/spotify-tui/pull/294 **Author:** [@Rigellute](https://github.com/Rigellute) **Created:** 2/13/2020 **Status:** ✅ Merged **Merged:** 2/17/2020 **Merged by:** [@Rigellute](https://github.com/Rigellute) **Base:** `master` ← **Head:** `wip-visualiser` --- ### 📝 Commits (9) - [`3ddc4c9`](https://github.com/Rigellute/spotify-tui/commit/3ddc4c97cc12cf89a72cea229966ab9ccfd159ee) WIP music visualizer - [`dd3c0b6`](https://github.com/Rigellute/spotify-tui/commit/dd3c0b66c24125d1dbae08b154c0aa8fdd8767dc) Animate bar chart - [`c785bff`](https://github.com/Rigellute/spotify-tui/commit/c785bff7d126a9dadff7f2d149c838e06fa02908) Improve visualisation and add analysis section - [`5ad2d5d`](https://github.com/Rigellute/spotify-tui/commit/5ad2d5de024876582a60ccd5f29a95638e23a04d) Make tick rate configurable - [`a9eec8c`](https://github.com/Rigellute/spotify-tui/commit/a9eec8c5c9cda20e9a955d3e2657657f3e0f7f5a) Add audio analysis view to help docs - [`79679bc`](https://github.com/Rigellute/spotify-tui/commit/79679bc7e4a92131ba8876d5a0e841ff8678b9f8) Add tick_rate option to cli - [`e2888ad`](https://github.com/Rigellute/spotify-tui/commit/e2888ad67d27f9fa22055f91851e81b33655ef4c) Move audio_analysis ui to own file - [`fb29752`](https://github.com/Rigellute/spotify-tui/commit/fb2975227edfbfa33ea61fa91758c1fc987b5a81) Add tick-rate to behavior config - [`49b4d59`](https://github.com/Rigellute/spotify-tui/commit/49b4d598a86eedcaad2489e317c2c03887bdb6b8) Make bars fit ### 📊 Changes **11 files changed** (+203 additions, -5 deletions) <details> <summary>View changed files</summary> 📝 `README.md` (+2 -0) 📝 `src/app.rs` (+23 -0) 📝 `src/event/events.rs` (+5 -2) ➕ `src/handlers/analysis.rs` (+7 -0) 📝 `src/handlers/common_key_events.rs` (+1 -0) 📝 `src/handlers/mod.rs` (+7 -0) 📝 `src/main.rs` (+22 -3) ➕ `src/ui/audio_analysis.rs` (+118 -0) 📝 `src/ui/help.rs` (+1 -0) 📝 `src/ui/mod.rs` (+2 -0) 📝 `src/user_config.rs` (+15 -0) </details> ### 📄 Description The spotify API has a [audio analysis endpoint](https://developer.spotify.com/documentation/web-api/reference/tracks/get-audio-analysis/) for a given track. This is an experimental attempt to use that data to "visualise" a track using a bar chart. ### Gif demo ![spotify-tui-visualisation](https://user-images.githubusercontent.com/12150276/74425718-0b29ef00-4e4c-11ea-8786-57358a672307.gif) ### Image <img width="1680" alt="Screenshot 2020-02-12 at 18 52 32" src="https://user-images.githubusercontent.com/12150276/74371269-6ae2b480-4dd0-11ea-8764-a8b2a2943db9.png"> ## How does this work? This is very basic but the visualisation is based on the "pitch" information for a given "section" of the piece. To make things more animated, in between the section data I create an offset and subtract from the pitch information based on the current beat. You can now also configure the `tick_rate` of the app. The lower this number the smoother the animations are. But this comes at a cost of higher CPU usage! ## TODO - [x] Add `v` binding to go to visualisation screen - [x] Make `tick_rate` configurable via cli arg and config.yml - [x] Add colors for visualisation to user theme config --- <sub>🔄 This issue represents a GitHub Pull Request. It cannot be merged through Gitea due to API limitations.</sub>