Use Vala instead of Blueprint for the main UI (#176)

data/resources/konbucase.gresource.xml.in

@@ -1,8 +1,6 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <gresources>
   <gresource prefix="/com/github/ryonakano/konbucase">
-    <file preprocess="xml-stripblanks">ui/text-pane.ui</file>
-    <file preprocess="xml-stripblanks">ui/main-window.ui</file>
     <file preprocess="xml-stripblanks">gtk/help-overlay.ui</file>
 
     <file preprocess="xml-stripblanks" alias="@[email protected]">../@[email protected]</file>

data/resources/meson.build

@@ -1,7 +1,5 @@
 blueprints = custom_target('blueprints',
     input: files(
-        'ui/text-pane.blp',
-        'ui/main-window.blp',
         'gtk/help-overlay.blp',
     ),
     output: '.',

po/POTFILES

@@ -1,8 +1,6 @@
 data/resources/gtk/help-overlay.ui
 data/konbucase.desktop.in.in
 data/konbucase.metainfo.xml.in.in
-data/resources/ui/main-window.blp
-data/resources/ui/text-pane.blp
 src/Application.vala
 src/Model/TextPaneModel.vala
 src/View/MainWindow.vala

src/View/MainWindow.vala

@@ -3,28 +3,13 @@
  * SPDX-FileCopyrightText: 2020-2024 Ryo Nakano <[email protected]>
  */
 
-[GtkTemplate (ui = "/com/github/ryonakano/konbucase/ui/main-window.ui")]
 public class MainWindow : Adw.ApplicationWindow {
-    // Main menu model
-    public Menu main_menu { get; private set; }
-
-    [GtkChild]
-    private unowned Adw.ToastOverlay overlay;
-    [GtkChild]
-    private unowned TextPane source_pane;
-    [GtkChild]
-    private unowned TextPane result_pane;
-
-    [GtkChild]
-    private unowned TextPaneModel source_model;
-    [GtkChild]
-    private unowned TextPaneModel result_model;
-    [GtkChild]
-    private unowned MainWindowModel window_model;
+    private Adw.ToastOverlay overlay;
 
     public MainWindow (Application app) {
         Object (
-            application: app
+            application: app,
+            title: "KonbuCase"
         );
     }
 
@@ -39,7 +24,7 @@ public class MainWindow : Adw.ApplicationWindow {
         style_submenu.append (_("_Light"), "app.color-scheme(\"force-light\")");
         style_submenu.append (_("_Dark"), "app.color-scheme(\"force-dark\")");
 
-        main_menu = new Menu ();
+        var main_menu = new Menu ();
         main_menu.append_submenu (_("_Style"), style_submenu);
         main_menu.append (_("Keyboard Shortcuts"), "win.show-help-overlay");
         // Pantheon prefers AppCenter instead of an about dialog for app details, so prevent it from being shown on Pantheon
@@ -48,9 +33,57 @@ public class MainWindow : Adw.ApplicationWindow {
             main_menu.append (_("_About KonbuCase"), "app.about");
         }
 
+        var menu_button = new Gtk.MenuButton () {
+            tooltip_text = _("Main Menu"),
+            icon_name = "open-menu",
+            menu_model = main_menu,
+            primary = true
+        };
+
+        var header = new Adw.HeaderBar ();
+        header.pack_end (menu_button);
+
+        var source_model = new TextPaneModel (Define.TextType.SOURCE);
+        var result_model = new TextPaneModel (Define.TextType.RESULT);
+        var window_model = new MainWindowModel (source_model, result_model);
+
+        var source_pane = new TextPane (
+            source_model,
+            _("Convert _From:"),
+            true
+        );
+
+        var separator = new Gtk.Separator (Gtk.Orientation.VERTICAL) {
+            vexpand = true
+        };
+
+        var result_pane = new TextPane (
+            result_model,
+            _("Convert _To:"),
+            // Make the text view uneditable, otherwise the app freezes
+            false
+        );
+
+        var content_box = new Gtk.Box (Gtk.Orientation.HORIZONTAL, 0);
+        content_box.append (source_pane);
+        content_box.append (separator);
+        content_box.append (result_pane);
+
+        overlay = new Adw.ToastOverlay () {
+            child = content_box
+        };
+
+        var toolbar_view = new Adw.ToolbarView ();
+        toolbar_view.add_top_bar (header);
+        toolbar_view.set_content (overlay);
+
+        content = toolbar_view;
+        width_request = 700;
+        height_request = 500;
+
         // The action users most frequently take is to input the source text.
         // So, forcus to the source view by default.
-        source_pane.get_source_view ().grab_focus ();
+        source_pane.focus_source_view ();
 
         // Perform conversion when:
         //

src/View/TextPane.vala

@@ -3,7 +3,6 @@
  * SPDX-FileCopyrightText: 2020-2024 Ryo Nakano <[email protected]>
  */
 
-[GtkTemplate (ui = "/com/github/ryonakano/konbucase/ui/text-pane.ui")]
 public class TextPane : Gtk.Box {
     public signal void dropdown_changed ();
     public signal void copy_button_clicked ();
@@ -12,12 +11,7 @@ public class TextPane : Gtk.Box {
     public string header_label { get; construct; }
     public bool editable { get; construct; }
 
-    [GtkChild]
-    private unowned Gtk.DropDown case_dropdown;
-    [GtkChild]
-    private unowned Gtk.Button copy_clipboard_button;
-    [GtkChild]
-    private unowned GtkSource.View source_view;
+    private GtkSource.View source_view;
 
     public TextPane (TextPaneModel model, string header_label, bool editable) {
         Object (
@@ -28,8 +22,58 @@ public class TextPane : Gtk.Box {
     }
 
     construct {
+        orientation = Gtk.Orientation.VERTICAL;
+        spacing = 0;
+
+        var case_dropdown = new Gtk.DropDown.from_strings ({
+            _("Space separated"),
+            "camelCase",
+            "PascalCase",
+            "snake_case",
+            "kebab-case",
+            "Sentence case",
+        });
         case_dropdown.selected = model.case_type;
 
+        var case_label = new Gtk.Label (header_label) {
+            use_underline = true,
+            mnemonic_widget = case_dropdown
+        };
+
+        var case_info_button_icon = new Gtk.Image.from_icon_name ("dialog-information-symbolic") {
+            tooltip_text = model.case_description
+        };
+
+        var copy_clipboard_button = new Gtk.Button.from_icon_name ("edit-copy") {
+            tooltip_text = _("Copy to Clipboard")
+        };
+
+        var toolbar = new Gtk.Box (Gtk.Orientation.HORIZONTAL, 12) {
+            valign = Gtk.Align.CENTER,
+            margin_top = 6,
+            margin_bottom = 6,
+            margin_start = 6,
+            margin_end = 6
+        };
+        toolbar.append (case_label);
+        toolbar.append (case_dropdown);
+        toolbar.append (case_info_button_icon);
+        toolbar.append (copy_clipboard_button);
+
+        source_view = new GtkSource.View.with_buffer (model.buffer) {
+            wrap_mode = Gtk.WrapMode.WORD_CHAR,
+            hexpand = true,
+            vexpand = true,
+            editable = editable
+        };
+
+        var scrolled = new Gtk.ScrolledWindow () {
+            child = source_view
+        };
+
+        append (toolbar);
+        append (scrolled);
+
         case_dropdown.notify["selected"].connect (() => {
             model.case_type = (Define.CaseType) case_dropdown.selected;
 
@@ -52,8 +96,7 @@ public class TextPane : Gtk.Box {
         );
     }
 
-    // UI elements defined in .ui files can't be a property, so defines a getter method instead
-    public unowned GtkSource.View get_source_view () {
-        return source_view;
+    public void focus_source_view () {
+        source_view.grab_focus ();
     }
 }