[gnome-contacts] Contacts.Window: use template for composited widgets

[Erick Pérez Castellanos <erickpc src gnome org>]

commit 42d90effb5f301c05d02348ac2f8ae6b0dfe93f3
Author: Erick Pérez Castellanos <erick red gmail com>
Date:   Thu Aug 15 21:17:50 2013 -0400

    Contacts.Window: use template for composited widgets

 configure.ac               |    1 +
 src/Makefile.am            |    4 +-
 src/contacts-window.ui     |  133 ++++++++++++++++++++++++++++++++++++++++++++
 src/contacts-window.vala   |   67 ++++------------------
 src/contacts.gresource.xml |    3 +-
 5 files changed, 152 insertions(+), 56 deletions(-)
---
diff --git a/configure.ac b/configure.ac
index 34d970d..48286fc 100644
--- a/configure.ac
+++ b/configure.ac
@@ -37,6 +37,7 @@ AC_SUBST(GETTEXT_PACKAGE)
 
 pkg_modules="gtk+-3.0 >= 3.9.1
             glib-2.0 >= 2.37.6
+            gmodule-export-2.0
             gnome-desktop-3.0
             folks >= 0.7.3
             folks-telepathy
diff --git a/src/Makefile.am b/src/Makefile.am
index 2d38e1d..6b52b3e 100644
--- a/src/Makefile.am
+++ b/src/Makefile.am
@@ -13,6 +13,7 @@ AM_CPPFLAGS = \
 AM_VALAFLAGS = \
        --vapidir=../vapi --vapidir=../libgd --pkg config --pkg custom --pkg gd-1.0 \
        @CONTACTS_PACKAGES@ \
+       --target-glib=2.38 --gresources=$(srcdir)/contacts.gresource.xml \
        $(NULL)
 
 if BUILD_CHEESE
@@ -60,7 +61,7 @@ gsettings_SCHEMAS = $(gsettingsschema_in_files:.xml.in=.xml)
 
 @GSETTINGS_RULES@
 
-contact-resources.c: contacts.gresource.xml app-menu.ui
+contact-resources.c: contacts.gresource.xml app-menu.ui contacts-window.ui
        $(AM_V_GEN) $(GLIB_COMPILE_RESOURCES) $(srcdir)/contacts.gresource.xml \
                --target=$@ --sourcedir=$(srcdir) --c-name contacts --generate-source
 
@@ -103,6 +104,7 @@ EXTRA_DIST = \
        um-crop-area.h \
        contacts.gresource.xml \
        app-menu.ui \
+       contacts-window.ui \
        $(gsettingsschema_in_files)     \
        contacts-esd-setup.h \
        $(NULL)
