[gnome-maps/wip/osrm-routing: 22/24] Sidebar: Port to GtkBuilder



commit 490c565501c026535e1f9f5b1a1c5d8bb2cb3bcc
Author: Mattias Bengtsson <mattias jc bengtsson gmail com>
Date:   Mon Jun 17 18:29:38 2013 +0200

    Sidebar: Port to GtkBuilder
    
    Port to a sidebar.ui file and use the new Utils.getUIObject.

 src/gnome-maps.gresource.xml |    1 +
 src/sidebar.js               |   46 ++++-------
 src/sidebar.ui               |  177 ++++++++++++++++++++++++++++++++++++++++++
 3 files changed, 194 insertions(+), 30 deletions(-)
---
diff --git a/src/gnome-maps.gresource.xml b/src/gnome-maps.gresource.xml
index 5916d8f..d9f915c 100644
--- a/src/gnome-maps.gresource.xml
+++ b/src/gnome-maps.gresource.xml
@@ -3,6 +3,7 @@
   <gresource prefix="/org/gnome/maps">
     <file preprocess="xml-stripblanks">app-menu.ui</file>
     <file preprocess="xml-stripblanks">main-window.ui</file>
+    <file preprocess="xml-stripblanks">sidebar.ui</file>
     <file alias="application.css">../data/gnome-maps.css</file>
   </gresource>
 </gresources>
