using Gtk 4.0;
using Adw 1;

Adw.Window _root {
  default-width: 650;
  default-height: 650;
  width-request: 320;
  modal: true;
  hide-on-close: true;

  content: Adw.ToolbarView {
    [top]
    Adw.HeaderBar {
      title-widget: Adw.WindowTitle { 
        title: _("Lyrics");
      };

      styles ["flat"]
    }

    content: Gtk.WindowHandle {
      vexpand: true;

      Adw.ToastOverlay _toast {
        hexpand: true;
        vexpand: true;
        
        Gtk.ScrolledWindow {
          child: Gtk.Box {
            orientation: vertical;
            spacing: 12;

            Adw.PreferencesGroup {
              title: _("Configure");
              margin-start: 24;
              margin-end: 24;

              Adw.ComboRow _typeRow {
                title: _("Type");

                [prefix]
                Gtk.Image {
                  icon-name: "quotation-symbolic";
                }

                model: Gtk.StringList {
                  strings [_("Unsynchronized"), _("Synchronized")]
                };
              }

              Adw.EntryRow _languageRow {
                title: _("Language Code");

                [prefix]
                Gtk.Image {
                  icon-name: "language-symbolic";
                }
              }

              Adw.EntryRow _descriptionRow {
                title: _("Description");

                [prefix]
                Gtk.Image {
                  icon-name: "note-symbolic";
                }
              }

              Adw.EntryRow _syncOffsetRow {
                title: _("Offset (in milliseconds)");
                show-apply-button: true;
                visible: false;

                [prefix]
                Gtk.Image {
                  icon-name: "hourglass-symbolic";
                }
              }
            }

            Adw.ViewStack _viewStack {
              Adw.ViewStackPage {
                name: "unsync";
                child: Adw.PreferencesGroup {
                  title: _("Edit");
                  margin-start: 24;
                  margin-end: 24;
                  margin-bottom: 24;

                  Gtk.ScrolledWindow {
                    min-content-height: 120;

                    Gtk.TextView _unsyncTextView {
                      hexpand: true;
                      vexpand: true;
                      top-margin: 6;
                      left-margin: 12;
                      right-margin: 12;
                      bottom-margin: 6;

                      styles ["card"]
                    }
                  }
                };
              }

              Adw.ViewStackPage {
                name: "sync";
                child: Gtk.Box {
                  orientation: vertical;

                  Adw.PreferencesGroup _syncGroup {
                    title: _("Edit");
                    margin-start: 24;
                    margin-end: 24;

                    [header-suffix]
                    Gtk.Box {
                      orientation: horizontal;
                      spacing: 6;
                      valign: center;

                      Gtk.Button _addSyncLyricButton {
                        Adw.ButtonContent {
                          label: _("Add");
                          icon-name: "list-add-symbolic";
                        }

                        styles ["flat"]
                      }

                      Gtk.Button _clearSyncButton {
                        icon-name: "user-trash-symbolic";
                        tooltip-text: _("Clear All Lyrics");

                        styles ["flat"]
                      }

                      Gtk.Button _importSyncButton {
                        icon-name: "document-send-symbolic";
                        tooltip-text: _("Import from LRC");

                        styles ["flat"]
                      }

                      Gtk.Button _exportSyncButton {
                        icon-name: "folder-download-symbolic";
                        tooltip-text: _("Export to LRC");

                        styles ["flat"]
                      }
                    }
                  }

                  Gtk.ListBox _syncList {
                    selection-mode: none;
                    valign: start;
                    margin-start: 24;
                    margin-end: 24;
                    margin-bottom: 24;

                    styles ["boxed-list"]
                  }
                };
              }
            }
          };
        }
      }
    };
  };

  Gtk.ShortcutController {
    Gtk.Shortcut {
      trigger: "Escape";
      action: "action(window.close)";
    }
  }
}