diff --git a/src/contacts-window.ui b/src/contacts-window.ui
new file mode 100644
index 0000000..ed13cc4
--- /dev/null
+++ b/src/contacts-window.ui
@@ -0,0 +1,133 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!-- Generated with glade 3.15.2 on Thu Aug 15 15:33:02 2013 -->
+<interface>
+  <!-- interface-requires gtk+ 3.10 -->
+  <template class="ContactsWindow" parent="GtkWindow">
+    <property name="can_focus">False</property>
+    <property name="default_width">800</property>
+    <property name="default_height">600</property>
+    <child type="titlebar">
+      <object class="GtkBox" id="box1">
+        <property name="visible">True</property>
+        <property name="can_focus">False</property>
+        <child>
+          <object class="GtkHeaderBar" id="left_toolbar">
+            <property name="visible">True</property>
+            <property name="can_focus">False</property>
+            <property name="title" translatable="yes">All Contacts</property>
+            <style>
+              <class name="contacts-left-header-bar"/>
+            </style>
+            <child>
+              <object class="GtkButton" id="add_button">
+                <property name="visible">True</property>
+                <property name="can_focus">True</property>
+                <style>
+                  <class name="image-button"/>
+                </style>
+                <child>
+                  <object class="GtkImage" id="image1">
+                    <property name="visible">True</property>
+                    <property name="can_focus">False</property>
+                    <property name="icon_name">list-add-symbolic</property>
+                    <property name="icon_size">1</property>
+                  </object>
+                </child>
+              </object>
+              <packing>
+                <property name="pack_type">start</property>
+              </packing>
+            </child>
+            <child>
+              <object class="GtkToggleButton" id="select_button">
+                <property name="visible">True</property>
+                <property name="can_focus">True</property>
+                <property name="focus_on_click">False</property>
+                <property name="halign">center</property>
+                <property name="valign">center</property>
+                <style>
+                  <class name="image-button"/>
+                </style>
+                <child>
+                  <object class="GtkImage" id="image2">
+                    <property name="visible">True</property>
+                    <property name="can_focus">False</property>
+                    <property name="icon_name">object-select-symbolic</property>
+                    <property name="icon_size">1</property>
+                  </object>
+                </child>
+              </object>
+              <packing>
+                <property name="pack_type">end</property>
+              </packing>
+            </child>
+          </object>
+        </child>
+        <child>
+          <object class="GtkHeaderBar" id="right_toolbar">
+            <property name="visible">True</property>
+            <property name="hexpand">True</property>
+            <property name="show_close_button">True</property>
+            <child>
+              <object class="GtkButton" id="edit_button">
+                <property name="visible">True</property>
+                <property name="can_focus">True</property>
+                <property name="focus_on_click">False</property>
+                <property name="label" translatable="yes">Edit</property>
+                <property name="width_request">70</property>
+              </object>
+              <packing>
+                <property name="pack_type">end</property>
+              </packing>
+            </child>
+            <child>
+              <object class="GtkButton" id="done_button">
+                <property name="visible">True</property>
+                <property name="can_focus">True</property>
+                <property name="focus_on_click">False</property>
+                <property name="label" translatable="yes">Done</property>
+                <property name="width_request">70</property>
+                <style>
+                  <class name="suggested-action"/>
+                </style>
+              </object>
+              <packing>
+                <property name="pack_type">end</property>
+              </packing>
+            </child>
+          </object>
+        </child>
+      </object>
+    </child>
+    <child>
+      <object class="GtkOverlay" id="overlay">
+        <property name="visible">True</property>
+        <property name="can_focus">False</property>
+        <child>
+          <object class="GtkGrid" id="grid">
+            <property name="visible">True</property>
+            <property name="can_focus">False</property>
+            <child>
+              <object class="GtkOverlay" id="right_overlay">
+                <property name="visible">True</property>
+                <property name="can_focus">False</property>
+                <child>
+                  <placeholder/>
+                </child>
+              </object>
+              <packing>
+                <property name="left_attach">1</property>
+                <property name="top_attach">0</property>
+                <property name="width">1</property>
+                <property name="height">1</property>
+              </packing>
+            </child>
+            <child>
+              <placeholder/>
+            </child>
+          </object>
+        </child>
+      </object>
+    </child>
+  </template>
+</interface>
diff --git a/src/contacts-window.vala b/src/contacts-window.vala
index 445a68d..a954443 100644
--- a/src/contacts-window.vala
+++ b/src/contacts-window.vala
@@ -19,17 +19,28 @@
 using Gtk;
 using Folks;
 
