[gnome-maps/wip/mlundblad/headerbar-zoom] WIP: mainWindow: Show zoom control buttons in headerbar

[Marcus Lundblad <mlundblad src gnome org>]

commit 689fb8062d6ac7f0b66083a7febb097f4b73fc7e
Author: Marcus Lundblad <ml update uu se>
Date:   Tue Dec 12 23:07:41 2017 +0100

    WIP: mainWindow: Show zoom control buttons in headerbar
    
    Since overlaying GTK widgets on the Champlain view
    doesn't work on Wayland.

 data/ui/main-window.ui |   40 ++++++++++++++++++++++++++++++++++++++++
 src/mainWindow.js      |   29 +++++++++++++++++++++++++++--
 2 files changed, 67 insertions(+), 2 deletions(-)
---
diff --git a/data/ui/main-window.ui b/data/ui/main-window.ui
index 411ee21..6dc33e3 100644
--- a/data/ui/main-window.ui
+++ b/data/ui/main-window.ui
@@ -55,6 +55,46 @@
           </object>
         </child>
         <child>
+          <object class="GtkBox">
+            <property name="visible">True</property>
+            <style>
+              <class name="linked"/>
+            </style>
+            <child>
+              <object class="GtkButton" id="zoomInButton">
+                <property name="visible">True</property>
+                <property name="can-focus">True</property>
+                <property name="valign">center</property>
+                <property name="action-name">win.zoom-in</property>
+                <property name="tooltip-text" translatable="yes" comments="Translators: This is a 
tooltip">Zoom in</property>
+                <child>
+                  <object class="GtkImage">
+                    <property name="visible">True</property>
+                    <property name="icon-size">1</property>
+                    <property name="icon-name">zoom-in-symbolic</property>
+                  </object>
+                </child>
+              </object>
+            </child>
+            <child>
+              <object class="GtkButton" id="zoomOutButton">
+                <property name="visible">True</property>
+                <property name="can-focus">True</property>
+                <property name="valign">center</property>
+                <property name="action-name">win.zoom-out</property>
+                <property name="tooltip-text" translatable="yes" comments="Translators: This is a 
tooltip">Zoom out</property>
+                <child>
+                  <object class="GtkImage">
+                    <property name="visible">True</property>
+                    <property name="icon-size">1</property>
+                    <property name="icon-name">zoom-out-symbolic</property>
+                  </object>
+                </child>
+              </object>
+            </child>
+          </object>
+        </child>
+        <child>
           <object class="GtkToggleButton" id="toggleSidebarButton">
             <property name="visible">True</property>
             <property name="can-focus">True</property>
diff --git a/src/mainWindow.js b/src/mainWindow.js
index cb9ca58..bb9fb77 100644
--- a/src/mainWindow.js
+++ b/src/mainWindow.js
@@ -86,7 +86,9 @@ var MainWindow = new Lang.Class({
                         'toggleSidebarButton',
                         'layersButton',
                         'favoritesButton',
-                        'printRouteButton' ],
+                        'printRouteButton',
+                        'zoomInButton',
+                        'zoomOutButton' ],
 
     get mapView() {
         return this._mapView;
@@ -118,7 +120,7 @@ var MainWindow = new Lang.Class({
         });
         this._layersButton.popover = this.layersPopover;
         this._favoritesButton.popover = new FavoritesPopover.FavoritesPopover({ mapView: this._mapView });
-        this._overlay.add_overlay(new ZoomControl.ZoomControl(this._mapView));
+        //this._overlay.add_overlay(new ZoomControl.ZoomControl(this._mapView));
 
         this._mainStack.add(this._overlay);
         this._busy = new BusyMarker.BusyMarker();
@@ -305,6 +307,29 @@ var MainWindow = new Lang.Class({
 
             return false;
         }).bind(this));
+
+        this._mapView.view.connect('notify::zoom-level',
+                                   this._updateZoomButtonsSensitivity.bind(this));
+        this._mapView.view.connect('notify::max-zoom-level',
+                                   this._updateZoomButtonsSensitivity.bind(this));
+        this._mapView.view.connect('notify::min-zoom-level',
+                                   this._updateZoomButtonsSensitivity.bind(this));
+    },
+
+    _updateZoomButtonsSensitivity: function() {
+        let zoomLevel = this._mapView.view.zoom_level;
+        let maxZoomLevel = this._mapView.view.max_zoom_level;
+        let minZoomLevel = this._mapView.view.min_zoom_level;
+
+        if (zoomLevel >= maxZoomLevel)
+            this._zoomInButton.set_sensitive(false);
+        else
+            this._zoomInButton.set_sensitive(true);
+
+        if (zoomLevel <= minZoomLevel)
+            this._zoomOutButton.set_sensitive(false);
+        else
+            this._zoomOutButton.set_sensitive(true);
     },
 
     _updateLocationSensitivity: function() {