[gnome-maps/wip/routing: 1/3] wip: searchpopup as GtkPopover

[Jonas Danielsson <jonasdn src gnome org>]

commit 1f7950e28aa6d1c3cdf97929ce9abdf271f6c27a
Author: Jonas Danielsson <jonas threetimestwo org>
Date:   Sun Feb 2 15:53:15 2014 +0100

    wip: searchpopup as GtkPopover

 data/gnome-maps.css |   13 +++++++++----
 src/mainWindow.js   |    6 ++----
 src/search-popup.ui |   49 ++++++++++++++++++++-----------------------------
 src/searchPopup.js  |   17 ++++++++---------
 4 files changed, 39 insertions(+), 46 deletions(-)
---
diff --git a/data/gnome-maps.css b/data/gnome-maps.css
index 87df2ac..c9bf4e7 100644
--- a/data/gnome-maps.css
+++ b/data/gnome-maps.css
@@ -6,11 +6,16 @@
     border-width: 0 1px 0 0;
 }
 
-.search-popup {
+.maps-popover {
+       margin: 0px;
+       padding: 5px;
+       border-radius: 0px;
+}
+
+.search-popover GtkTreeView {
        border-style: solid;
-       border-width: 5px;
-       border-color: black;
-       border-radius: 6px 6px 6px 6px;
+       border-width: 1px;
+       border-color: darker(@theme_bg_color);
        background-color: white;
 }
 
diff --git a/src/mainWindow.js b/src/mainWindow.js
index 742d543..6f42edb 100644
--- a/src/mainWindow.js
+++ b/src/mainWindow.js
@@ -45,7 +45,7 @@ const _CONFIGURE_ID_TIMEOUT = 100; // msecs
 const _WINDOW_MIN_WIDTH = 600;
 const _WINDOW_MIN_HEIGHT = 500;
 
-const _PLACE_ICON_SIZE = 20;
+const _PLACE_ICON_SIZE = 24;
 
 const SearchResults = {
     COL_ICON:         0,
@@ -82,8 +82,6 @@ const MainWindow = new Lang.Class({
         this._initSignals();
         this._restoreWindowGeometry();
 
-        this._mapOverlay.add_overlay(this._searchPopup);
-
         grid.add(this._mapOverlay);
 
         grid.show_all();
@@ -100,7 +98,7 @@ const MainWindow = new Lang.Class({
     },
 
     _initSearchWidgets: function() {
-        this._searchPopup = new SearchPopup.SearchPopup(10);
+        this._searchPopup = new SearchPopup.SearchPopup(this._searchEntry, 10);
 
         let model = new Gtk.ListStore();
         model.set_column_types([GdkPixbuf.Pixbuf,
diff --git a/src/search-popup.ui b/src/search-popup.ui
index 5547c7d..45cab13 100644
--- a/src/search-popup.ui
+++ b/src/search-popup.ui
@@ -1,46 +1,37 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <interface>
   <!-- interface-requires gtk+ 3.10 -->
-  <object class="GtkFrame" id="frame">
+  <object class="GtkScrolledWindow" id="scrolled-window">
     <property name="visible">True</property>
     <property name="can_focus">False</property>
-    <style>
-      <class name="search-popup" />
-    </style>
+    <property name="hscrollbar_policy">never</property>
     <child>
-      <object class="GtkScrolledWindow" id="scrolled-window">
+      <object class="GtkStack" id="stack">
         <property name="visible">True</property>
         <property name="can_focus">False</property>
-        <property name="hscrollbar_policy">never</property>
+        <property name="transition-type">crossfade</property>
         <child>
-          <object class="GtkStack" id="stack">
+          <object class="GtkTreeView" id="treeview">
             <property name="visible">True</property>
             <property name="can_focus">False</property>
-            <property name="transition-type">crossfade</property>
-            <child>
-              <object class="GtkTreeView" id="treeview">
-                <property name="visible">True</property>
-                <property name="can_focus">False</property>
-                <property name="expand">True</property>
-                <property name="headers-visible">False</property>
-                <property name="hover-selection">True</property>
-                <child internal-child="selection">
-                  <object class="GtkTreeSelection" id="treeview-selection"/>
-                </child>
-              </object>
-            </child>
-            <child>
-              <object class="GtkSpinner" id="spinner">
-                <property name="visible">True</property>
-                <property name="can_focus">False</property>
-                <property name="halign">center</property>
-                <property name="valign">center</property>
-                <property name="width_request">16</property>
-                <property name="height_request">16</property>
-              </object>
+            <property name="expand">True</property>
+            <property name="headers-visible">False</property>
+            <property name="hover-selection">True</property>
+            <child internal-child="selection">
+              <object class="GtkTreeSelection" id="treeview-selection"/>
             </child>
           </object>
         </child>
+        <child>
+          <object class="GtkSpinner" id="spinner">
+            <property name="visible">True</property>
+            <property name="can_focus">False</property>
+            <property name="halign">center</property>
+            <property name="valign">center</property>
+            <property name="width_request">16</property>
+            <property name="height_request">16</property>
+          </object>
+        </child>
       </object>
     </child>
   </object>
diff --git a/src/searchPopup.js b/src/searchPopup.js
index 44dc0d2..604fbae 100644
--- a/src/searchPopup.js
+++ b/src/searchPopup.js
@@ -30,13 +30,12 @@ const Columns = {
 
 const SearchPopup = new Lang.Class({
     Name: 'SearchPopup',
-    Extends: Gtk.Bin,
+    Extends: Gtk.Popover,
 
-    _init: function(numVisible) {
+    _init: function(relativeTo, numVisible) {
         this._numVisible = numVisible;
 
-        let ui = Utils.getUIObject('search-popup', ['frame',
-                                                    'scrolled-window',
+        let ui = Utils.getUIObject('search-popup', ['scrolled-window',
                                                     'stack',
                                                     'spinner',
                                                     'treeview']);
@@ -53,14 +52,14 @@ const SearchPopup = new Lang.Class({
         this.height_request = this._cellHeight * this._numVisible;
         this._scrolledWindow.set_min_content_height(this.height_request);
 
-        this.parent({ width_request: 500,
-                      halign: Gtk.Align.CENTER,
-                      valign: Gtk.Align.START,
-                      margin_top: 10,
+        this.parent({ relative_to: relativeTo,
+                      width_request: 500,
                       no_show_all: true,
                       visible: true });
 
-        this.add(ui.frame);
+        this.get_style_context().add_class('maps-popover');
+        this.get_style_context().add_class('search-popover');
+        this.add(this._scrolledWindow);
         this.hide();
     },