Add play button and player bar

data/res/home_page.blp

@@ -5,6 +5,7 @@ template $MusicusHomePage : Adw.NavigationPage {
   title: _("Musicus");
   tag: "home";
 
+  Gtk.Overlay {
     Adw.ToolbarView {
       [top]
       Adw.HeaderBar header_bar {
@@ -25,6 +26,7 @@ template $MusicusHomePage : Adw.NavigationPage {
 
           Gtk.SearchEntry search_entry {
             placeholder-text: _("Enter composers, performers, works…");
+            search-changed => $search() swapped;
           }
         }
       }
@@ -41,6 +43,7 @@ template $MusicusHomePage : Adw.NavigationPage {
             margin-start: 12;
             margin-end: 12;
             margin-top: 24;
+            margin-bottom: 68;
 
             Gtk.Label {
               styles ["heading"]
@@ -52,8 +55,8 @@ template $MusicusHomePage : Adw.NavigationPage {
             Gtk.FlowBox persons_flow_box {
               margin-top: 12;
               margin-bottom: 24;
-            column-spacing: 14;
-            row-spacing: 14;
+              column-spacing: 12;
+              row-spacing: 12;
               homogeneous: true;
               selection-mode: none;
             }
@@ -68,8 +71,8 @@ template $MusicusHomePage : Adw.NavigationPage {
             Gtk.FlowBox works_flow_box {
               margin-top: 12;
               margin-bottom: 24;
-            column-spacing: 14;
-            row-spacing: 14;
+              column-spacing: 12;
+              row-spacing: 12;
               homogeneous: true;
               selection-mode: none;
             }
@@ -84,8 +87,8 @@ template $MusicusHomePage : Adw.NavigationPage {
             Gtk.FlowBox recordings_flow_box {
               margin-top: 12;
               margin-bottom: 24;
-            column-spacing: 14;
-            row-spacing: 14;
+              column-spacing: 12;
+              row-spacing: 12;
               homogeneous: true;
               selection-mode: none;
             }
@@ -93,6 +96,18 @@ template $MusicusHomePage : Adw.NavigationPage {
         }
       }
     }
+
+    [overlay]
+    Gtk.Button play_button {
+      styles ["pill", "suggested-action"]
+      halign: end;
+      valign: end;
+      margin-end: 24;
+      margin-bottom: 24;
+      label: _("Play music");
+      clicked => $play() swapped;
+    }
+  }
 }
 
 menu primary_menu {

data/res/icons/scalable/actions/playlist-symbolic.svg

@@ -0,0 +1,2 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg xmlns="http://www.w3.org/2000/svg" height="16px" viewBox="0 0 16 16" width="16px"><path d="m 3 3 v 2 h 10 v -2 z m 0 4 v 2 h 5.980469 v -2 z m 0 4 v 2 h 6 l -0.011719 -2 z m 0 0"/><path d="m 10 7 v 6 h 1 c 0.199219 0 0.390625 -0.058594 0.554688 -0.167969 l 3 -2 c 0.59375 -0.394531 0.59375 -1.269531 0 -1.664062 l -3 -2 c -0.164063 -0.109375 -0.355469 -0.167969 -0.554688 -0.167969 z m 0 0"/></svg>

data/res/musicus.gresource.xml

@@ -1,6 +1,7 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <gresources>
   <gresource prefix="/de/johrpan/musicus">
+    <file preprocess="xml-stripblanks">icons/scalable/actions/playlist-symbolic.svg</file>
     <file preprocess="xml-stripblanks">home_page.ui</file>
     <file preprocess="xml-stripblanks">tile.ui</file>
     <file preprocess="xml-stripblanks">welcome_page.ui</file>

data/res/window.blp

@@ -6,6 +6,7 @@ template $MusicusWindow : Adw.ApplicationWindow {
   default-width: 800;
   default-height: 600;
 
+  Adw.ToolbarView {
     Adw.NavigationView navigation_view {
       $MusicusWelcomePage {
         folder-selected => $set_library_folder() swapped;
@@ -13,4 +14,55 @@ template $MusicusWindow : Adw.ApplicationWindow {
 
       $MusicusHomePage {}
     }
+
+    [bottom]
+    Gtk.Revealer player_bar_revealer {
+      reveal-child: false;
+      transition-type: slide_up;
+
+      Gtk.Box {
+        margin-start: 6;
+        margin-end: 6;
+        margin-top: 6;
+        margin-bottom: 6;
+        spacing: 6;
+
+        Gtk.Button play_button {
+          styles ["circular"]
+          valign: center;
+          icon-name: "media-playback-start-symbolic";
+        }
+
+        Gtk.Box {
+          hexpand: true;
+          valign: center;
+          orientation: vertical;
+
+          Gtk.Label title_label {
+            styles ["caption-heading"]
+            halign: start;
+            label: _("Title");
+          }
+
+          Gtk.Label subtitle_label {
+            styles ["caption"]
+            halign: start;
+            label: _("Subtitle");
+          }
+        }
+
+        Gtk.Label {
+          styles ["caption", "numeric"]
+          valign: center;
+          label: "00:00 / 01:00";
+        }
+
+        Gtk.Button {
+          styles ["flat"]
+          valign: center;
+          icon-name: "playlist-symbolic";
+        }
+      }
+    }
+  }
 }

src/home_page.rs

@@ -1,5 +1,5 @@
 use adw::subclass::{navigation_page::NavigationPageImpl, prelude::*};
-use gtk::glib;
+use gtk::{glib, prelude::*};
 
 mod imp {
     use crate::tile::MusicusTile;
@@ -17,6 +17,8 @@ mod imp {
         pub works_flow_box: TemplateChild<gtk::FlowBox>,
         #[template_child]
         pub recordings_flow_box: TemplateChild<gtk::FlowBox>,
+        #[template_child]
+        pub play_button: TemplateChild<gtk::Button>,
     }
 
     #[glib::object_subclass]
@@ -27,6 +29,7 @@ mod imp {
 
         fn class_init(klass: &mut Self::Class) {
             klass.bind_template();
+            klass.bind_template_instance_callbacks();
         }
 
         fn instance_init(obj: &glib::subclass::InitializingObject<Self>) {
@@ -57,8 +60,19 @@ glib::wrapper! {
         @extends gtk::Widget, adw::NavigationPage;
 }
 
+#[gtk::template_callbacks]
 impl MusicusHomePage {
     pub fn new() -> Self {
         glib::Object::new()
     }
+
+    #[template_callback]
+    fn play(&self, _: &gtk::Button) {
+        log::info!("Play button clicked");
+    }
+
+    #[template_callback]
+    fn search(&self, entry: &gtk::SearchEntry) {
+        log::info!("Search changed: \"{}\"", entry.text());
+    }
 }

src/window.rs

@@ -11,6 +11,8 @@ mod imp {
     pub struct MusicusWindow {
         #[template_child]
         pub navigation_view: TemplateChild<adw::NavigationView>,
+        #[template_child]
+        pub player_bar_revealer: TemplateChild<gtk::Revealer>,
     }
 
     #[glib::object_subclass]