[gnome-maps/wip/mlundblad/aerial-hybrid] layersPopover: Add checkbox to toggle hybrid aerial

[Marcus Lundblad <mlundblad src gnome org>]

commit 89b14c415f4856486ac84fb5c3b3ce24a0d1a257
Author: Marcus Lundblad <ml update uu se>
Date:   Sun Jun 21 12:15:43 2020 +0200

    layersPopover: Add checkbox to toggle hybrid aerial
    
    Also update the thumbnail to reflect the style.

 data/ui/layers-popover.ui | 37 +++++++++++++++++++++++++++++++++++--
 src/layersPopover.js      | 33 ++++++++++++++++++++++++++++++---
 2 files changed, 65 insertions(+), 5 deletions(-)
---
diff --git a/data/ui/layers-popover.ui b/data/ui/layers-popover.ui
index 22ec9c81..423c4a86 100644
--- a/data/ui/layers-popover.ui
+++ b/data/ui/layers-popover.ui
@@ -47,6 +47,39 @@
             <property name="top-attach">1</property>
           </packing>
         </child>
+        <child>
+          <object class="GtkRevealer" id="hybridAerialRevealer">
+            <property name="can-focus">False</property>
+            <property name="visible">True</property>
+            <child>
+              <object class="GtkBox">
+                <property name="orientation">GTK_ORIENTATION_HORIZONTAL</property>
+                <property name="visible">True</property>
+                <property name="can-focus">False</property>
+                <child>
+                  <object class="GtkLabel">
+                    <property name="visible">True</property>
+                    <property name="can-focus">False</property>
+                    <property name="hexpand">True</property>
+                    <property name="halign">GTK_ALIGN_START</property>
+                    <property name="label" translatable="yes">Show Labels</property>
+                  </object>
+                </child>
+                <child>
+                  <object class="GtkCheckButton">
+                    <property name="visible">True</property>
+                    <property name="can-focus">True</property>
+                    <property name="action-name">win.hybrid-aerial</property>
+                  </object>
+                </child>
+              </object>
+            </child>
+          </object>
+          <packing>
+            <property name="left-attach">0</property>
+            <property name="top-attach">2</property>
+          </packing>
+        </child>
         <child>
           <object class="GtkListBox" id="layersListBox">
             <property name="name">layers-list-box</property>
@@ -59,7 +92,7 @@
           </object>
           <packing>
             <property name="left-attach">0</property>
-            <property name="top-attach">2</property>
+            <property name="top-attach">3</property>
           </packing>
         </child>
         <child>
@@ -71,7 +104,7 @@
           </object>
           <packing>
             <property name="left-attach">0</property>
-            <property name="top-attach">3</property>
+            <property name="top-attach">4</property>
           </packing>
         </child>
       </object>
diff --git a/src/layersPopover.js b/src/layersPopover.js
index 0526e684..1c18f25e 100644
--- a/src/layersPopover.js
+++ b/src/layersPopover.js
@@ -65,6 +65,7 @@ var LayersPopover = GObject.registerClass({
                         'aerialLayerButton',
                         'streetLayerImage',
                         'aerialLayerImage',
+                        'hybridAerialRevealer',
                         'layersListBox',
                         'loadLayerButton' ]
 }, class LayersPopover extends Gtk.Popover {
@@ -115,6 +116,13 @@ var LayersPopover = GObject.registerClass({
                 lastLocation: { x: -1, y: -1, z: -1 }
             };
         }
+        if (Service.getService().tiles.hybridAerial) {
+            this._layerPreviews.hybridAerial = {
+                source: MapSource.createHybridAerialSource(),
+                widget: this._aerialLayerImage,
+                lastLocation: { x: -1, y: -1, z: -1 }
+            };
+        }
 
         // disable the map type switch buttons if aerial is unavailable
         if (Service.getService().tiles.aerial) {
@@ -138,6 +146,8 @@ var LayersPopover = GObject.registerClass({
                                        this._setLayerPreviews.bind(this));
             Application.settings.connect("changed::night-mode",
                                          this._onNightModeChanged.bind(this));
+            Application.settings.connect("changed::hybrid-aerial",
+                                         this._onHybridAerialChanged.bind(this));
 
         } else {
             this._streetLayerButton.visible = false;
@@ -159,6 +169,15 @@ var LayersPopover = GObject.registerClass({
         }
     }
 
+    _onHybridAerialChanged() {
+        if (Service.getService().tiles.hybridAerial &&
+            Application.settings.get('hybrid-aerial')) {
+            this._setLayerPreviewImage('hybridAerial', true);
+        } else {
+            this._setLayerPreviewImage('aerial', true);
+        }
+    }
+
     _setLayerPreviews() {
         if (Service.getService().tiles.streetDark &&
             Application.settings.get('night-mode')) {
@@ -166,7 +185,12 @@ var LayersPopover = GObject.registerClass({
         } else {
             this._setLayerPreviewImage('street');
         }
-        this._setLayerPreviewImage('aerial');
+        if (Service.getService().tiles.hybridAerial &&
+            Application.settings.get('hybrid-aerial')) {
+            this._setLayerPreviewImage('hybridAerial');
+        } else {
+            this._setLayerPreviewImage('aerial');
+        }
     }
 
     _setLayerPreviewImage(layer, forceUpdate = false) {
@@ -216,10 +240,13 @@ var LayersPopover = GObject.registerClass({
     }
 
     setMapType(mapType) {
-        if (mapType === MapView.MapType.STREET)
+        if (mapType === MapView.MapType.STREET) {
             this._streetLayerButton.active = true;
-        else if (mapType === MapView.MapType.AERIAL)
+            this._hybridAerialRevealer.reveal_child = false;
+        } else if (mapType === MapView.MapType.AERIAL) {
             this._aerialLayerButton.active = true;
+            this._hybridAerialRevealer.reveal_child = true;
+        }
     }
 
     _onRemoveClicked(row) {