Updates Settings dialog

Author: xchan14

data/Application.css

@@ -1,4 +1,3 @@
-
 .settings-button,
 .resize-button {
   background-color: transparent;
@@ -7,11 +6,11 @@
   box-shadow: none;
 }
 
-  .settings-button:focus-visible,
-  .resize-button:focus-visible {
-    outline: none;
-    box-shadow: none;
-  }
+.settings-button:focus-visible,
+.resize-button:focus-visible {
+  outline: none;
+  box-shadow: none;
+}
 
 .settings-dialog {
   padding-right: 16px;
@@ -26,7 +25,7 @@
   border-right: none;
   border-top-right-radius: 0;
   border-bottom-right-radius: 0;
-  outline: none; 
+  outline: none;
   box-shadow: none;
 }
 
@@ -36,6 +35,20 @@
   box-shadow: none;
 }
 
+.album-picker-text {
+  border-right: none;
+  border-top-right-radius: 0;
+  border-bottom-right-radius: 0;
+  outline: none;
+  box-shadow: none;
+}
+
+.album-picker-btn {
+  border-top-left-radius: 0;
+  border-bottom-left-radius: 0;
+  box-shadow: none;
+}
+
 .window-legend-label {
   padding-top: 30px;
 }

meson.build

@@ -31,6 +31,7 @@ executable(
     'src' / 'Application.vala',
     'src' / 'Constants.vala',
     'src' / 'widgets' / 'EntryButton.vala',
+    'src' / 'widgets' / 'AlbumPicker.vala',
     'src' / 'views' / 'MainWindow.vala',
     'src' / 'views' / 'SettingsDialog.vala',
     'src' / 'models' / 'SlideshowImage.vala',

src/views/SettingsDialog.vala

@@ -9,7 +9,12 @@ using Larawan.Widgets;
 
 public class Larawan.Views.SettingsDialog : Granite.Dialog {
 
-    EntryButton album_folder = null;
+    const double MAX_WINDOW_HEIGHT = 650;
+    const double MAX_WINDOW_WIDTH = 650;
+    const double MIN_WINDOW_HEIGHT = 300;
+    const double MIN_WINDOW_WIDTH = 300;
+
+    AlbumPicker album_picker = null;
     Switch shuffle_switch = null;
     GLib.Settings settings;
     FileDialog file_dialog;
@@ -61,11 +66,11 @@ public class Larawan.Views.SettingsDialog : Granite.Dialog {
     }
 
     private void bind_events () {
-        album_folder.clicked.connect (() => {
+        album_picker.clicked.connect (() => {
             file_dialog.select_folder.begin (window, null, (obj, result) => {
                 try {
                     File file = file_dialog.select_folder.end (result);
-                    album_folder.text = file.get_path ();
+                    album_picker.value = file.get_path ();
                 } catch (Error e) {
                     info (e.message);
                 }
@@ -81,7 +86,7 @@ public class Larawan.Views.SettingsDialog : Granite.Dialog {
 
     private void bind_settings () {
         settings = new GLib.Settings (APP_ID);
-        settings.bind ("album-folder", album_folder, "text", SettingsBindFlags.DEFAULT);
+        settings.bind ("album-folder", album_picker, "value", SettingsBindFlags.DEFAULT);
         settings.bind ("shuffle", shuffle_switch, "active", SettingsBindFlags.DEFAULT);
         settings.bind ("recursive", recursive_switch, "active", SettingsBindFlags.DEFAULT);
         settings.bind ("duration", duration_scale.adjustment, "value", SettingsBindFlags.DEFAULT);
@@ -95,9 +100,8 @@ public class Larawan.Views.SettingsDialog : Granite.Dialog {
             width_request = 150,
             hexpand = false
         };
-        album_folder = new EntryButton.from_icon_name ("folder-open");
-        album_folder.readonly = true;
-        album_folder.hexpand = true;
+        album_picker = new AlbumPicker.from_icon_name ("folder-open");
+        album_picker.hexpand = true;
         string pictures_dir = Path.build_filename (Environment.get_home_dir (), "Pictures");
 
         file_dialog = new FileDialog () {
@@ -106,7 +110,7 @@ public class Larawan.Views.SettingsDialog : Granite.Dialog {
 
         var album_folder_box = new Box (Orientation.HORIZONTAL, 10);
         album_folder_box.append (folder_label);
-        album_folder_box.append (album_folder);
+        album_folder_box.append (album_picker);
         root_box.append (album_folder_box);
     }
 
@@ -192,7 +196,12 @@ public class Larawan.Views.SettingsDialog : Granite.Dialog {
             width_request = 150
         };
 
-        window_width_scale = new Scale.with_range (Orientation.HORIZONTAL, 300, 800, 1) {
+        window_width_scale = new Scale.with_range (
+            Orientation.HORIZONTAL, 
+            MIN_WINDOW_WIDTH, 
+            MAX_WINDOW_WIDTH, 
+            1
+        ) {
             digits = 0,
             draw_value = true,
             hexpand = true,
@@ -212,7 +221,12 @@ public class Larawan.Views.SettingsDialog : Granite.Dialog {
             width_request = 150
         };
 
-        window_height_scale = new Scale.with_range (Orientation.HORIZONTAL, 300, 800, 1) {
+        window_height_scale = new Scale.with_range (
+            Orientation.HORIZONTAL, 
+            MIN_WINDOW_HEIGHT,
+            MAX_WINDOW_HEIGHT, 
+            1
+        ) {
             digits = 0,
             draw_value = true,
             hexpand = true,

src/widgets/AlbumPicker.vala

@@ -0,0 +1,71 @@
+/*
+ * SPDX-License-Identifier: GPL-3.0-or-later
+ * SPDX-FileCopyrightText: 2024 Christian Camilon <[email protected]>
+ */
+using Gtk;
+
+namespace Larawan.Widgets {
+
+    public class AlbumPicker : Gtk.Box {
+        Button value_text;
+        Button button;
+        string _value;
+
+        public signal void clicked ();
+
+        public string text {
+            get {
+                return this.value_text.label;
+            }
+            protected set {
+                this.value_text.label = value;
+            }
+        }
+
+        public string value {
+            get {
+                return this._value;
+            }
+            set {
+                this._value = value;
+            }
+        }
+
+        public string icon_name { get; construct set; }
+
+        public AlbumPicker.from_icon_name (string icon_name) {
+            Object (icon_name: icon_name);
+        }
+
+        construct {
+            orientation = Orientation.HORIZONTAL;
+
+            value_text = new Button () {
+                hexpand = true
+            };
+            value_text.add_css_class ("album-picker-text");
+
+            button = new Button.from_icon_name (icon_name);
+            if (button.get_icon_name () != null) {
+                button.remove_css_class ("image-button");
+            }
+            button.add_css_class ("album-picker-btn");
+
+            append (value_text);
+            append (button);
+
+            value_text.clicked.connect(() => clicked());
+            button.clicked.connect (() => clicked ());
+
+            notify["value"].connect(on_value_changed);
+        }
+
+        private void on_value_changed() {
+            update_text();
+        }
+
+        private void update_text() {
+            this.text = Path.get_basename(value);
+        }
+    }
+}