+[GtkTemplate (ui = "/org/gnome/contacts/contacts-window.ui")]
 public class Contacts.Window : Gtk.ApplicationWindow {
+  [GtkChild]
   private HeaderBar left_toolbar;
+  [GtkChild]
   private HeaderBar right_toolbar;
+  [GtkChild]
   private Overlay overlay;
+  [GtkChild]
   private Grid grid;
+  [GtkChild]
+  private Overlay right_overlay;
 
   /* FIXME: remove from public what it is not needed */
+  [GtkChild]
   public Button add_button;
-  public Gd.HeaderToggleButton select_button;
+  [GtkChild]
+  public ToggleButton select_button;
 
+  [GtkChild]
   public Button edit_button;
+  [GtkChild]
   public Button done_button;
 
   public string left_title {
@@ -53,53 +64,6 @@ public class Contacts.Window : Gtk.ApplicationWindow {
   public Window (Gtk.Application app) {
     Object (application: app);
 
-    set_default_size (800, 600);
-
-    /* building ui, latter replaced by .ui resource file */
-    /* titlebar */
-    var titlebar = new Box (Orientation.HORIZONTAL, 0);
-    left_toolbar = new HeaderBar ();
-    left_toolbar.get_style_context ().add_class ("contacts-left-header-bar");
-    titlebar.add (left_toolbar);
-
-    /* FIXME: Here it should not be 'All' but the source of the contacts subset your
-     viewing, if it happens to be 'All', well */
-    left_toolbar.set_title (_("All Contacts"));
-
-    var add_image = new Gtk.Image.from_icon_name ("list-add-symbolic", IconSize.MENU);
-    add_button = new Button ();
-    add_button.add (add_image);
-    left_toolbar.pack_start (add_button);
-
-    var select_image = new Gtk.Image.from_icon_name ("object-select-symbolic", IconSize.MENU);
-    select_button = new Gd.HeaderToggleButton ();
-    select_button.add (select_image);
-    left_toolbar.pack_end (select_button);
-
-    right_toolbar = new HeaderBar ();
-    right_toolbar.set ("show-close-button", true);
-    titlebar.pack_end (right_toolbar, true, true, 0);
-
-    edit_button = new Button.with_label (_("Edit"));
-    edit_button.set_size_request (70, -1);
-    right_toolbar.pack_end (edit_button);
-
-    done_button = new Button.with_label (_("Done"));
-    done_button.set_size_request (70, -1);
-    done_button.get_style_context ().add_class ("suggested-action");
-    right_toolbar.pack_end (done_button);
-
-    titlebar.show_all ();
-    set_titlebar (titlebar);
-
-    overlay = new Gtk.Overlay ();
-    Gdk.RGBA transparent = { 0, 0, 0, 0 };
-    overlay.override_background_color (0, transparent);
-
-    add (overlay);
-
-    grid = new Grid();
-    overlay.add (grid);
   }
 
   public void activate_selection_mode (bool active) {
@@ -121,7 +85,7 @@ public class Contacts.Window : Gtk.ApplicationWindow {
   }
 
   public void add_left_child (Widget child) {
-    grid.attach (child, 0, 1, 1, 1);
+    grid.attach (child, 0, 0, 1, 1);
 
     /* horizontal size group, for the splitted headerbar */
     var hsize_group = new SizeGroup (SizeGroupMode.HORIZONTAL);
@@ -130,12 +94,7 @@ public class Contacts.Window : Gtk.ApplicationWindow {
   }
 
   public void add_right_child (Widget child) {
-    Gdk.RGBA transparent = { 0, 0, 0, 0 };
-    var right_overlay = new Overlay ();
-    right_overlay.override_background_color (0, transparent);
     right_overlay.add (child);
-
-    grid.attach (right_overlay, 1, 1, 1, 1);
   }
 
   public void add_notification (Widget notification) {
diff --git a/src/contacts.gresource.xml b/src/contacts.gresource.xml
index 8cebfc2..a28dcaa 100644
--- a/src/contacts.gresource.xml
+++ b/src/contacts.gresource.xml
@@ -1,6 +1,7 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <gresources>
   <gresource prefix="/org/gnome/contacts">
-    <file>app-menu.ui</file>
+    <file compressed="true" preprocess="xml-stripblanks">app-menu.ui</file>
+    <file compressed="true" preprocess="xml-stripblanks">contacts-window.ui</file>
   </gresource>
 </gresources>