From 2741bf21ae6d53324a512dacef65d540be840fe4 Mon Sep 17 00:00:00 2001
From: Teemu Ikonen <tpikonen@mailbox.org>
Date: Mon, 12 Sep 2022 17:07:14 +0300
Subject: [PATCH] Convert main window layout to 2 vertical boxes

Use Adw.Window as main window widget, add the now missing HeaderBars to
MainWindowPlaceholder and MainWindow in the NoCSD case.
---
 main/data/unified_main_content.ui       | 177 +++++++++++++-----------
 main/data/unified_window_placeholder.ui |  12 +-
 main/src/ui/main_window.vala            |  32 ++---
 3 files changed, 118 insertions(+), 103 deletions(-)

diff --git a/main/data/unified_main_content.ui b/main/data/unified_main_content.ui
index 3fb7b6e5..f1294ab9 100644
--- a/main/data/unified_main_content.ui
+++ b/main/data/unified_main_content.ui
@@ -7,68 +7,22 @@
         <property name="resize-start-child">False</property>
         <property name="position">300</property>
         <child>
-            <object class="GtkStack" id="left_stack">
+            <object class="GtkBox" id="left_box">
+                <property name="orientation">vertical</property>
                 <child>
-                    <object class="GtkStackPage">
-                        <property name="name">content</property>
-                        <property name="child">
-                            <object class="GtkScrolledWindow">
-                                <property name="hscrollbar_policy">never</property>
-                                <child>
-                                    <object class="DinoUiConversationSelector" id="conversation_list">
-                                    </object>
-                                </child>
-                            </object>
-                        </property>
-                    </object>
-                </child>
-                <child>
-                    <object class="GtkStackPage">
-                        <property name="name">placeholder</property>
-                        <property name="child">
-                            <object class="GtkBox">
-                                <property name="margin-start">20</property>
-                                <property name="margin-end">20</property>
-                                <property name="margin-top">20</property>
-                                <property name="margin-bottom">20</property>
-                                <property name="spacing">10</property>
-                                <property name="valign">start</property>
-                                <property name="halign">start</property>
-                                <child>
-                                    <object class="GtkImage" id="conversation_list_placeholder_image">
-                                        <property name="valign">start</property>
-                                        <style>
-                                            <class name="dim-label"/>
-                                        </style>
-                                    </object>
-                                </child>
-                                <child>
-                                    <object class="GtkLabel">
-                                        <property name="wrap">1</property>
-                                        <property name="margin-top">70</property>
-                                        <property name="margin-end">50</property>
-                                        <property name="valign">end</property>
-                                        <property name="label" translatable="1">Click here to start a conversation or join a channel.</property>
-                                        <style>
-                                            <class name="dim-label"/>
-                                        </style>
-                                    </object>
-                                </child>
-                            </object>
-                        </property>
-                    </object>
-                </child>
-            </object>
-        </child>
-        <child>
-            <object class="GtkOverlay">
-                <property name="child">
-                    <object class="GtkStack" id="right_stack">
+                    <object class="GtkStack" id="left_stack">
+                        <property name="hexpand">False</property>
                         <child>
                             <object class="GtkStackPage">
                                 <property name="name">content</property>
                                 <property name="child">
-                                    <object class="DinoUiConversationView" id="conversation_view">
+                                    <object class="GtkScrolledWindow">
+                                        <property name="hscrollbar_policy">never</property>
+                                        <property name="vexpand">1</property>
+                                        <child>
+                                            <object class="DinoUiConversationSelector" id="conversation_list">
+                                            </object>
+                                        </child>
                                     </object>
                                 </property>
                             </object>
@@ -78,16 +32,17 @@
                                 <property name="name">placeholder</property>
                                 <property name="child">
                                     <object class="GtkBox">
-                                        <property name="orientation">vertical</property>
-                                        <property name="hexpand">1</property>
-                                        <property name="vexpand">1</property>
-                                        <property name="halign">center</property>
-                                        <property name="valign">center</property>
+                                        <property name="margin-start">20</property>
+                                        <property name="margin-end">20</property>
+                                        <property name="margin-top">20</property>
+                                        <property name="margin-bottom">20</property>
+                                        <property name="spacing">10</property>
+                                        <property name="valign">start</property>
+                                        <property name="halign">start</property>
+                                        <property name="width_request">260</property>
                                         <child>
-                                            <object class="GtkImage">
-                                                <property name="icon-name">im.dino.Dino-symbolic</property>
-                                                <property name="pixel-size">144</property>
-                                                <property name="margin-bottom">30</property>
+                                            <object class="GtkImage" id="conversation_list_placeholder_image">
+                                                <property name="valign">start</property>
                                                 <style>
                                                     <class name="dim-label"/>
                                                 </style>