diff --git a/src/sidebar.js b/src/sidebar.js
index cb9eb05..5ab917e 100644
--- a/src/sidebar.js
+++ b/src/sidebar.js
@@ -39,41 +39,27 @@ const Sidebar = new Lang.Class({
     Name: 'Sidebar',
 
     _init: function() {
+        this._ui = Utils.getUIObject('sidebar', ['sidebar',
+                                                 'instructions-list',
+                                                 'revealer',
+                                                 'reveal-button']);
+        this._ui.revealButton.connect('clicked', this.toggle.bind(this));
+
+        this._ui.revealer.orientation = Gtk.Orientation.VERTICAL;
+        this._ui.revealer.show_all();
+        
         this.actor = new Clutter.Actor({ layout_manager: new Clutter.BoxLayout({ spacing: 12 }),
                                          y_expand: true,
                                          x_align: Clutter.ActorAlign.END });
         this.actor.hide();
         
-        // create the button
-        this._revealButton = new Gd.HeaderSimpleButton({ valign: Gtk.Align.CENTER });
-        this._revealButton.get_style_context().add_class('osd');
-        this._revealButton.connect('clicked', this.toggle.bind(this));
-
-        // then the sidebar itself, packed into the revealer
-        let grid = new Gtk.Grid({ vexpand: true,
-                                  hexpand: true,
-                                  margin_top: 32,
-                                  margin_left: 32,
-                                  margin_right: 32,
-                                  row_spacing: 15,
-                                  orientation: Gtk.Orientation.VERTICAL,
-                                  valign: Gtk.Align.FILL });
-
-        let container = new Gtk.Frame({ child: grid,
-                                        shadow_type: Gtk.ShadowType.IN,
-                                        width_request: 200 });
-        container.get_style_context().add_class('maps-sidebar');
-
-        this._revealer = new Gd.Revealer({ child: container,
-                                           orientation: Gtk.Orientation.VERTICAL });
-        this._revealer.show_all();
         // now create actors
-        let buttonActor = new GtkClutter.Actor({ contents: this._revealButton,
+        let buttonActor = new GtkClutter.Actor({ contents: this._ui.revealButton,
                                                  x_align: Clutter.ActorAlign.END });
         Utils.clearGtkClutterActorBg(buttonActor);
         this.actor.add_child(buttonActor);
 
-        let revealerActor = new GtkClutter.Actor({ contents: this._revealer,
+        let revealerActor = new GtkClutter.Actor({ contents: this._ui.revealer,
                                                    x_align: Clutter.ActorAlign.END,
                                                    x_expand: true,
                                                    y_expand: true });
@@ -82,13 +68,13 @@ const Sidebar = new Lang.Class({
     },
 
     reveal: function() {
-        this._revealer.reveal_child = true;
-        this._revealButton.symbolic_icon_name = 'go-next-symbolic';
+        this._ui.revealer.reveal_child = true;
+        this._ui.revealButton.symbolic_icon_name = 'go-next-symbolic';
     },
 
     conceal: function() {
-        this._revealer.reveal_child = false;
-        this._revealButton.symbolic_icon_name = 'go-previous-symbolic';
+        this._ui.revealer.reveal_child = false;
+        this._ui.revealButton.symbolic_icon_name = 'go-previous-symbolic';
     },
 
     toggle: function() {
@@ -99,6 +85,6 @@ const Sidebar = new Lang.Class({
     },
 
     isRevealed: function() {
-        return this._revealer.reveal_child;
+        return this._ui.revealer.reveal_child;
     }
 });
diff --git a/src/sidebar.ui b/src/sidebar.ui
new file mode 100644
index 0000000..76fef33
--- /dev/null
+++ b/src/sidebar.ui
@@ -0,0 +1,177 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<interface>
+  <!-- interface-requires gtk+ 3.6 -->
+  <object class="GdRevealer" id="revealer">
+    <!-- <property name="orentation">vertical</property> -->
+    <child>
+         <object class="GtkFrame" id="sidebar">
+        <property name="width_request">200</property>
+        <property name="visible">True</property>
+               <property name="can_focus">False</property>
+               <property name="label_xalign">1</property>
+               <property name="shadow_type">none</property>
+               <child>
+                 <object class="GtkGrid" id="grid">
+                       <property name="visible">True</property>
+                       <property name="can_focus">False</property>
+                       <property name="margin_left">32</property>
+                       <property name="margin_right">32</property>
+                       <property name="margin_top">32</property>
+                       <property name="hexpand">True</property>
+                       <property name="vexpand">True</property>
+                       <property name="orientation">vertical</property>
+                       <property name="row_spacing">15</property>
+                       <style>
+                         <class name="maps-sidebar"/>
+                       </style>
+                       <child>
+                         <object class="GtkButtonBox" id="mode">
+                               <property name="width_request">20</property>
+                               <property name="visible">True</property>
+                               <property name="can_focus">False</property>
+                               <property name="halign">center</property>
+                               <property name="spacing">3</property>
+                               <property name="homogeneous">True</property>
+                               <child>
+                                 <object class="GtkToggleButton" id="mode-walk-toggle">
+                                       <property name="label" translatable="yes">W</property>
+                                       <property name="visible">True</property>
+                                       <property name="can_focus">True</property>
+                                       <property name="receives_default">True</property>
+                                 </object>
+                                 <packing>
+                                       <property name="expand">False</property>
+                                       <property name="fill">True</property>
+                                       <property name="position">0</property>
+                                 </packing>
+                               </child>
+                               <child>
+                  <object class="GtkToggleButton" id="mode-car-toggle">
+                                       <property name="label" translatable="yes">C</property>
+                                       <property name="visible">True</property>
+                                       <property name="can_focus">True</property>
+                                       <property name="receives_default">True</property>
+                                 </object>
+                                 <packing>
+                                       <property name="expand">False</property>
+                                       <property name="fill">True</property>
+                                       <property name="position">1</property>
+                                 </packing>
+                               </child>
+                               <child>
+                  <object class="GtkToggleButton" id="mode-transit-toggle">
+                                       <property name="label" translatable="yes">PT</property>
+                                       <property name="visible">True</property>
+                                       <property name="can_focus">True</property>
+                                       <property name="receives_default">True</property>
+                                 </object>
+                                 <packing>
+                                       <property name="expand">False</property>
+                                       <property name="fill">True</property>
+                                       <property name="position">2</property>
+                                 </packing>
+                               </child>
+                         </object>
+                         <packing>
+                               <property name="left_attach">0</property>
+                               <property name="top_attach">2</property>
+                               <property name="width">2</property>
+                               <property name="height">1</property>
+                         </packing>
+                       </child>
+            <child>
+              <object class="GtkLabel" id="to-label">
+                <property name="visible">True</property>
+                <property name="can_focus">False</property>
+                <property name="halign">end</property>
+                <property name="margin_right">15</property>
+                <property name="label" translatable="yes">To</property>
+              </object>
+              <packing>
+                <property name="left_attach">0</property>
+                <property name="top_attach">1</property>
+                <property name="width">1</property>
+                <property name="height">1</property>
+              </packing>
+            </child>
+                       <child>
+                         <object class="GtkEntry" id="to-entry">
+                               <property name="visible">True</property>
+                               <property name="can_focus">True</property>
+                               <property name="invisible_char">●</property>
+                               <property name="invisible_char_set">True</property>
+                         </object>
+                         <packing>
+                               <property name="left_attach">1</property>
+                               <property name="top_attach">1</property>
+                               <property name="width">1</property>
+                               <property name="height">1</property>
+                         </packing>
+                       </child>
+                       <child>
+                         <object class="GtkLabel" id="from-label">
+                               <property name="visible">True</property>
+                               <property name="can_focus">False</property>
+                               <property name="halign">end</property>
+                               <property name="margin_right">15</property>
+                               <property name="label" translatable="yes">From</property>
+                         </object>
+                         <packing>
+                               <property name="left_attach">0</property>
+                               <property name="top_attach">0</property>
+                               <property name="width">1</property>
+                               <property name="height">1</property>
+                         </packing>
+                       </child>
+                       <child>
+                         <object class="GtkEntry" id="from-entry">
+                               <property name="visible">True</property>
+                               <property name="can_focus">True</property>
+                               <property name="valign">end</property>
+                               <property name="invisible_char">●</property>
+                               <property name="width_chars">2</property>
+                               <property name="invisible_char_set">True</property>
+                         </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>
+              <object class="GtkListBox" id="instructions-list"/>
+              <packing>
+                <property name="left_attach">0</property>
+                <property name="top_attach">3</property>
+                <property name="width">2</property>
+                <property name="height">1</property>
+              </packing>
+            </child>
+                 </object>
+               </child>
+               <child type="label">
+                 <object class="GtkButton" id="close-button">
+                       <property name="visible">True</property>
+                       <property name="can_focus">True</property>
+                       <property name="receives_default">True</property>
+                       <property name="margin_right">3</property>
+                       <property name="margin_top">3</property>
+                       <property name="image">closeImage</property>
+                       <property name="relief">none</property>
+                 </object>
+               </child>
+         </object>
+       </child>
+  </object>
+  <object class="GtkImage" id="closeImage">
+    <property name="visible">True</property>
+    <property name="can_focus">False</property>
+    <property name="stock">gtk-close</property>
+  </object>
+  <object class="GdHeaderSimpleButton" id="reveal-button">
+    <property name="visible">True</property>
+    <property name="can_focus">False</property>
+    <property name="valign">center</property>
+  </object>
+</interface>


[Date Prev][Date Next]   [Thread Prev][Thread Next]   [Thread Index] [Date Index] [Author Index]