[FEAT] make queue and album panes scrollable

Author: nots1dd

include/inlimbo/frontend/ftxui/ui/screens/Main.hpp

@@ -18,14 +18,17 @@ class MainScreen
 
   void attachAudioService(audio::Service& audio) { m_audioPtr = &audio; }
 
+  ftxui::Component container;
+
 private:
   state::library::LibraryState& m_state;
   audio::Service*               m_audioPtr;
 
   ftxui::Component artist_menu;
   ftxui::Component album_content;
-  ftxui::Component album_scroller;
-  ftxui::Component container;
+  ftxui::Component album_view;
+  float            album_scroll;
+  float            album_scroll_target = 0.0f;
   ftxui::Component root_renderer;
 
   bool focus_on_artists{true};

include/inlimbo/frontend/ftxui/ui/screens/Queue.hpp

@@ -23,8 +23,12 @@ class QueueScreen
   state::queue::QueueState& m_state;
 
   ftxui::Component queue_content;
+  ftxui::Component queue_view;
   ftxui::Component meta_content;
   ftxui::Component container;
+
+  float queue_scroll        = 0.0f;
+  float queue_scroll_target = 0.0f;
 };
 
 } // namespace frontend::tui::ui::screens

src/frontend/ftxui/state/library/Impl.cc

@@ -60,7 +60,7 @@ void LibraryState::buildAlbumViewForArtist(const Artist& artist)
   query::songmap::read::forEachSongInArtist(
     *m_songMapTS, artist,
     [&](const Album& album, const Disc disc, const Track track, const ino_t,
-        const std::shared_ptr<Song>& song)
+        const std::shared_ptr<Song>& song) -> void
     {
       if (album != current_album)
       {

src/frontend/ftxui/ui/screens/Main.cc

@@ -1,5 +1,4 @@
 #include "frontend/ftxui/ui/screens/Main.hpp"
-#include "frontend/ftxui/components/scroll/Scrollable.hpp"
 #include "frontend/ftxui/state/library/Impl.hpp"
 
 using namespace ftxui;
@@ -12,20 +11,43 @@ MainScreen::MainScreen(state::library::LibraryState& state) : m_state(state)
   artist_menu = Menu(&m_state.artists, &m_state.selected_artist) | vscroll_indicator;
 
   album_content =
-    Renderer([&]() mutable -> Element { return vbox(m_state.returnAlbumElements()); });
+    Renderer([&]() -> Element { return vbox(m_state.returnAlbumElements()) | vscroll_indicator; });
 
-  album_scroller =
-    Scroller(album_content, &m_state.selected_album_index, Color::Green, Color::GrayDark);
+  album_scroll        = 0.0f;
+  album_scroll_target = 0.0f;
 
-  container = Container::Horizontal({artist_menu, album_scroller});
+  album_view = Renderer(album_content,
+                        [&]() -> Element
+                        {
+                          const auto& elems = m_state.returnAlbumElements();
+
+                          if (!elems.empty())
+                          {
+                            album_scroll_target = float(m_state.selected_album_index) /
+                                                  float(std::max<int>(1, elems.size() - 1));
+                          }
+
+                          constexpr float smoothing = 0.15f; // 0.1 = slow, 0.25 = fast
+                          album_scroll += (album_scroll_target - album_scroll) * smoothing;
+
+                          album_scroll = std::clamp(album_scroll, 0.0f, 1.0f);
+
+                          return album_content->Render() |
+                                 focusPositionRelative(0.0f, album_scroll) | frame | flex;
+                        });
+
+  container = Container::Horizontal({
+    artist_menu,
+    album_view,
+  });
 }
 
 void MainScreen::syncFocus()
 {
   if (m_state.focusOnArtists())
     artist_menu->TakeFocus();
   else
-    album_scroller->TakeFocus();
+    album_view->TakeFocus();
 }
 
 auto MainScreen::component() -> Component { return container; }
@@ -51,7 +73,7 @@ auto MainScreen::render() -> Element
   auto artist_inner = window(text(" Artists ") | bold, artist_menu->Render() | frame | flex) |
                       size(WIDTH, EQUAL, half_width);
 
-  auto album_inner = window(text(" Songs ") | bold, album_scroller->Render() | frame | flex) |
+  auto album_inner = window(text(" Songs ") | bold, album_view->Render() | frame | flex) |
                      size(WIDTH, EQUAL, term.dimx - half_width);
 
   Color artist_border_color = m_state.focusOnArtists() ? Color::Green : Color::GrayDark;

src/frontend/ftxui/ui/screens/Queue.cc

@@ -22,9 +22,8 @@ QueueScreen::QueueScreen(state::queue::QueueState& state) : m_state(state)
 
       for (size_t i = 0; i < size; ++i)
       {
-        auto metaOpt = m_audioPtr->getMetadataAt(i);
-
-        std::string title = metaOpt ? metaOpt->title : "<unknown>";
+        auto        metaOpt = m_audioPtr->getMetadataAt(i);
+        std::string title   = metaOpt ? metaOpt->title : "<unknown>";
 
         Element row = hbox({
           text(i == current ? "▶ " : "  "),
@@ -34,7 +33,7 @@ QueueScreen::QueueScreen(state::queue::QueueState& state) : m_state(state)
         if ((int)i == m_state.selected())
           row = row | bgcolor(Color::RGB(40, 60, 90)) | color(Color::White) | bold;
 
-        rows.push_back(row | frame);
+        rows.push_back(row);
       }
 
       if (rows.empty())
@@ -43,6 +42,29 @@ QueueScreen::QueueScreen(state::queue::QueueState& state) : m_state(state)
       return vbox(rows);
     });
 
+  queue_view = Renderer(
+    queue_content,
+    [&]() -> Element
+    {
+      const size_t size = m_audioPtr->getPlaylistSize();
+
+      if (size > 1)
+      {
+        queue_scroll_target = float(m_state.selected()) / float(std::max<size_t>(1, size - 1));
+      }
+
+      // ---- smoothing ----
+      constexpr float smoothing = 0.15f;
+      queue_scroll += (queue_scroll_target - queue_scroll) * smoothing;
+
+      if (std::abs(queue_scroll_target - queue_scroll) < 0.001f)
+        queue_scroll = queue_scroll_target;
+
+      queue_scroll = std::clamp(queue_scroll, 0.0f, 1.0f);
+
+      return queue_content->Render() | focusPositionRelative(0.0f, queue_scroll) | frame | flex;
+    });
+
   meta_content = Renderer(
     [&]() -> Element
     {
@@ -141,7 +163,7 @@ auto QueueScreen::render() -> Element
   auto term       = Terminal::Size();
   int  half_width = term.dimx / 2;
 
-  auto queue_inner = window(text(" Queue ") | bold, queue_content->Render() | frame | flex) |
+  auto queue_inner = window(text(" Queue ") | bold, queue_view->Render() | frame | flex) |
                      size(WIDTH, EQUAL, half_width);
 
   auto meta_inner = window(text(" Track Info ") | bold, meta_content->Render() | frame | flex) |