@@ -95,13 +50,16 @@
                                         </child>
                                         <child>
                                             <object class="GtkLabel">
-                                                <property name="label" translatable="1">You have no open chats</property>
+                                                <property name="wrap">1</property>
+                                                <property name="margin-top">70</property>
+                                                <property name="margin-end">50</property>
+                                                <property name="xalign">0</property>
+                                                <property name="valign">end</property>
+                                                <property name="max-width-chars">0</property>
+                                                <property name="label" translatable="1">Click here to start a conversation or join a channel.</property>
                                                 <style>
                                                     <class name="dim-label"/>
                                                 </style>
-                                                <attributes>
-                                                    <attribute name="scale" value="1.2"></attribute>
-                                                </attributes>
                                             </object>
                                         </child>
                                     </object>
@@ -109,22 +67,79 @@
                             </object>
                         </child>
                     </object>
-                </property>
-                <child type="overlay">
-                    <object class="GtkRevealer" id="search_revealer">
-                        <property name="halign">end</property>
-                        <property name="transition-type">slide-left</property>
-                        <style>
-                            <class name="dino-sidebar"/>
-                        </style>
+                </child>
+            </object>
+        </child>
+        <child>
+            <object class="GtkBox" id="right_box">
+                <property name="orientation">vertical</property>
+                <child>
+                    <object class="GtkOverlay">
                         <property name="child">
-                            <object class="GtkFrame" id="search_frame">
-                                <property name="width-request">400</property>
+                            <object class="GtkStack" id="right_stack">
+                                <child>
+                                    <object class="GtkStackPage">
+                                        <property name="name">content</property>
+                                        <property name="child">
+                                            <object class="DinoUiConversationView" id="conversation_view">
+                                            </object>
+                                        </property>
+                                    </object>
+                                </child>
+                                <child>
+                                    <object class="GtkStackPage">
+                                        <property name="name">placeholder</property>
+                                        <property name="child">
+                                            <object class="GtkBox">
+                                                <property name="orientation">vertical</property>
+                                                <property name="hexpand">1</property>
+                                                <property name="vexpand">1</property>
+                                                <property name="halign">center</property>
+                                                <property name="valign">center</property>
+                                                <child>
+                                                    <object class="GtkImage">
+                                                        <property name="icon-name">im.dino.Dino-symbolic</property>
+                                                        <property name="pixel-size">144</property>
+                                                        <property name="margin-bottom">30</property>
+                                                        <style>
+                                                            <class name="dim-label"/>
+                                                        </style>
+                                                    </object>
+                                                </child>
+                                                <child>
+                                                    <object class="GtkLabel">
+                                                        <property name="label" translatable="1">You have no open chats</property>
+                                                        <style>
+                                                            <class name="dim-label"/>
+                                                        </style>
+                                                        <attributes>
+                                                            <attribute name="scale" value="1.2"></attribute>
+                                                        </attributes>
+                                                    </object>
+                                                </child>
+                                            </object>
+                                        </property>
+                                    </object>
+                                </child>
                             </object>
                         </property>
+                        <child type="overlay">
+                            <object class="GtkRevealer" id="search_revealer">
+                                <property name="halign">end</property>
+                                <property name="transition-type">slide-left</property>
+                                <style>
+                                    <class name="dino-sidebar"/>
+                                </style>
+                                <property name="child">
+                                    <object class="GtkFrame" id="search_frame">
+                                        <property name="width-request">400</property>
+                                    </object>
+                                </property>
+                            </object>
+                        </child>
                     </object>
                 </child>
             </object>
         </child>
     </object>
-</interface>
\ No newline at end of file
+</interface>
diff --git a/main/data/unified_window_placeholder.ui b/main/data/unified_window_placeholder.ui
index 997d7220..91958077 100644
--- a/main/data/unified_window_placeholder.ui
+++ b/main/data/unified_window_placeholder.ui
@@ -2,13 +2,19 @@
 <interface>
     <requires lib="gtk" version="4.0"/>
     <template class="DinoUiMainWindowPlaceholder">
-        <property name="valign">center</property>
+        <property name="valign">fill</property>
         <child>
             <object class="GtkBox" id="box">
                 <property name="orientation">vertical</property>
-                <property name="valign">center</property>
-                <property name="halign">center</property>
+                <property name="valign">fill</property>
+                <property name="halign">fill</property>
                 <property name="hexpand">1</property>
+                <property name="vexpand">1</property>
+                <child>
+                    <object class="GtkHeaderBar">
+                        <property name="show-title-buttons">true</property>
+                    </object>
+                </child>
                 <child>
                     <object class="GtkImage">
                         <property name="icon-name">im.dino.Dino-symbolic</property>
