musicus/data/ui/home_page.blp

using Gtk 4.0;
using Adw 1;

template $MusicusHomePage : Adw.NavigationPage {
  title: _("Musicus");
  tag: "home";

  Gtk.Overlay {
    Adw.ToolbarView {
      [top]
      Adw.HeaderBar header_bar {
        [end]
        MenuButton {
          icon-name: "open-menu-symbolic";
          menu-model: primary_menu;
        }
      }

      [top]
      Adw.Clamp {
        maximum-size: 1000;
        tightening-threshold: 600;

        $MusicusSearchEntry search_entry {
          activate => $select() swapped;
        }
      }

      Gtk.Stack stack {
        Gtk.StackPage {
          name: "results";
          child: Gtk.ScrolledWindow {
            hscrollbar-policy: never;

            Adw.Clamp {
              maximum-size: 1000;
              tightening-threshold: 600;

              Gtk.Box {
                orientation: vertical;
                margin-start: 12;
                margin-end: 12;
                margin-top: 24;
                margin-bottom: 68;

                Gtk.Label {
                  styles ["heading"]
                  visible: bind composers_flow_box.visible; 
                  halign: start;
                  label: _("Composers");
                }

                Gtk.FlowBox composers_flow_box {
                  margin-top: 12;
                  margin-bottom: 24;
                  column-spacing: 12;
                  row-spacing: 12;
                  homogeneous: true;
                  selection-mode: none;
                  child-activated => $tile_selected() swapped;
                }

                Gtk.Label {
                  styles ["heading"]
                  visible: bind performers_flow_box.visible; 
                  halign: start;
                  label: _("Performers");
                }

                Gtk.FlowBox performers_flow_box {
                  margin-top: 12;
                  margin-bottom: 24;
                  column-spacing: 12;
                  row-spacing: 12;
                  homogeneous: true;
                  selection-mode: none;
                  child-activated => $tile_selected() swapped;
                }

                Gtk.Label {
                  styles ["heading"]
                  visible: bind ensembles_flow_box.visible; 
                  halign: start;
                  label: _("Ensembles");
                }

                Gtk.FlowBox ensembles_flow_box {
                  margin-top: 12;
                  margin-bottom: 24;
                  column-spacing: 12;
                  row-spacing: 12;
                  homogeneous: true;
                  selection-mode: none;
                  child-activated => $tile_selected() swapped;
                }

                Gtk.Label {
                  styles ["heading"]
                  visible: bind works_flow_box.visible;
                  halign: start;
                  label: _("Works");
                }

                Gtk.FlowBox works_flow_box {
                  margin-top: 12;
                  margin-bottom: 24;
                  column-spacing: 12;
                  row-spacing: 12;
                  homogeneous: true;
                  selection-mode: none;
                  child-activated => $tile_selected() swapped;
                }

                Gtk.Label {
                  styles ["heading"]
                  visible: bind recordings_flow_box.visible;
                  halign: start;
                  label: _("Recordings");
                }

                Gtk.FlowBox recordings_flow_box {
                  margin-top: 12;
                  margin-bottom: 24;
                  column-spacing: 12;
                  row-spacing: 12;
                  homogeneous: true;
                  selection-mode: none;
                  child-activated => $recording_selected() swapped;
                }
              }
            }
          };
        }
        Gtk.StackPage {
          name: "empty";
          child: Adw.StatusPage {
            icon-name: "system-search-symbolic";
            title: _("Nothing Found");
            description: _("Try a different search.");
          };
        }
      }
    }

    [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 {
  item {
    label: _("_Preferences");
    action: "app.preferences";
  }
  item {
    label: _("_About Musicus");
    action: "app.about";
  }
}