diff --git a/main/src/ui/main_window.vala b/main/src/ui/main_window.vala
index 14058a29..475bd64a 100644
--- a/main/src/ui/main_window.vala
+++ b/main/src/ui/main_window.vala
@@ -6,7 +6,7 @@ using Dino.Entities;
 
 namespace Dino.Ui {
 
-public class MainWindow : Gtk.Window {
+public class MainWindow : Adw.Window {
 
     public signal void conversation_selected(Conversation conversation);
 
@@ -19,10 +19,10 @@ public class MainWindow : Gtk.Window {
     public ConversationSelector conversation_selector;
     public ConversationTitlebar conversation_titlebar;
     public Widget conversation_list_titlebar;
-    public HeaderBar placeholder_headerbar = new HeaderBar() { show_title_buttons=true };
     public Box box = new Box(Orientation.VERTICAL, 0) { orientation=Orientation.VERTICAL };
-    public Paned headerbar_paned = new Paned(Orientation.HORIZONTAL) { resize_start_child=false, shrink_start_child=false, shrink_end_child=false };
     public Paned paned;
+    public Box left_box;
+    public Box right_box;
     public Revealer search_revealer;
     public GlobalSearch global_search;
     private Stack stack = new Stack();
@@ -55,17 +55,17 @@ public class MainWindow : Gtk.Window {
         ((Widget)this).realize.connect(set_window_buttons);
         ((Widget)this).realize.connect(restore_window_size);
 
-        setup_headerbar();
         setup_unified();
+        setup_headerbar();
         setup_stack();
-
-        paned.bind_property("position", headerbar_paned, "position", BindingFlags.SYNC_CREATE | BindingFlags.BIDIRECTIONAL);
     }
 
     private void setup_unified() {
         Builder builder = new Builder.from_resource("/im/dino/Dino/unified_main_content.ui");
         paned = (Paned) builder.get_object("paned");
         box.append(paned);
+        left_box = (Box) builder.get_object("left_box");
+        right_box = (Box) builder.get_object("right_box");
         left_stack = (Stack) builder.get_object("left_stack");
         right_stack = (Stack) builder.get_object("right_stack");
         conversation_view = (ConversationView) builder.get_object("conversation_view");
@@ -85,12 +85,15 @@ public class MainWindow : Gtk.Window {
             conversation_list_titlebar = get_conversation_list_titlebar_csd();
             conversation_titlebar = new ConversationTitlebarCsd();
         } else {
+            Label title_label = new Label("Dino");
+            HeaderBar titlebar = new HeaderBar() { title_widget=title_label, show_title_buttons=true };
+            box.prepend(titlebar);
+
             conversation_list_titlebar = new ConversationListTitlebar();
             conversation_titlebar = new ConversationTitlebarNoCsd();
-            box.append(headerbar_paned);
         }
-        headerbar_paned.set_start_child(conversation_list_titlebar);
-        headerbar_paned.set_end_child(conversation_titlebar.get_widget());
+        left_box.prepend(conversation_list_titlebar);
+        right_box.prepend(conversation_titlebar.get_widget());
     }
 
     private void set_window_buttons() {
@@ -109,7 +112,7 @@ public class MainWindow : Gtk.Window {
         stack.add_named(box, "main");
         stack.add_named(welcome_placeholder, "welcome_placeholder");
         stack.add_named(accounts_placeholder, "accounts_placeholder");
-        set_child(stack);
+        set_content(stack);
     }
 
     public enum StackState {
@@ -125,25 +128,16 @@ public class MainWindow : Gtk.Window {
             right_stack.set_visible_child_name("content");
 
             stack.set_visible_child_name("main");
-            if (Util.use_csd()) {
-                set_titlebar(headerbar_paned);
-            }
         } else if (stack_state == StackState.CLEAN_START || stack_state == StackState.NO_ACTIVE_ACCOUNTS) {
             if (stack_state == StackState.CLEAN_START) {
                 stack.set_visible_child_name("welcome_placeholder");
             } else if (stack_state == StackState.NO_ACTIVE_ACCOUNTS) {
                 stack.set_visible_child_name("accounts_placeholder");
             }
-            if (Util.use_csd()) {
-                set_titlebar(placeholder_headerbar);
-            }
         } else if (stack_state == StackState.NO_ACTIVE_CONVERSATIONS) {
             stack.set_visible_child_name("main");
             left_stack.set_visible_child_name("placeholder");
             right_stack.set_visible_child_name("placeholder");
-            if (Util.use_csd()) {
-                set_titlebar(headerbar_paned);
-            }
         }
     }